MediaWiki:Vector.css: Difference between revisions
Jump to navigation
Jump to search
Rhosyn Celyn (talk | contribs) Created page with "→── GPhys Developer Community – Vector Skin Theme ──: →Page background: html, body, #mw-page-base, #mw-head-base { background-color: #5271ff !important; } →Header bar: #mw-head { background-color: #5271ff !important; border-radius: 0 0 12px 12px !important; } →Personal links (top right): #p-personal li, #p-personal li a { color: #ffffff !important; font-weight: bold !important; } →Nav tabs – text only: div.vectorTabs li { b..." |
Rhosyn Celyn (talk | contribs) No edit summary |
||
| Line 1: | Line 1: | ||
/* ── GPhys Developer Community – Vector Skin Theme ── */ | /* ── GPhys Developer Community – Vector Skin Theme ── */ | ||
/* Page background */ | /* Page background */ | ||
html, body, | html, body, | ||
#mw-page-base, #mw-head-base { | #mw-page-base, #mw-head-base { | ||
background-color: #5271ff !important; | background-color: | ||
#5271ff !important; | |||
} | } | ||
/* Header bar */ | /* Header bar */ | ||
#mw-head { | #mw-head { | ||
background-color: #5271ff !important; | background-color: | ||
#5271ff !important; | |||
border-radius: 0 0 12px 12px !important; | border-radius: 0 0 12px 12px !important; | ||
} | } | ||
/* Personal links (top right) */ | /* Personal links (top right) */ | ||
#p-personal li, | #p-personal li, | ||
#p-personal li a { | #p-personal li a { | ||
color: #ffffff !important; | color: | ||
#ffffff !important; | |||
font-weight: bold !important; | font-weight: bold !important; | ||
} | } | ||
/* Navigation tabs */ | |||
/* | #p-views li a, | ||
#p-cactions li a, | |||
#left-navigation a, | |||
#right-navigation a { | |||
color: | |||
#ffffff !important; | |||
font-weight: bold !important; | font-weight: bold !important; | ||
background-color: | |||
#5271ff !important; | |||
border-radius: 8px 8px 0 0 !important; | |||
} | } | ||
#p-views li.selected a, | |||
#p-views li a:hover, | |||
#p-cactions li a:hover { | |||
background-color: | |||
#5271ff !important; | |||
color: | |||
#c0c8ff !important; | |||
#p-views, | |||
#p-cactions { | |||
} | } | ||
/* Sidebar */ | /* Sidebar */ | ||
#mw-panel { | #mw-panel { | ||
background-color: #5271ff !important; | background-color: | ||
#5271ff !important; | |||
} | } | ||
#mw-panel .portal { | #mw-panel .portal { | ||
background-color: #5271ff !important; | background-color: | ||
#5271ff !important; | |||
border-radius: 10px !important; | border-radius: 10px !important; | ||
margin-bottom: 8px !important; | margin-bottom: 8px !important; | ||
} | } | ||
#mw-panel .portal h3 { | #mw-panel .portal h3 { | ||
color: #ffffff !important; | color: | ||
#ffffff !important; | |||
font-weight: bold !important; | font-weight: bold !important; | ||
} | } | ||
#mw-panel .portal a, | #mw-panel .portal a, | ||
#mw-panel div.body a { | #mw-panel div.body a { | ||
color: #c0c8ff !important; | color: | ||
#c0c8ff !important; | |||
font-weight: bold !important; | font-weight: bold !important; | ||
} | } | ||
#mw-panel .portal a:hover { | #mw-panel .portal a:hover { | ||
color: #ffffff !important; | color: | ||
#ffffff !important; | |||
} | } | ||
/* Content area */ | /* Content area */ | ||
#content, .mw-body { | #content, .mw-body { | ||
background-color: #5271ff !important; | background-color: | ||
color: #ffffff !important; | #5271ff !important; | ||
border: 2px solid #ffffff !important; | color: | ||
#ffffff !important; | |||
border: 2px solid | |||
#ffffff !important; | |||
border-radius: 12px !important; | border-radius: 12px !important; | ||
} | } | ||
#content a, .mw-body a { | #content a, .mw-body a { | ||
color: #c0c8ff !important; | color: | ||
#c0c8ff !important; | |||
font-weight: bold !important; | font-weight: bold !important; | ||
} | } | ||
#content a:hover, .mw-body a:hover { | #content a:hover, .mw-body a:hover { | ||
color: #ffffff !important; | color: | ||
#ffffff !important; | |||
} | } | ||
/* Headings & text */ | /* Headings & text */ | ||
#firstHeading, .mw-first-heading { | #firstHeading, .mw-first-heading { | ||
color: #ffffff !important; | color: | ||
#ffffff !important; | |||
font-weight: bold !important; | font-weight: bold !important; | ||
border-bottom: 2px solid #ffffff !important; | border-bottom: 2px solid | ||
#ffffff !important; | |||
} | } | ||
#content p, #content li, #content td, #content th, | #content p, #content li, #content td, #content th, | ||
#content h1, #content h2, #content h3, | #content h1, #content h2, #content h3, | ||
#content h4, #content h5, #content h6 { | #content h4, #content h5, #content h6 { | ||
color: #ffffff !important; | color: | ||
#ffffff !important; | |||
font-weight: bold !important; | font-weight: bold !important; | ||
} | } | ||
/* Notices / info boxes */ | /* Notices / info boxes */ | ||
.mw-message-box, | .mw-message-box, | ||
.warningbox, .errorbox, .successbox { | .warningbox, .errorbox, .successbox { | ||
border-radius: 10px !important; | border-radius: 10px !important; | ||
border: 2px solid #ffffff !important; | border: 2px solid | ||
background-color: #5271ff !important; | #ffffff !important; | ||
color: #ffffff !important; | background-color: | ||
#5271ff !important; | |||
color: | |||
#ffffff !important; | |||
font-weight: bold !important; | font-weight: bold !important; | ||
} | } | ||
/* Search box */ | /* Search box */ | ||
#p-search input#searchInput { | #p-search input#searchInput { | ||
background-color: #5271ff !important; | background-color: | ||
color: #ffffff !important; | #5271ff !important; | ||
border: 2px solid #ffffff !important; | color: | ||
#ffffff !important; | |||
border: 2px solid | |||
#ffffff !important; | |||
border-radius: 8px !important; | border-radius: 8px !important; | ||
font-weight: bold !important; | font-weight: bold !important; | ||
} | } | ||
#p-search input#searchInput::placeholder { | #p-search input#searchInput::placeholder { | ||
color: #c0c8ff !important; | color: | ||
#c0c8ff !important; | |||
} | } | ||
/* Footer */ | /* Footer */ | ||
#footer { | #footer { | ||
background-color: #5271ff !important; | background-color: | ||
color: #ffffff !important; | #5271ff !important; | ||
border-top: 2px solid #ffffff !important; | color: | ||
#ffffff !important; | |||
border-top: 2px solid | |||
#ffffff !important; | |||
border-radius: 12px 12px 0 0 !important; | border-radius: 12px 12px 0 0 !important; | ||
} | } | ||
#footer a, #footer li { | #footer a, #footer li { | ||
color: #c0c8ff !important; | color: | ||
#c0c8ff !important; | |||
font-weight: bold !important; | font-weight: bold !important; | ||
} | } | ||
#footer a:hover { | #footer a:hover { | ||
color: #ffffff !important; | color: | ||
#ffffff !important; | |||
} | |||
/* ── FIXES ── */ | |||
/* Fix white bleed behind rounded nav tabs */ | |||
#p-views li, | |||
#p-cactions li { | |||
background-color: #5271ff !important; | |||
} | |||
#p-views ul, | |||
#p-cactions ul, | |||
#left-navigation, | |||
#right-navigation, | |||
#mw-head-base { | |||
background: transparent !important; | |||
} | } | ||
/* | /* Fix code / pre blocks */ | ||
code, tt { | code, tt { | ||
background-color: #3a5ce8 !important; | background-color: #3a5ce8 !important; | ||
| Line 168: | Line 179: | ||
} | } | ||
/* | /* Fix wikitables */ | ||
table.wikitable, | table.wikitable, | ||
table.wikitable th, | table.wikitable th, | ||
| Line 187: | Line 198: | ||
} | } | ||
/* | /* Fix ambox / infobox / maintenance boxes */ | ||
.ambox, .tmbox, .ombox, .cmbox, .fmbox, | .ambox, .tmbox, .ombox, .cmbox, .fmbox, | ||
.infobox, .mbox-small, .navbox, .navbox-subgroup { | .infobox, .mbox-small, .navbox, .navbox-subgroup { | ||
Revision as of 01:01, 29 April 2026
/* ── GPhys Developer Community – Vector Skin Theme ── */
/* Page background */
html, body,
#mw-page-base, #mw-head-base {
background-color:
#5271ff !important;
}
/* Header bar */
#mw-head {
background-color:
#5271ff !important;
border-radius: 0 0 12px 12px !important;
}
/* Personal links (top right) */
#p-personal li,
#p-personal li a {
color:
#ffffff !important;
font-weight: bold !important;
}
/* Navigation tabs */
#p-views li a,
#p-cactions li a,
#left-navigation a,
#right-navigation a {
color:
#ffffff !important;
font-weight: bold !important;
background-color:
#5271ff !important;
border-radius: 8px 8px 0 0 !important;
}
#p-views li.selected a,
#p-views li a:hover,
#p-cactions li a:hover {
background-color:
#5271ff !important;
color:
#c0c8ff !important;
}
/* Sidebar */
#mw-panel {
background-color:
#5271ff !important;
}
#mw-panel .portal {
background-color:
#5271ff !important;
border-radius: 10px !important;
margin-bottom: 8px !important;
}
#mw-panel .portal h3 {
color:
#ffffff !important;
font-weight: bold !important;
}
#mw-panel .portal a,
#mw-panel div.body a {
color:
#c0c8ff !important;
font-weight: bold !important;
}
#mw-panel .portal a:hover {
color:
#ffffff !important;
}
/* Content area */
#content, .mw-body {
background-color:
#5271ff !important;
color:
#ffffff !important;
border: 2px solid
#ffffff !important;
border-radius: 12px !important;
}
#content a, .mw-body a {
color:
#c0c8ff !important;
font-weight: bold !important;
}
#content a:hover, .mw-body a:hover {
color:
#ffffff !important;
}
/* Headings & text */
#firstHeading, .mw-first-heading {
color:
#ffffff !important;
font-weight: bold !important;
border-bottom: 2px solid
#ffffff !important;
}
#content p, #content li, #content td, #content th,
#content h1, #content h2, #content h3,
#content h4, #content h5, #content h6 {
color:
#ffffff !important;
font-weight: bold !important;
}
/* Notices / info boxes */
.mw-message-box,
.warningbox, .errorbox, .successbox {
border-radius: 10px !important;
border: 2px solid
#ffffff !important;
background-color:
#5271ff !important;
color:
#ffffff !important;
font-weight: bold !important;
}
/* Search box */
#p-search input#searchInput {
background-color:
#5271ff !important;
color:
#ffffff !important;
border: 2px solid
#ffffff !important;
border-radius: 8px !important;
font-weight: bold !important;
}
#p-search input#searchInput::placeholder {
color:
#c0c8ff !important;
}
/* Footer */
#footer {
background-color:
#5271ff !important;
color:
#ffffff !important;
border-top: 2px solid
#ffffff !important;
border-radius: 12px 12px 0 0 !important;
}
#footer a, #footer li {
color:
#c0c8ff !important;
font-weight: bold !important;
}
#footer a:hover {
color:
#ffffff !important;
}
/* ── FIXES ── */
/* Fix white bleed behind rounded nav tabs */
#p-views li,
#p-cactions li {
background-color: #5271ff !important;
}
#p-views ul,
#p-cactions ul,
#left-navigation,
#right-navigation,
#mw-head-base {
background: transparent !important;
}
/* Fix code / pre blocks */
code, tt {
background-color: #3a5ce8 !important;
color: #c0c8ff !important;
border: 1px solid #ffffff !important;
border-radius: 5px !important;
padding: 1px 4px !important;
font-weight: normal !important;
}
pre, .mw-code {
background-color: #3a5ce8 !important;
color: #c0c8ff !important;
border: 2px solid #ffffff !important;
border-radius: 8px !important;
padding: 10px !important;
font-weight: normal !important;
}
/* Fix wikitables */
table.wikitable,
table.wikitable th,
table.wikitable td {
border: 1px solid #ffffff !important;
color: #ffffff !important;
}
table.wikitable {
background-color: #5271ff !important;
border-radius: 10px !important;
overflow: hidden !important;
}
table.wikitable th {
background-color: #3a5ce8 !important;
}
table.wikitable td {
background-color: #5271ff !important;
}
/* Fix ambox / infobox / maintenance boxes */
.ambox, .tmbox, .ombox, .cmbox, .fmbox,
.infobox, .mbox-small, .navbox, .navbox-subgroup {
background-color: #5271ff !important;
color: #ffffff !important;
border: 2px solid #ffffff !important;
border-radius: 10px !important;
}
.ambox td, .infobox td, .infobox th,
.navbox td, .navbox th {
color: #ffffff !important;
border-color: #c0c8ff !important;
}