MediaWiki:Common.css: Difference between revisions
Appearance
No edit summary |
No edit summary |
||
| (86 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
/* Hide genned cats by default */ | |||
body { | |||
--main-bg-color: #1195db; | |||
--light-bg-color: #e1f5ff; | |||
--blue-positive: #0D43C9; | |||
--red-negative: #d30f0f; | |||
} | |||
html.skin-theme-clientpref-night { | |||
--background-color-base: #060b10; | |||
} | |||
iframe { | |||
display: block; | |||
margin: 0 auto; | |||
} | |||
.background-color { | |||
background-color: light-dark(#ffffff, #333); | |||
} | |||
.highlighted { | |||
background-color: light-dark(yellow, #d30f0f); | |||
} | |||
.icanread-check { | |||
padding: 8px 0px; | |||
font-size: 16px; | |||
} | |||
.alert-msg { | |||
background-color: #ffe4e46e; | |||
border: 2px solid #dd5151; | |||
padding: 8px; | |||
} | |||
.positive-blue { | |||
color: var(--blue-positive); | |||
} | |||
.negative-red { | |||
color: var(--red-negative); | |||
} | |||
.infotable .mw-collapsible-toggle-default .mw-collapsible-text { | |||
color: white; | |||
} | |||
.enabled-green { | |||
background-color:#b2fbb1 !important; | |||
color:green; | |||
} | |||
.disabled-red { | |||
background-color:#fbb1b1 !important; | |||
color:red; | |||
} | |||
.infotable { | |||
max-width: 600px; | |||
} | |||
.infotable td > p { | |||
margin-left: 21px; | |||
} | |||
.CategoryTreeTag { | |||
display: grid; | |||
grid-template-columns: repeat(2, 2fr); | |||
max-width: 620px; | |||
} | |||
.mw-category-generated { | |||
display: none; | |||
} | |||
/* <pre> */ | /* <pre> */ | ||
.mw-createacct-benefits-container { | |||
float: none; | |||
} | |||
.mw-createacct-benefits-list { | |||
display: none; | |||
} | |||
inv | |||
.mw-workspace-container .mw-content-container { | |||
max-width: 60em; | |||
margin-left:auto !important; | |||
} | |||
#p-search { | |||
max-width: 65em; | |||
margin-left: auto; | |||
margin-right: auto; | |||
} | |||
.page-Main_Page h1.firstHeading { | |||
display: none; | |||
} | |||
#mainHomeContent { | |||
display: flex; | |||
} | |||
#homeRight { | |||
display: flex; | |||
margin-left: auto; | |||
} | |||
.home #toc { | |||
display: none; | |||
} | |||
.home h1 { | .home h1 { | ||
font-size: 2. | font-size: 2.25em; | ||
font-weight: bold; | font-weight: bold; | ||
border: none; | border: none; | ||
| Line 13: | Line 126: | ||
border: none; | border: none; | ||
margin: 0 0 0.15em; | margin: 0 0 0.15em; | ||
} | |||
#edit-updates a { | |||
background-image: none; | |||
padding: 0px 2px; | |||
color: #ffffffed; | |||
} | |||
h1 small, h2 small { | |||
font-size: 12px; | |||
} | } | ||
.invert { | .invert { | ||
color: white; | color: white; | ||
} | |||
.invert a { | |||
color: #cbbdff !important; | |||
} | } | ||
.content-tile { | .content-tile { | ||
border: 1px solid #3980ab; | border: 1px solid #438ab5; | ||
background-color: #3980ab; | |||
padding: 1em; | padding: 1em; | ||
width: 100%; | |||
margin-right: 1em; | |||
margin-bottom: 1em; | |||
} | |||
@media (min-width: 590px) { | |||
.content-tile { | |||
width: 25%; | |||
} | |||
} | } | ||
| Line 27: | Line 164: | ||
font-size: 1.25em; | font-size: 1.25em; | ||
font-weight: bold; | font-weight: bold; | ||
} | |||
.content-tile a, .content-tile a.new, .content-tile a.new:visited { | |||
color: white; | |||
} | |||
.colored { | |||
padding: 1em; | |||
background-color: #3980ab; | |||
color: white; | |||
} | |||
.colored h1, .colored h2, .colored h3, .colored h4 { | |||
color: white; | |||
} | |||
.colored a, .colored a.new, .colored a.new:visited { | |||
color: #54e1ef !important; | |||
} | |||
@media screen and (max-width:650px) { | |||
#mainHomeContent { | |||
display: block; | |||
} | |||
#homeRight { | |||
margin-left: 0; | |||
margin-bottom: 1em; | |||
} | |||
.content-tile { | |||
margin-right: 0; | |||
} | |||
} | |||
/* MediaWiki:DynamicNav.js */ | |||
.NavFrame { | |||
background-color: #1195db; | |||
padding: 1px; | |||
color: white; | |||
text-align: center; | |||
font-weight: bold; | |||
} | |||
.NavFrame .NavHead { | |||
padding: 2px; | |||
border: 1px solid white; | |||
cursor: pointer; | |||
} | |||
.NavFrame .navigation { | |||
float: right; | |||
color: #fff; | |||
margin-right: 8px; | |||
} | |||
.NavFrame .NavContent { | |||
display: none; | |||
padding: 8px; | |||
background-color: light-dark(white, #191a1c); | |||
color: light-dark(black, white); | |||
font-weight: normal; | |||
} | |||
/* skill backgrounds */ | |||
.skill-table-title { | |||
font-weight: bold; | |||
color: light-dark(white, #020202); | |||
} | |||
.skill-category-gun { | |||
background-color: #be9df5; | |||
} | |||
.skill-category-music { | |||
background-color: #f59deb; | |||
} | |||
.skill-category-fighter { | |||
background-color: #abbecc; | |||
} | |||
.skill-category-alchemy { | |||
background-color: #8fcf82; | |||
} | |||
.skill-category-magic { | |||
background-color: #6bb0ed; | |||
} | |||
.skill-category-combat { | |||
background-color: #ed6f6b; | |||
} | |||
.skill-category-life { | |||
background-color: #ede06b; | |||
} | |||
/* Tabs */ | |||
.tabs-label, .tabber__tab { | |||
background-color: #1195DB8A; | |||
border: none; | |||
color: white; | |||
border-radius: 0; | |||
} | |||
.tabs-tabbox > .tabs-label { | |||
border-radius: 0; | |||
} | |||
.tabs-tabbox > .tabs-input:checked + .tabs-label, .tabs-input-0:checked + .tabs-input-1 + .tabs-label, .tabber__tab[aria-selected="true"] { | |||
background-color: #FFF; | |||
background-color: #1195DB; | |||
} | |||
.tabs-tabbox > .tabs-container { | |||
padding: 2px; | |||
border-radius: 4px; | |||
border: 1px solid #1195DB; | |||
} | |||
.tabber__tab[aria-selected="true"], .tabber__tab[aria-selected="true"]:visited, .tabber__tab:visited { | |||
color: white; | |||
} | |||
/* Rewards List */ | |||
.rewards-list { | |||
display: flex; | |||
flex-wrap: wrap; | |||
max-width: 75vw; | |||
} | |||
.rewards-list-section { | |||
background-color: light-dark(#f8f9fa, #050b11); | |||
padding: 8px; | |||
width: 240px; | |||
border: 1px solid #1195db; | |||
margin: 1px; | |||
} | |||
.rewards-list-section ul { | |||
max-height: 200px; | |||
min-height: 150px; | |||
overflow-y: auto; | |||
list-style-position: inside; | |||
} | |||
rewards-list-section > b { | |||
text-align: center; | |||
display: inline-block; | |||
} | |||
.rewards-list-section b { | |||
text-align: center; | |||
display: inline-block; | |||
width: 100%; | |||
background-color: #1195db; | |||
color: white; | |||
} | |||
.prefix, .suffix { | |||
font-weight: bold; | |||
text-decoration: underline; | |||
} | |||
.prefix { | |||
text-decoration-style: dashed; | |||
} | |||
.suffix { | |||
text-decoration-style: dotted; | |||
} | |||
.enchant-progression td td:first-child, .enchant-progression-example { | |||
font-weight: bold; | |||
} | |||
.enchant-progression .green td:first-child, .enchant-progression-example.green { | |||
color: green; | |||
} | |||
.enchant-progression .blue td:first-child, .enchant-progression-example.blue { | |||
color: blue; | |||
} | |||
.enchant-progression .purple td:first-child, .enchant-progression-example.purple { | |||
color: purple; | |||
} | |||
.enchant-progression .orange td:first-child, .enchant-progression-example.orange { | |||
color: #ff6e04; | |||
} | } | ||
Latest revision as of 20:40, 6 November 2025
/* Hide genned cats by default */
body {
--main-bg-color: #1195db;
--light-bg-color: #e1f5ff;
--blue-positive: #0D43C9;
--red-negative: #d30f0f;
}
html.skin-theme-clientpref-night {
--background-color-base: #060b10;
}
iframe {
display: block;
margin: 0 auto;
}
.background-color {
background-color: light-dark(#ffffff, #333);
}
.highlighted {
background-color: light-dark(yellow, #d30f0f);
}
.icanread-check {
padding: 8px 0px;
font-size: 16px;
}
.alert-msg {
background-color: #ffe4e46e;
border: 2px solid #dd5151;
padding: 8px;
}
.positive-blue {
color: var(--blue-positive);
}
.negative-red {
color: var(--red-negative);
}
.infotable .mw-collapsible-toggle-default .mw-collapsible-text {
color: white;
}
.enabled-green {
background-color:#b2fbb1 !important;
color:green;
}
.disabled-red {
background-color:#fbb1b1 !important;
color:red;
}
.infotable {
max-width: 600px;
}
.infotable td > p {
margin-left: 21px;
}
.CategoryTreeTag {
display: grid;
grid-template-columns: repeat(2, 2fr);
max-width: 620px;
}
.mw-category-generated {
display: none;
}
/* <pre> */
.mw-createacct-benefits-container {
float: none;
}
.mw-createacct-benefits-list {
display: none;
}
inv
.mw-workspace-container .mw-content-container {
max-width: 60em;
margin-left:auto !important;
}
#p-search {
max-width: 65em;
margin-left: auto;
margin-right: auto;
}
.page-Main_Page h1.firstHeading {
display: none;
}
#mainHomeContent {
display: flex;
}
#homeRight {
display: flex;
margin-left: auto;
}
.home #toc {
display: none;
}
.home h1 {
font-size: 2.25em;
font-weight: bold;
border: none;
margin: 0 0 0.15em;
}
.home h2 {
font-size: 1.25em;
font-weight: bold;
border: none;
margin: 0 0 0.15em;
}
#edit-updates a {
background-image: none;
padding: 0px 2px;
color: #ffffffed;
}
h1 small, h2 small {
font-size: 12px;
}
.invert {
color: white;
}
.invert a {
color: #cbbdff !important;
}
.content-tile {
border: 1px solid #438ab5;
background-color: #3980ab;
padding: 1em;
width: 100%;
margin-right: 1em;
margin-bottom: 1em;
}
@media (min-width: 590px) {
.content-tile {
width: 25%;
}
}
.content-tile p {
font-size: 1.25em;
font-weight: bold;
}
.content-tile a, .content-tile a.new, .content-tile a.new:visited {
color: white;
}
.colored {
padding: 1em;
background-color: #3980ab;
color: white;
}
.colored h1, .colored h2, .colored h3, .colored h4 {
color: white;
}
.colored a, .colored a.new, .colored a.new:visited {
color: #54e1ef !important;
}
@media screen and (max-width:650px) {
#mainHomeContent {
display: block;
}
#homeRight {
margin-left: 0;
margin-bottom: 1em;
}
.content-tile {
margin-right: 0;
}
}
/* MediaWiki:DynamicNav.js */
.NavFrame {
background-color: #1195db;
padding: 1px;
color: white;
text-align: center;
font-weight: bold;
}
.NavFrame .NavHead {
padding: 2px;
border: 1px solid white;
cursor: pointer;
}
.NavFrame .navigation {
float: right;
color: #fff;
margin-right: 8px;
}
.NavFrame .NavContent {
display: none;
padding: 8px;
background-color: light-dark(white, #191a1c);
color: light-dark(black, white);
font-weight: normal;
}
/* skill backgrounds */
.skill-table-title {
font-weight: bold;
color: light-dark(white, #020202);
}
.skill-category-gun {
background-color: #be9df5;
}
.skill-category-music {
background-color: #f59deb;
}
.skill-category-fighter {
background-color: #abbecc;
}
.skill-category-alchemy {
background-color: #8fcf82;
}
.skill-category-magic {
background-color: #6bb0ed;
}
.skill-category-combat {
background-color: #ed6f6b;
}
.skill-category-life {
background-color: #ede06b;
}
/* Tabs */
.tabs-label, .tabber__tab {
background-color: #1195DB8A;
border: none;
color: white;
border-radius: 0;
}
.tabs-tabbox > .tabs-label {
border-radius: 0;
}
.tabs-tabbox > .tabs-input:checked + .tabs-label, .tabs-input-0:checked + .tabs-input-1 + .tabs-label, .tabber__tab[aria-selected="true"] {
background-color: #FFF;
background-color: #1195DB;
}
.tabs-tabbox > .tabs-container {
padding: 2px;
border-radius: 4px;
border: 1px solid #1195DB;
}
.tabber__tab[aria-selected="true"], .tabber__tab[aria-selected="true"]:visited, .tabber__tab:visited {
color: white;
}
/* Rewards List */
.rewards-list {
display: flex;
flex-wrap: wrap;
max-width: 75vw;
}
.rewards-list-section {
background-color: light-dark(#f8f9fa, #050b11);
padding: 8px;
width: 240px;
border: 1px solid #1195db;
margin: 1px;
}
.rewards-list-section ul {
max-height: 200px;
min-height: 150px;
overflow-y: auto;
list-style-position: inside;
}
rewards-list-section > b {
text-align: center;
display: inline-block;
}
.rewards-list-section b {
text-align: center;
display: inline-block;
width: 100%;
background-color: #1195db;
color: white;
}
.prefix, .suffix {
font-weight: bold;
text-decoration: underline;
}
.prefix {
text-decoration-style: dashed;
}
.suffix {
text-decoration-style: dotted;
}
.enchant-progression td td:first-child, .enchant-progression-example {
font-weight: bold;
}
.enchant-progression .green td:first-child, .enchant-progression-example.green {
color: green;
}
.enchant-progression .blue td:first-child, .enchant-progression-example.blue {
color: blue;
}
.enchant-progression .purple td:first-child, .enchant-progression-example.purple {
color: purple;
}
.enchant-progression .orange td:first-child, .enchant-progression-example.orange {
color: #ff6e04;
}