(try to update for citizen changes (https://github.com/StarCitizenTools/mediawiki-skins-Citizen/commit/a741639085d70c22a9f49890542a142a223bf981)) |
m (fix incorrect variable names) |
||
| (2 intermediate revisions by the same user not shown) | |||
| Line 8: | Line 8: | ||
--default-bg-l: #fbfbfb; | --default-bg-l: #fbfbfb; | ||
--default-br-l: #a2a9b1; | --default-br-l: #a2a9b1; | ||
--warning-bg-l: # | --warning-bg-l: #ffe7ce; | ||
--warning-br-l: #f28500; | --warning-br-l: #f28500; | ||
--critical-bg-l: # | --critical-bg-l: #fee7e6; | ||
--critical-br-l: #b32424; | --critical-br-l: #b32424; | ||
--info-bg-l: # | --info-bg-l: #d8e8ff; | ||
--info-br-l: # | --info-br-l: #36c; | ||
--success-bg-l: # | --success-bg-l: #d7ffe0; | ||
--success-br-l: # | --success-br-l: #68a174; | ||
--default-bg-d: # | --default-bg-d: #36415b; | ||
--default-br-d: # | --default-br-d: #5e7288; | ||
--warning-bg-d: # | --warning-bg-d: #504438; | ||
--warning-br-d: # | --warning-br-d: #f28500; | ||
--critical-bg-d: # | --critical-bg-d: #6c4543; | ||
--critical-br-d: # | --critical-br-d: #b32424; | ||
--info-bg-d: # | --info-bg-d: #273241; | ||
--info-br-d: # | --info-br-d: #36c; | ||
--success-bg-d: # | --success-bg-d: #3c5442; | ||
--success-br-d: # | --success-br-d: #68a174; | ||
--default-bg: var(--default-bg-l); | --default-bg: var(--default-bg-l); | ||
| Line 41: | Line 41: | ||
background-color: var(--default-bg); | background-color: var(--default-bg); | ||
border-color: var(--default-br); | border-color: var(--default-br); | ||
} | } | ||
| Line 60: | Line 54: | ||
@media (prefers-color-scheme: dark) { | @media (prefers-color-scheme: dark) { | ||
body.skin-timeless | body.skin-timeless .hgw-inline-box { | ||
--default-bg: var(--default-bg-d); | --default-bg: var(--default-bg-d); | ||
--default-br: var(--default-br-d); | --default-br: var(--default-br-d); | ||
| Line 77: | Line 70: | ||
/* i love duplicate code, oh wait css variables could probably solve this, but meh */ | /* i love duplicate code, oh wait css variables could probably solve this, but meh */ | ||
html.skin- | html.skin-citizen-dark .hgw-inline-box { | ||
--default-bg: var(--default-bg-d); | --default-bg: var(--default-bg-d); | ||
--default-br: var(--default-br-d); | --default-br: var(--default-br-d); | ||
Revision as of 08:25, 27 February 2023
.hgw-inline-box {
box-sizing: border-box;
border-width: 1px;
border-style: solid;
padding: 0.5em;
margin: 0.5em 0;
--default-bg-l: #fbfbfb;
--default-br-l: #a2a9b1;
--warning-bg-l: #ffe7ce;
--warning-br-l: #f28500;
--critical-bg-l: #fee7e6;
--critical-br-l: #b32424;
--info-bg-l: #d8e8ff;
--info-br-l: #36c;
--success-bg-l: #d7ffe0;
--success-br-l: #68a174;
--default-bg-d: #36415b;
--default-br-d: #5e7288;
--warning-bg-d: #504438;
--warning-br-d: #f28500;
--critical-bg-d: #6c4543;
--critical-br-d: #b32424;
--info-bg-d: #273241;
--info-br-d: #36c;
--success-bg-d: #3c5442;
--success-br-d: #68a174;
--default-bg: var(--default-bg-l);
--default-br: var(--default-br-l);
--warning-bg: var(--warning-bg-l);
--warning-br: var(--warning-br-l);
--critical-bg: var(--critical-bg-l);
--critical-br: var(--critical-br-l);
--info-bg: var(--info-bg-l);
--info-br: var(--info-br-l);
--success-bg: var(--success-bg-l);
--success-br: var(--success-br-l);
background-color: var(--default-bg);
border-color: var(--default-br);
}
.hgw-inline-box-image {
vertical-align: top;
position: relative;
padding-right: 0.5em;
top: -1px;
}
.hgw-inline-box-text {
}
@media (prefers-color-scheme: dark) {
body.skin-timeless .hgw-inline-box {
--default-bg: var(--default-bg-d);
--default-br: var(--default-br-d);
--warning-bg: var(--warning-bg-d);
--warning-br: var(--warning-br-d);
--critical-bg: var(--critical-bg-d);
--critical-br: var(--critical-br-d);
--info-bg: var(--info-bg-d);
--info-br: var(--info-br-d);
--success-bg: var(--success-bg-d);
--success-br: var(--success-br-d);
}
}
/* i love duplicate code, oh wait css variables could probably solve this, but meh */
html.skin-citizen-dark .hgw-inline-box {
--default-bg: var(--default-bg-d);
--default-br: var(--default-br-d);
--warning-bg: var(--warning-bg-d);
--warning-br: var(--warning-br-d);
--critical-bg: var(--critical-bg-d);
--critical-br: var(--critical-br-d);
--info-bg: var(--info-bg-d);
--info-br: var(--info-br-d);
--success-bg: var(--success-bg-d);
--success-br: var(--success-br-d);
}
.hgw-inline-box-warning {
background-color: var(--warning-bg);
border-color: var(--warning-br);
}
.hgw-inline-box-critical {
background-color: var(--critical-bg);
border-color: var(--critical-br);
}
.hgw-inline-box-info {
background-color: var(--info-bg);
border-color: var(--info-br);
}
.hgw-inline-box-success {
background-color: var(--success-bg);
border-color: var(--success-br);
}