MediaWiki:Common.css: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
No edit summary |
||
| Line 1: | Line 1: | ||
/* === Global Dark | /* === Global Dark for the CountryGame Wikidex === */ | ||
:root { | |||
--runnina-red: #900603; | |||
--runnina-hover: #ff1a1a; | |||
--onyx-black: #030104; | |||
--white: #ffffff; | |||
} | } | ||
body, #content, .mw-body, .mw-body-content { | |||
background-color: var(--onyx-black) !important; | |||
color: var(--white) !important; | |||
} | } | ||
/* == | /* === Head Banner === */ | ||
#mw-head { | |||
background- | background: url("/images/1/12/Background_0001.png") repeat-x top center; | ||
background-size: auto 80px; | |||
height: 80px; | |||
} | } | ||
/* == | /* === Link Styles === */ | ||
a, a:visited { | a, a:visited { | ||
color: | color: var(--runnina-red) !important; | ||
text-decoration: none; | text-decoration: none; | ||
} | } | ||
a:hover, a:active { | a:hover, a:active { | ||
color: | color: var(--runnina-hover) !important; | ||
text-decoration: underline; | text-decoration: underline; | ||
} | } | ||
/* == | /* === Vector Tabs === */ | ||
.vectorTabs li { | |||
margin: 0 !important; | |||
padding: 0 !important; | |||
list-style: none; | |||
} | } | ||
.vectorTabs li:empty { | |||
display: none !important; | |||
} | } | ||
.vectorTabs li a { | |||
padding: 6px 12px !important; | |||
background: | background: var(--white) !important; | ||
border: 1px solid | border: 1px solid var(--runnina-red) !important; | ||
color: | color: var(--runnina-red) !important; | ||
font-weight: bold; | |||
text-shadow: none !important; | |||
box-sizing: border-box; | |||
display: inline-block; | |||
} | } | ||
.vectorTabs li.selected a { | |||
: | border-bottom: 2px solid var(--runnina-red) !important; | ||
} | } | ||
/* == | /* === More Tab === */ | ||
# | #ca-more { | ||
color: | display: flex !important; | ||
align-items: center !important; | |||
justify-content: center !important; | |||
background-color: var(--white) !important; | |||
border: 1px solid var(--runnina-red) !important; | |||
height: 100% !important; | |||
min-height: 36px; | |||
box-sizing: border-box !important; | |||
padding: 0 12px !important; | |||
} | } | ||
#ca-more > a { | |||
color: var(--runnina-red) !important; | |||
font-weight: bold; | |||
text-shadow: none !important; | |||
line-height: 36px !important; | |||
text-align: center; | |||
} | } | ||
#ca-more:hover, #ca-more:focus { | |||
background-color: var(--white) !important; | |||
background: white !important | |||
} | } | ||
#ca-more.selected { | #ca-more.selected { | ||
border-bottom: 2px solid | border-bottom: 2px solid var(--runnina-red) !important; | ||
} | } | ||
# | /* === Watch Star Icon === */ | ||
#ca-watch a, #ca-unwatch a { | |||
text- | display: inline-block !important; | ||
width: 40px; | |||
height: 36px; | |||
background: var(--white) url("https://i.imgur.com/eHOwynZ.png") no-repeat center center !important; | |||
background-size: 18px 18px !important; | |||
border: 1px solid var(--runnina-red) !important; | |||
text-indent: -9999px; | |||
} | } | ||
/* == | /* === Personal Portlet (Top-Right) === */ | ||
#p-personal { | #p-personal { | ||
border: 3px solid var(--runnina-red) !important; | |||
background-color: var(--onyx-black) !important; | |||
padding: 3px 10px 7px 122px !important; | padding: 3px 10px 7px 122px !important; | ||
margin: -3px 0 0 60px !important; | margin: -3px 0 0 60px !important; | ||
display: flex !important; | |||
align-items: center !important; | |||
box-sizing: border-box !important; | |||
} | } | ||
#p-personal li { | #p-personal li { | ||
margin-right: 0.8em !important; | margin-right: 0.8em !important; | ||
} | } | ||
# | /* === Search Box === */ | ||
#searchInput { | |||
background-color: #1a1a1a; | |||
border: 1px solid var(--runnina-red); | |||
color: white; | |||
margin-left: -5px !important; | |||
} | } | ||
#searchButton { | |||
margin-right: 5px !important; | |||
} | } | ||
/* == | /* === Notification Icons === */ | ||
#pt-notifications-alert .mw-echo-notifications-badge, | #pt-notifications-alert .mw-echo-notifications-badge, | ||
#pt-notifications-notice .mw-echo-notifications-badge { | #pt-notifications-notice .mw-echo-notifications-badge { | ||
filter: brightness(0) saturate(100%) invert(14%) sepia(94%) saturate(7159%) hue-rotate(357deg) brightness(92%) contrast(118%) !important; | filter: brightness(0) saturate(100%) invert(14%) sepia(94%) saturate(7159%) hue-rotate(357deg) brightness(92%) contrast(118%) !important; | ||
vertical-align: middle !important; | |||
position: relative !important; | position: relative !important; | ||
top: 8px; | top: 8px; | ||
} | } | ||
.mw-echo-unseen-notifications { | |||
.mw-echo-notifications-badge .mw-echo-unseen-notifications { | |||
background-color: #6a0dad !important; | background-color: #6a0dad !important; | ||
color: white !important; | color: white !important; | ||
} | } | ||
/* == Footer == */ | /* === Footer === */ | ||
#footer, .mw-footer, .printfooter { | |||
background-color: var(--onyx-black) !important; | |||
color: var(--white) !important; | |||
border-top: none !important; | |||
} | |||
#footer-icons .footer-icon { | #footer-icons .footer-icon { | ||
display: inline-block; | display: inline-block; | ||
padding: 4px 6px; | padding: 4px 6px; | ||
margin: 2px; | margin: 2px; | ||
background: | background: var(--white); | ||
border: 1px solid #a2a9b1; | border: 1px solid #a2a9b1; | ||
border-radius: 2px; | border-radius: 2px; | ||
} | } | ||
#footer-icons { | #footer-icons { | ||
text-align: center; | text-align: center; | ||
} | } | ||
/* == | /* === Page Headings === */ | ||
#firstHeading { | |||
font-family: "Lexend SemiBold", sans-serif !important; | |||
} | } | ||
/* == Infobox == */ | .mw-body h1, .mw-body h2, .mw-body h3, | ||
.mw-body h4, .mw-body h5, .mw-body h6 { | |||
color: white !important; | |||
} | |||
/* === Infobox === */ | |||
.infobox { | .infobox { | ||
border-collapse: collapse; | border-collapse: collapse; | ||
| Line 187: | Line 177: | ||
border: 1px solid #aaa; | border: 1px solid #aaa; | ||
} | } | ||
.infobox th, .infobox td { | .infobox th, .infobox td { | ||
border: 1px solid #aaa; | border: 1px solid #aaa; | ||
padding: 4px; | padding: 4px; | ||
} | } | ||
.infobox th { | .infobox th { | ||
background: #eeeeee; | background: #eeeeee; | ||
| Line 196: | Line 188: | ||
font-weight: bold; | font-weight: bold; | ||
} | } | ||
.infobox caption { | .infobox caption { | ||
background: #ccccff; | background: #ccccff; | ||
| Line 201: | Line 194: | ||
} | } | ||
/* == | /* === Font Faces === */ | ||
@font-face { | |||
font-family: "Lexend SemiBold"; | |||
src: url("https://db.onlinewebfonts.com/t/3474c885518969e3f7178ad88f489c78.woff2") format("woff2"); | |||
} | } | ||
@font-face { | |||
font-family: "Lexend"; | |||
src: url("https://db.onlinewebfonts.com/t/252412eb53593c5afb3e30b6a88ca910.woff2") format("woff2"); | |||
. | |||
. | |||
} | } | ||
@font-face { | |||
font-family: "Helvetica"; | |||
src: url("https://db.onlinewebfonts.com/t/5c5a257758cff0acee4d28ff555f3bc5.woff2") format("woff2"); | |||
} | } | ||
Revision as of 19:33, 28 July 2025
/* === Global Dark for the CountryGame Wikidex === */
:root {
--runnina-red: #900603;
--runnina-hover: #ff1a1a;
--onyx-black: #030104;
--white: #ffffff;
}
body, #content, .mw-body, .mw-body-content {
background-color: var(--onyx-black) !important;
color: var(--white) !important;
}
/* === Head Banner === */
#mw-head {
background: url("/images/1/12/Background_0001.png") repeat-x top center;
background-size: auto 80px;
height: 80px;
}
/* === Link Styles === */
a, a:visited {
color: var(--runnina-red) !important;
text-decoration: none;
}
a:hover, a:active {
color: var(--runnina-hover) !important;
text-decoration: underline;
}
/* === Vector Tabs === */
.vectorTabs li {
margin: 0 !important;
padding: 0 !important;
list-style: none;
}
.vectorTabs li:empty {
display: none !important;
}
.vectorTabs li a {
padding: 6px 12px !important;
background: var(--white) !important;
border: 1px solid var(--runnina-red) !important;
color: var(--runnina-red) !important;
font-weight: bold;
text-shadow: none !important;
box-sizing: border-box;
display: inline-block;
}
.vectorTabs li.selected a {
border-bottom: 2px solid var(--runnina-red) !important;
}
/* === More Tab === */
#ca-more {
display: flex !important;
align-items: center !important;
justify-content: center !important;
background-color: var(--white) !important;
border: 1px solid var(--runnina-red) !important;
height: 100% !important;
min-height: 36px;
box-sizing: border-box !important;
padding: 0 12px !important;
}
#ca-more > a {
color: var(--runnina-red) !important;
font-weight: bold;
text-shadow: none !important;
line-height: 36px !important;
text-align: center;
}
#ca-more:hover, #ca-more:focus {
background-color: var(--white) !important;
}
#ca-more.selected {
border-bottom: 2px solid var(--runnina-red) !important;
}
/* === Watch Star Icon === */
#ca-watch a, #ca-unwatch a {
display: inline-block !important;
width: 40px;
height: 36px;
background: var(--white) url("https://i.imgur.com/eHOwynZ.png") no-repeat center center !important;
background-size: 18px 18px !important;
border: 1px solid var(--runnina-red) !important;
text-indent: -9999px;
}
/* === Personal Portlet (Top-Right) === */
#p-personal {
border: 3px solid var(--runnina-red) !important;
background-color: var(--onyx-black) !important;
padding: 3px 10px 7px 122px !important;
margin: -3px 0 0 60px !important;
display: flex !important;
align-items: center !important;
box-sizing: border-box !important;
}
#p-personal li {
margin-right: 0.8em !important;
}
/* === Search Box === */
#searchInput {
background-color: #1a1a1a;
border: 1px solid var(--runnina-red);
color: white;
margin-left: -5px !important;
}
#searchButton {
margin-right: 5px !important;
}
/* === Notification Icons === */
#pt-notifications-alert .mw-echo-notifications-badge,
#pt-notifications-notice .mw-echo-notifications-badge {
filter: brightness(0) saturate(100%) invert(14%) sepia(94%) saturate(7159%) hue-rotate(357deg) brightness(92%) contrast(118%) !important;
vertical-align: middle !important;
position: relative !important;
top: 8px;
}
.mw-echo-notifications-badge .mw-echo-unseen-notifications {
background-color: #6a0dad !important;
color: white !important;
}
/* === Footer === */
#footer, .mw-footer, .printfooter {
background-color: var(--onyx-black) !important;
color: var(--white) !important;
border-top: none !important;
}
#footer-icons .footer-icon {
display: inline-block;
padding: 4px 6px;
margin: 2px;
background: var(--white);
border: 1px solid #a2a9b1;
border-radius: 2px;
}
#footer-icons {
text-align: center;
}
/* === Page Headings === */
#firstHeading {
font-family: "Lexend SemiBold", sans-serif !important;
}
.mw-body h1, .mw-body h2, .mw-body h3,
.mw-body h4, .mw-body h5, .mw-body h6 {
color: white !important;
}
/* === Infobox === */
.infobox {
border-collapse: collapse;
width: 300px;
font-size: 90%;
line-height: 1.4em;
background: #f9f9f9;
border: 1px solid #aaa;
}
.infobox th, .infobox td {
border: 1px solid #aaa;
padding: 4px;
}
.infobox th {
background: #eeeeee;
text-align: left;
font-weight: bold;
}
.infobox caption {
background: #ccccff;
font-weight: bold;
}
/* === Font Faces === */
@font-face {
font-family: "Lexend SemiBold";
src: url("https://db.onlinewebfonts.com/t/3474c885518969e3f7178ad88f489c78.woff2") format("woff2");
}
@font-face {
font-family: "Lexend";
src: url("https://db.onlinewebfonts.com/t/252412eb53593c5afb3e30b6a88ca910.woff2") format("woff2");
}
@font-face {
font-family: "Helvetica";
src: url("https://db.onlinewebfonts.com/t/5c5a257758cff0acee4d28ff555f3bc5.woff2") format("woff2");
}