More languages
More actions
m (Updated border color of textboxes in source editor; added infobox CSS (not sure it will work right away)) |
m (Infobox CSS didn't work, attempting to use same specificity as current infoboxes) |
||
| Line 47: | Line 47: | ||
} | } | ||
/* CSS for Infoboxes */ | /* CSS for Infoboxes */ | ||
.infobox { | .mw-parser-output .infobox { | ||
border: 1px solid var(--color-border-1); | border: 1px solid var(--color-border-1); | ||
background-color: var(--color-surface-2); | background-color: var(--color-surface-2); | ||
Revision as of 19:04, 14 March 2023
/***
****
**** CSS Variables
****
***/
@media screen {
:root {
--border-color-1:hsl(0, 0%, 82%);
--border-color-2:hsl(0, 0%, 88%);
--color-surface-5:hsl(220,17%,93%);
--color-surface-6:hsl(200,2%,60%);
--color-surface-7:hsl(180,2%,40%);
--color-surface-subtle-red:hsl(0, 100%, 97%);
--color-success2:hsl(167,70%,31%);
}
:root.skin-citizen-dark {
--border-color-1:hsl(245.6, 27.6%, 22.7%);
--border-color-2:hsl(245.6, 27.6%, 22.7%);
--color-surface-5:hsl(220,25%,15%);
--color-surface-6:hsl(220,12%,35%);
--color-surface-7:hsl(220,12%,40%);
--color-surface-subtle-red:hsl(0, 45%, 28%);
}
}
/***
****
**** Mobile Citzen CSS
****
***/
@media (max-width: 720px) {
table {
width:100% !important;
display: table;
}
}
/**
* General theming
*
**/
/* CSS for input textboxes */
.mw-ui-input {
border-color: var(--border-color-1);
}
/* CSS for Infoboxes */
.mw-parser-output .infobox {
border: 1px solid var(--color-border-1);
background-color: var(--color-surface-2);
color: var(--color-base);
}
/**
* StructuredDiscussions theming
*
**/
.flow-topic-titlebar {
background-color: var(--color-surface-3);
}
/**
* ConfirmAcccount theming
*
**/
.mw-confirmaccount-type-0 {
background-color: var(--color-surface-subtle-red);
}
.mw-confirmaccount-body-0 {
background-color: var(--color-surface-5);
}
.wpNewBio {
background-color: var(--color-surface-2);
}
.mw-special-ConfirmAccounts fieldset {
border: 1px solid var(--border-color-1);
}
/***
**** Code editor interface
***/
.ace-tm .ace_gutter {
background-color:var(--color-surface-2);
border-right:1px solid var(--border-color-2);
}
/***
****
**** Source editor interface
****
***/
.wikiEditor-ui-toolbar {
padding: 0.25em;
box-shadow: 0px 3px 5px rgba(0,0,0,0.1);
background-color:var(--color-surface-2);
}
.wikiEditor-ui .wikiEditor-ui-view {
border:1px solid var(--border-color-1);
}
.wikiEditor-ui .wikiEditor-ui-top::before {
backdrop-filter: none;
background-color: transparent;
}
.CodeMirror-gutters {
background-color:var(--color-surface-2);
border-right:1px solid var(--border-color-2);
}
.skin-citizen .mw-editform .editOptions {
background-color: var(--color-surface-5);
border: 1px solid var(--border-color-1);
border-top: 0px;
}
.oo-ui-textInputWidget .oo-ui-inputWidget-input {
background-color: var(--color-surface-0);
border: 1px solid var(--border-color-1);
}
.oo-ui-checkboxInputWidget [type="checkbox"] + span {
background-color: var(--color-surface-0);
border: 1px solid var(--border-color-1);
}
/***
**** Recent changes theming
***/
.rc-sidebar-user {
color: var(--color-base--subtle);
}
/***
****
**** Success message after publishing an edit
****
***/
.oo-ui-messageWidget.oo-ui-flaggedElement-success:not(.oo-ui-messageWidget-block) {
color:var(--color-success2);
}