More languages
More actions
Note: After publishing, you may have to bypass your browser's cache to see the changes.
- Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
- Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
- Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
- Opera: Press Ctrl-F5.
/***
****
**** CSS Variables
****
***/
@media screen {
:root {
--border-color-1:hsl(0, 0%, 69%);
--border-color-2:hsl(0, 0%, 88%);
--color-surface-2:hsl(0,0%,97%);
--color-surface-4:hsl(213,30%,85%);
--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%);
--color-red-3:#b50014;
--color-red-light-3:#c33242;
--color-base:#262e35;
--color-base--subtle:#646464;
--color-base--emphasized:#202020;
--color-primary:#143fbf;
}
:root.skin-citizen-dark {
--border-color-1:hsl(220, 28%, 23%);
--border-color-2:hsl(220,25%,20%);
--color-surface-5:hsl(220,25%,15%);
--color-surface-6:hsl(220,12%,35%);
--color-surface-7:hsl(220,12%,40%);
--color-red-3:#b50014;
--color-red-light-3:#c33242;
--color-surface-subtle-red:hsl(0, 45%, 28%);
--color-primary:#5c85d6;
}
}
/***
****
**** Mobile Citzen CSS
****
***/
@media (max-width: 720px) {
table {
width:100% !important;
display: table;
}
}
/**
* General theming
*
**/
/** Edit buttons **/
#ca-edit > a:hover, #ca-ve-edit > a:hover {
background-color: var(--color-red-light-3);
}
#ca-edit > a, #ca-ve-edit > a {
background-color: var(--color-red-3);
color: #fff;
}
.citizen-ve-edit-merged#ca-edit {
border-left: 1px solid #900010;
}
#citizen-languages__buttonCheckbox::after {
background: var(--color-red-3);
}
.toccolours {
background-color: var(--color-surface-2);
border: 1px solid var(--border-color-1);
}
blockquote {
font-family: inherit;
color: inherit;
font-style: inherit;
font-size: 95%;
}
/* CSS for input textboxes */
.mw-ui-input {
border-color: var(--border-color-1);
}
/* CSS for Infoboxes */
.infobox {
border: 1px solid var(--border-color-1);
background-color: var(--color-surface-2);
color: var(--color-base);
margin: 0.5em 0 0.5em 1em;
border-spacing: 3px;
float: right;
clear: right;
font-size: 88%;
line-height: 1.5em;
padding: 1em;
}
.infobox td, .infobox th {
vertical-align: top;
text-align: left;
}
.infobox.geography {
border-collapse: collapse;
line-height: 1.2em;
font-size: 90%;
}
.infobox.geography td, .infobox.geography th {
border-top: 1px solid var(--border-color-1);
padding: 0.4em 1.5em 0.4em 1.5em;
}
.infobox.geography .mergedtoprow td, .infobox.geography .mergedtoprow th {
border-top: 1px solid var(--border-color-1);
padding: 0.4em 1.5em 0.2em 1.5em;
}
.infobox.geography .mergedbottomrow td, .infobox.geography .mergedbottomrow th {
border-top: 0;
border-bottom: 1px solid var(--border-color-1);
padding: 0 1.5em 0.4em 1.5em;
}
.infobox.geography .mergedrow td, .infobox.geography .mergedrow th {
border:0;
padding: 0 1.5em 0.2em 1.5em;
}
.infobox.geography .maptable td,
.infobox.geography .maptable th {
border: 0;
padding: 0;
}
/* CSS for Navboxes */
.navbox th, .navbox-title {
background-color: var(--color-surface-4);
}
.navbox-abovebelow, th.navbox-group, .navbox-subgroup .navbox-title {
background-color: var(--color-surface-5);
}
.navbox {
background-color: var(--color-surface-1);
border: 1px solid var(--border-color-1);
}
.navbox-list {
border-color: var(--border-color-2);
}
.navbox-even {
background-color: var(--color-surface-2);
}
tr + tr > .navbox-abovebelow, tr + tr > .navbox-group, tr + tr > .navbox-image, tr + tr > .navbox-list {
border-top: 2px solid var(--border-color-2);
}
/* CSS for Message boxes */
.mbox {
border: 1px solid var(--border-color-1) !important;
background-color: var(--color-surface-2) !important;
border-left: 10px solid var(--color-red-3) !important;
}
/**
* StructuredDiscussions theming (discussion pages)
*
**/
.flow-post {
color: var(--color-base);
}
.flow-topic-titlebar {
background-color: var(--color-surface-3);
}
div > .flow-menu ul {
background: var(--color-surface-2);
border: 1px solid var(--border-color-1);
}
.flow-topic-moderatestate-lock .flow-topic-titlebar {
background-color: var(--color-surface-4);
}
@media all and (min-width:1165px) {
.flow-component.flow-board-page .flow-board-navigation,
.flow-component.flow-board-page .flow-board {
float:none;
}
.flow-component.flow-board-page .flow-board-header {
min-height:0;
}
}
/**
* ConfirmAcccount theming
*
**/
.mw-confirmaccount-type-0 {
background-color: var(--color-surface-4);
}
.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);
}
.mw-confirmaccount-bar {
border: 1px solid var(--border-color-1);
background-color: var(--color-surface-2);
}
input, select, textarea {
border: 1px solid var(--border-color-1);
background-color: var(--color-surface-2);
color: var(--color-base--emphasized);
}
/***
**** Code editor interface
***/
.ace-tm .ace_gutter {
background-color:var(--color-surface-2);
border-right:1px solid var(--border-color-2);
}
/***
****
**** Visual editor interface
****
***/
.oo-ui-popupWidget-anchored-top .oo-ui-popupWidget-anchor::before {
border-bottom-color: var(--border-color-1);
}
.oo-ui-popupWidget-popup {
border: 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-buttonGroupWidget {
border:1px solid var(--border-color-1);
}
.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);
}