Toggle menu
Toggle personal menu
Not logged in
Your IP address will be publicly visible if you make any edits.

MediaWiki:Citizen.css: Difference between revisions

MediaWiki interface page
More languages
(commented out edit buttons fix, removed "fake" edit button code since we don't need it anymore)
(commenting out all custom color changes to restore default Citizen colors)
Line 14: Line 14:
.wikitable{
.wikitable{
border:none!important;
border:none!important;
}
/*checkboxes*/
.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type="checkbox"]:checked + span, .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type="checkbox"]:indeterminate + span{
background-color: var(--color-primary); /*should be default blue*/
}
}


Line 101: Line 96:
***/
***/
.rt-tooltip {
.rt-tooltip {
background-color: var(--color-surface-2);
/*background-color: var(--color-surface-2);*/
color: var(--color-base);
/*color: var(--color-base);*/
border:1px solid var(--border-color-1)
/*border:1px solid var(--border-color-1);*/
}
}
.rt-tooltipTail::after {
.rt-tooltipTail::after {
background: var(--color-surface-2);
/*background: var(--color-surface-2);*/
}
}
.rt-tooltipTail {
.rt-tooltipTail {
background:linear-gradient(to top right,var(--border-color-1) 50%,rgba(0,0,0,0) 50%)
/*background:linear-gradient(to top right,var(--border-color-1) 50%,rgba(0,0,0,0) 50%);*/
}
}
.rt-target {
.rt-target {
background-color: var(--color-surface-4);
/*background-color: var(--color-surface-4);*/
}
}


.toccolours {
.toccolours {
background-color: var(--color-surface-2);
/*background-color: var(--color-surface-2);*/
border: 1px solid var(--border-color-1);
/*border: 1px solid var(--border-color-1);*/
}
}


Line 130: Line 125:
***/
***/
.mw-ui-input {
.mw-ui-input {
border-color: var(--border-color-1);
/*border-color: var(--border-color-1);*/
}
}


Line 137: Line 132:
***/
***/
.wikitable th {
.wikitable th {
border: 1px solid var(--border-color-2);
/*border: 1px solid var(--border-color-2);*/
background-color: var(--color-surface-3);
/*background-color: var(--color-surface-3);*/
}
}
.wikitable td {
.wikitable td {
background-color: var(--color-surface-2)
/*background-color: var(--color-surface-2);*/
}
}
.wikitable {
.wikitable {
border: 1px solid var(--border-color-2);
/*border: 1px solid var(--border-color-2);*/
}
}


Line 151: Line 146:
***/
***/
.infobox {
.infobox {
border: 1px solid var(--border-color-1) !important;
/*border: 1px solid var(--border-color-1) !important;*/
background-color: var(--color-surface-2) !important;
/*background-color: var(--color-surface-2) !important;*/
color: var(--color-base) !important;
/*color: var(--color-base) !important;*/
margin: 0.5em 0 0.5em 1em;
margin: 0.5em 0 0.5em 1em;
border-spacing: 3px;
border-spacing: 3px;
Line 173: Line 168:
}
}
.infobox.geography td, .infobox.geography th {
.infobox.geography td, .infobox.geography th {
border-top: 1px solid var(--border-color-1);
/*border-top: 1px solid var(--border-color-1);*/
padding: 0.4em 1.5em 0.4em 1.5em;
padding: 0.4em 1.5em 0.4em 1.5em;
}
}
.infobox.geography .mergedtoprow td, .infobox.geography .mergedtoprow th {
.infobox.geography .mergedtoprow td, .infobox.geography .mergedtoprow th {
border-top: 1px solid var(--border-color-1);
/*border-top: 1px solid var(--border-color-1);*/
padding: 0.4em 1.5em 0.2em 1.5em;
padding: 0.4em 1.5em 0.2em 1.5em;
}
}
Line 183: Line 178:
.infobox.geography .mergedbottomrow td, .infobox.geography .mergedbottomrow th {
.infobox.geography .mergedbottomrow td, .infobox.geography .mergedbottomrow th {
border-top: 0;
border-top: 0;
border-bottom: 1px solid var(--border-color-1);
/*border-bottom: 1px solid var(--border-color-1);*/
padding: 0 1.5em 0.4em 1.5em;
padding: 0 1.5em 0.4em 1.5em;
}
}
Line 204: Line 199:
***/
***/
.navbox th, .navbox-title {
.navbox th, .navbox-title {
background-color: var(--color-surface-4);
/*background-color: var(--color-surface-4);*/
}
}
.navbox-abovebelow, th.navbox-group, .navbox-subgroup .navbox-title {
.navbox-abovebelow, th.navbox-group, .navbox-subgroup .navbox-title {
background-color: var(--color-surface-5);
/*background-color: var(--color-surface-5);*/
}
}
.navbox {
.navbox {
background-color: var(--color-surface-1);
/*background-color: var(--color-surface-1);*/
border: 1px solid var(--border-color-1);
/*border: 1px solid var(--border-color-1);*/
}
}
.navbox-list {
.navbox-list {
border-color: var(--border-color-2);
/*border-color: var(--border-color-2);*/
}
}
.navbox-even {
.navbox-even {
background-color: var(--color-surface-2);
/*background-color: var(--color-surface-2);*/
}
}
tr + tr > .navbox-abovebelow, tr + tr > .navbox-group, tr + tr > .navbox-image, tr + tr > .navbox-list {
tr + tr > .navbox-abovebelow, tr + tr > .navbox-group, tr + tr > .navbox-image, tr + tr > .navbox-list {
border-top: 2px solid var(--border-color-2);
/*border-top: 2px solid var(--border-color-2);*/
}
}


Line 227: Line 222:
***/
***/
.mbox {
.mbox {
border: 1px solid var(--border-color-1) !important;
/*border: 1px solid var(--border-color-1) !important;*/
background-color: var(--color-surface-2) !important;
/*background-color: var(--color-surface-2) !important;*/
border-left: 10px solid var(--color-red-3) !important;
/*border-left: 10px solid var(--color-red-3) !important;*/
}
}
/***
/***
Line 235: Line 230:
***/
***/
.skin-citizen .sidebar {
.skin-citizen .sidebar {
background: var(--color-surface-2) !important;
/*background: var(--color-surface-2) !important;*/
border: 1px solid var(--border-color-1) !important;
/*border: 1px solid var(--border-color-1) !important;*/
}
}


Line 250: Line 245:
**/
**/
.flow-post {
.flow-post {
color: var(--color-base);
/*color: var(--color-base);*/
}
}
.flow-topic-titlebar {
.flow-topic-titlebar {
background-color: var(--color-surface-3);
/*background-color: var(--color-surface-3);*/
}
}
div > .flow-menu ul {
div > .flow-menu ul {
background: var(--color-surface-2);
/*background: var(--color-surface-2);*/
border: 1px solid var(--border-color-1);
/*border: 1px solid var(--border-color-1);*/
}
}
.flow-topic-moderatestate-lock .flow-topic-titlebar {
.flow-topic-moderatestate-lock .flow-topic-titlebar {
background-color: var(--color-surface-4);
/*background-color: var(--color-surface-4);*/
}
}
.flow-component.flow-board-page .flow-board-header {
.flow-component.flow-board-page .flow-board-header {
background-color: var(--color-surface-2);
/*background-color: var(--color-surface-2);*/
}
}
.flow-ui-editorWidget-editor {
.flow-ui-editorWidget-editor {
border: 1px solid var(--border-color-2);
/*border: 1px solid var(--border-color-2);*/
}
}


Line 286: Line 281:
**/
**/
.mw-confirmaccount-type-0 {
.mw-confirmaccount-type-0 {
background-color: var(--color-surface-4);
/*background-color: var(--color-surface-4);*/
}
}
.mw-confirmaccount-body-0 {
.mw-confirmaccount-body-0 {
background-color: var(--color-surface-5);
/*background-color: var(--color-surface-5);*/
}
}
.wpNewBio {
.wpNewBio {
background-color: var(--color-surface-2);
/*background-color: var(--color-surface-2);*/
}
}
.mw-special-ConfirmAccounts fieldset {
.mw-special-ConfirmAccounts fieldset {
border: 1px solid var(--border-color-1);
/*border: 1px solid var(--border-color-1);*/
}
}
.mw-confirmaccount-bar {
.mw-confirmaccount-bar {
border: 1px solid var(--border-color-1);
/*border: 1px solid var(--border-color-1);*/
background-color: var(--color-surface-2);
/*background-color: var(--color-surface-2);*/
}
}
input, select, textarea {
input, select, textarea {
border: 1px solid var(--border-color-1);
/*border: 1px solid var(--border-color-1);*/
background-color: var(--color-surface-2);
/*background-color: var(--color-surface-2);*/
color: var(--color-base--emphasized);
/*color: var(--color-base--emphasized);*/
}
}


Line 312: Line 307:
***/
***/
.ace-tm .ace_gutter {
.ace-tm .ace_gutter {
background-color:var(--color-surface-2);
/*background-color:var(--color-surface-2);*/
border-right:1px solid var(--border-color-2);
/*border-right:1px solid var(--border-color-2);*/
}
}
.ace-tm .ace_marker-layer .ace_selection {
.ace-tm .ace_marker-layer .ace_selection {
background: var(--color-codeeditor-select);
/*background: var(--color-codeeditor-select);*/
}
}
.ace-tm .ace_marker-layer .ace_selected-word {
.ace-tm .ace_marker-layer .ace_selected-word {
background:var(--color-codeeditor-similar);
/*background:var(--color-codeeditor-similar);*/
border: 1px solid var(--color-codeeditor-similar-border);
/*border: 1px solid var(--color-codeeditor-similar-border);*/
}
}
.ace_search {
.ace_search {
background-color: var(--color-surface-2);
/*background-color: var(--color-surface-2);*/
color: var(--color-base);
/*color: var(--color-base);*/
border: 1px solid var(--border-color-2);
/*border: 1px solid var(--border-color-2);*/
}
}
.ace_search_field {
.ace_search_field {
color: var(--color-base);
/*color: var(--color-base);*/
background-color: var(--color-surface-1);
/*background-color: var(--color-surface-1);*/
border-color: var(--border-color-2)
/*border-color: var(--border-color-2)*/
}
}
.ace_searchbtn {
.ace_searchbtn {
color: var(--color-base);
/*color: var(--color-base);*/
background-color: var(--color-surface-2);
/*background-color: var(--color-surface-2);*/
border-color: var(--border-color-2);
/*border-color: var(--border-color-2);*/
}
}
.ace_searchbtn:hover {
.ace_searchbtn:hover {
background-color: var(--color-surface-4);
/*background-color: var(--color-surface-4);*/
}
}
.ace_searchbtn:last-child {
.ace_searchbtn:last-child {
border-color: var(--border-color-2);
/*border-color: var(--border-color-2);*/
}
}
.ace_button {
.ace_button {
color: var(--color-base);
/*color: var(--color-base);*/
}
}
.ace_button:hover {
.ace_button:hover {
background-color: var(--color-surface-4);
/*background-color: var(--color-surface-4);*/
}
}
/*.ace-tm .ace_constant.ace_numeric {*/
/*.ace-tm .ace_constant.ace_numeric {*/
Line 364: Line 359:
***/
***/
.oo-ui-popupWidget-anchored-top .oo-ui-popupWidget-anchor::before {
.oo-ui-popupWidget-anchored-top .oo-ui-popupWidget-anchor::before {
border-bottom-color: var(--border-color-1);
/*border-bottom-color: var(--border-color-1);*/
}
}
.oo-ui-popupWidget-popup {
.oo-ui-popupWidget-popup {
border: 1px solid var(--border-color-2);
/*border: 1px solid var(--border-color-2);*/
}
}
.oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-tool-link {
.oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-tool-link {
background-color: var(--color-red-3);
/*background-color: var(--color-red-3);*/
}
}
.oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-tool-link:hover {
.oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-tool-link:hover {
background-color:var(--color-red-light-3);
/*background-color:var(--color-red-light-3);*/
}
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button {
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button {
background-color:var(--color-red-3);
/*background-color:var(--color-red-3);*/
border-color: var(--color-red-light-3);
/*border-color: var(--color-red-light-3);*/
}
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover {
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover {
border-color: var(--color-red-light-3);
/*border-color: var(--color-red-light-3);*/
}
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover{
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover{
background-color:var(--color-red-light-3);
/*background-color:var(--color-red-light-3);*/
}
}


Line 394: Line 389:
padding: 0.25em;
padding: 0.25em;
box-shadow: 0px 3px 5px rgba(0,0,0,0.1);
box-shadow: 0px 3px 5px rgba(0,0,0,0.1);
background-color:var(--color-surface-2);
/*background-color:var(--color-surface-2);*/
}
}
.wikiEditor-ui .wikiEditor-ui-view {
.wikiEditor-ui .wikiEditor-ui-view {
border:1px solid var(--border-color-1);
/*border:1px solid var(--border-color-1);*/
}
}
.wikiEditor-ui .wikiEditor-ui-top::before {
.wikiEditor-ui .wikiEditor-ui-top::before {
backdrop-filter: none;
backdrop-filter: none;
background-color: transparent;
/*background-color: transparent;*/
}
}
.CodeMirror-gutters {
.CodeMirror-gutters {
background-color:var(--color-surface-2);
/*background-color:var(--color-surface-2);*/
border-right:1px solid var(--border-color-2);
/*border-right:1px solid var(--border-color-2);*/
}
}
.skin-citizen .mw-editform .editOptions {
.skin-citizen .mw-editform .editOptions {
background-color: var(--color-surface-5);
/*background-color: var(--color-surface-5);*/
border: 1px solid var(--border-color-1);
/*border: 1px solid var(--border-color-1);*/
border-top: 0px;
border-top: 0px;
}
}
.oo-ui-buttonGroupWidget {
.oo-ui-buttonGroupWidget {
border:1px solid var(--border-color-1);
/*border:1px solid var(--border-color-1);*/
}
}
.oo-ui-textInputWidget .oo-ui-inputWidget-input {
.oo-ui-textInputWidget .oo-ui-inputWidget-input {
background-color: var(--color-surface-0);
/*background-color: var(--color-surface-0);*/
border: 1px solid var(--border-color-1);
/*border: 1px solid var(--border-color-1);*/
}
}
.oo-ui-checkboxInputWidget [type="checkbox"] + span {
.oo-ui-checkboxInputWidget [type="checkbox"] + span {
background-color: var(--color-surface-0);
/*background-color: var(--color-surface-0);*/
border: 1px solid var(--border-color-1);
/*border: 1px solid var(--border-color-1);*/
}
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button {
.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button {
border: 1px solid var(--border-color-1);
/*border: 1px solid var(--border-color-1);*/
}
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover {
.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover {
border-color: var(--border-color-2);
/*border-color: var(--border-color-2);*/
}
}


Line 435: Line 430:
***/
***/
.rc-sidebar-user {
.rc-sidebar-user {
color: var(--color-base--subtle);
/*color: var(--color-base--subtle);*/
}
}


Line 479: Line 474:
***/
***/
.oo-ui-messageWidget.oo-ui-flaggedElement-success:not(.oo-ui-messageWidget-block) {
.oo-ui-messageWidget.oo-ui-flaggedElement-success:not(.oo-ui-messageWidget-block) {
color: var(--color-success2);
/*color: var(--color-success2);*/
}
}


Line 564: Line 559:
/* New library */
/* New library */
.library-card-content{
.library-card-content{
background:var(--color-surface-0);
/*background:var(--color-surface-0);*/
}
}


/* New essays page */
/* New essays page */
.mw-parser-output .essays-sidebar-item > div{
.mw-parser-output .essays-sidebar-item > div{
background:var(--color-surface-2)!important;
/*background:var(--color-surface-2)!important;*/
}
}

Revision as of 11:19, 25 August 2024

		

/***
****
****	CSS Variables
****
***/

/*********fixing visual glitches from new update. Will be integrated later. ************/

/******* end latest update fixing *******/

/*table fix*/
.wikitable{
	border:none!important;
}

/***
****
****	Mobile Citizen CSS
****
***/
@media (max-width: 720px) {
	table {
		width:100% !important;
		display: table;
		float: unset !important;
		margin: auto !important;
    }
}

/******
 ******	General theming
 ******	
*******/
/* Adds bottom border for Title and level 1 headers */
h1,h2 {
	border-bottom: 1px solid #a2a9b1;
}

h1 {
	width: 100%;
}
/* Removes bottom border from sticky title heading */
.citizen-body-header--sticky h1 {
	border: none;
}

/***
****	CSS for edit buttons
***/

/*

.mw-ui-icon-wikimedia-edit:before{
	background-image:url(/load.php?modules=skins.citizen.icons&image=wikiText&format=original&lang=en&skin=citizen&version=xqufm);
}
.mw-ui-icon-wikimedia-edit.mw-editsection-visualeditor:before , .citizen-ui-icon.mw-ui-icon-edit.mw-ui-icon-wikimedia-edit:before{
	background-image:url(/load.php?modules=skins.citizen.icons&image=edit&format=original&lang=en&skin=citizen&version=xqufm);
}

@media screen{
	#ca-request-account > a::before{
		width:var(--size-icon);
		height:var(--size-icon);
		background-position:var(--size-icon);
		background-repeat:var(--size-icon);
		background-size:var(--size-icon);
		content:'';
		filter:invert(1);
		opacity:1;
		background-image:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2224%22 height=%2224%22 viewBox=%220 0 24 24%22%3E%3Cg fill=%22%23000%22%3E %3Cpath d=%22m19.5 9.8 2.2-2.2c.4-.4.4-1.1 0-1.6L18 2.3c-.4-.4-1.1-.4-1.6 0l-2.2 2.2 5.3 5.3zm-6.4-4.1L2 16.7V22h5.3l11.1-11.1c-.1 0-5.3-5.2-5.3-5.2z%22/%3E %3C/g%3E%3C/svg%3E");
	}
}

#ca-edit > a:hover, #ca-ve-edit > a:hover, #ca-request-account > a:hover {
	background-color: var(--color-red-light-3);
}

#ca-edit > a, #ca-ve-edit > a, #ca-request-account > a {
	background-color: var(--color-red-3);
	color: #fff;
}

.citizen-ve-edit-merged#ca-edit {
	border-left: 1px solid #a20012;
}

#citizen-languages__buttonCheckbox::after {
	background: var(--color-red-3);
}
*/

/***
****	CSS for article references
***/
.rt-tooltip {
	/*background-color: var(--color-surface-2);*/
	/*color: var(--color-base);*/
	/*border:1px solid var(--border-color-1);*/
}
.rt-tooltipTail::after {
	/*background: var(--color-surface-2);*/
}
.rt-tooltipTail {
	/*background:linear-gradient(to top right,var(--border-color-1) 50%,rgba(0,0,0,0) 50%);*/
}
.rt-target {
	/*background-color: var(--color-surface-4);*/
}

.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 wikitables
***/
.wikitable th {
	/*border: 1px solid var(--border-color-2);*/
	/*background-color: var(--color-surface-3);*/
}
.wikitable td {
	/*background-color: var(--color-surface-2);*/
}
.wikitable {
	/*border: 1px solid var(--border-color-2);*/
}

/***
****	CSS for Infoboxes
***/
.infobox {
	/*border: 1px solid var(--border-color-1) !important;*/
	/*background-color: var(--color-surface-2) !important;*/
	/*color: var(--color-base) !important;*/
	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;*/
}
/***
****	Sidebar CSS
***/
.skin-citizen .sidebar {
	/*background: var(--color-surface-2) !important;*/
	/*border: 1px solid var(--border-color-1) !important;*/
}

/*Megamenu list*/
#p-RecentChanges ul{
	list-style-type: none;
	margin:0;
}

/**
 *		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);*/
}
.flow-component.flow-board-page .flow-board-header {
	/*background-color: var(--color-surface-2);*/
}
.flow-ui-editorWidget-editor {
	/*border: 1px solid var(--border-color-2);*/
}


@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);*/
}
.ace-tm .ace_marker-layer .ace_selection {
	/*background: var(--color-codeeditor-select);*/
}
.ace-tm .ace_marker-layer .ace_selected-word {
	/*background:var(--color-codeeditor-similar);*/
	/*border: 1px solid var(--color-codeeditor-similar-border);*/
}
.ace_search {
	/*background-color: var(--color-surface-2);*/
	/*color: var(--color-base);*/
	/*border: 1px solid var(--border-color-2);*/
}
.ace_search_field {
	/*color: var(--color-base);*/
	/*background-color: var(--color-surface-1);*/
	/*border-color: var(--border-color-2)*/
}
.ace_searchbtn {
	/*color: var(--color-base);*/
	/*background-color: var(--color-surface-2);*/
	/*border-color: var(--border-color-2);*/
}
.ace_searchbtn:hover {
	/*background-color: var(--color-surface-4);*/
}
.ace_searchbtn:last-child {
	/*border-color: var(--border-color-2);*/
}
.ace_button {
	/*color: var(--color-base);*/
}
.ace_button:hover {
	/*background-color: var(--color-surface-4);*/
}
/*.ace-tm .ace_constant.ace_numeric {*/
/* color: rgb(200, 100, 200);*/
/*}*/
/*.ace-tm .ace_storage,*/
/*.ace-tm .ace_keyword {*/
/* color: rgb(0,150,200);*/
/*}*/


/***
****
****	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);*/
}
.oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-tool-link {
	/*background-color: var(--color-red-3);*/
}
.oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-tool-link:hover {
	/*background-color:var(--color-red-light-3);*/
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button {
	/*background-color:var(--color-red-3);*/
	/*border-color: var(--color-red-light-3);*/
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover {
	/*border-color: var(--color-red-light-3);*/
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover{
	/*background-color:var(--color-red-light-3);*/
}

/***
****
****	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);*/
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button {
	/*border: 1px solid var(--border-color-1);*/
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover {
	/*border-color: var(--border-color-2);*/
}


/***
****	Recent changes theming
***/
.rc-sidebar-user {
	/*color: var(--color-base--subtle);*/
}

/***
****	Page view CSS
***/

/* Image CSS */
.citizen-body a.image:hover:not(.lazy):not(.new) > img{
	transform: scale(1.03);
}

	/*not sure why the reduced scaling effect broke and why it needs @media screen, but this is exactly how it renders on a page since 1.4*/
@media screen{
	figure[typeof~="mw:File"] > a:first-child:hover:not(.lazy):not(.new) > img, figure[typeof~="mw:File/Frameless"] > a:first-child:hover:not(.lazy):not(.new) > img, figure[typeof~="mw:File/Thumb"] > a:first-child:hover:not(.lazy):not(.new) > img, figure[typeof~="mw:File/Frame"] > a:first-child:hover:not(.lazy):not(.new) > img {
		transform:scale(1.03);
	}
}

/* Table of Content styling */
.citizen-toc-level--1 > a{
	font-weight:bold;
	font-style:normal;
}

.citizen-toc-level--3 > a{
	font-weight:lighter;
	font-style:normal;
}

.citizen-toc-level--4 > a{
	font-size:0.9em;
	font-style:normal;
	font-weight:lighter;
}

.citizen-toc-level--5 > a{
	display:none;
}

/***
****	Success message after publishing an edit
***/
.oo-ui-messageWidget.oo-ui-flaggedElement-success:not(.oo-ui-messageWidget-block) {
	/*color: var(--color-success2);*/
}

/***
****
****	Bug fixes
****
***/
.oo-ui-windowManager-modal > .oo-ui-dialog {
	z-index: 101;
}
/***
****
****	Megamenu icons
****
***/
#n-Library a::before,#n-wantedpages a::before,#n-accrequest a::before,#n-Essays a::before,#n-Articles a::before,#n-Quotes a::before{
	background-repeat:no-repeat;
	content:"";
	height:1rem;
	width:1rem;
	opacity:var(--opacity-icon-base);
	background-size:100%;
}

/* adding icons for megamenu items */

#n-Library a::before{ /*Library*/
	background-image: linear-gradient(transparent,transparent),url(/load.php?modules=oojs-ui.styles.icons-editing-citation&image=book&format=original&skin=citizen);
}

#n-wantedpages a::before { /*Wanted pages*/
	background-image: linear-gradient(transparent,transparent),url(/load.php?modules=oojs-ui.styles.icons-content&image=articleNotFound&format=original&skin=citizen);
}
#n-accrequest a::before { /*Recruitment*/
	background-image: linear-gradient(transparent,transparent),url(/load.php?modules=oojs-ui.styles.icons-user&image=userGroup&format=original&skin=citizen);
}
#n-Essays a::before { /*Essays*/
	background-image: linear-gradient(transparent,transparent),url(/load.php?modules=oojs-ui.styles.icons-editing-citation&image=newspaper&format=original&skin=citizen);
}
#n-Articles a::before { /*All pages*/
	background-image:linear-gradient(transparent,transparent),url(/load.php?modules=oojs-ui.styles.icons-content&image=articles&format=original&skin=citizen);
}
#n-Quotes a::before{
	background-image:linear-gradient(transparent,transparent),url(/load.php?modules=oojs-ui.styles.icons-alerts&image=speechBubbles&format=original&skin=citizen);
}
.prolewiki-ui-icon-sandbox::before { /*Sandbox (in bottom left sidebar)*/
	background-image: linear-gradient(transparent,transparent),url(/load.php?modules=oojs-ui.styles.icons-editing-advanced&image=sandbox&format=original&skin=citizen);
}


/**
	* Appended icons in the Citizen sidebar (see Common.js for code)
**/
.sidebar-library > div, .sidebar-essays > div, .sidebar-upload > div{
	height:40px;
	width:100%;
	background-repeat:no-repeat;
	background-size:auto;
	background-position:center;
	opacity:var(--opacity-icon-base);
	content:"";
	filter:var(--filter-invert); /* for dark mode */
}

.sidebar-library > div{
	background-image:linear-gradient(transparent,transparent),url(/load.php?modules=oojs-ui.styles.icons-editing-citation&image=book&format=original&skin=citizen);
}

.sidebar-essays > div {
	background-image: linear-gradient(transparent,transparent),url(/load.php?modules=oojs-ui.styles.icons-editing-citation&image=newspaper&format=original&skin=citizen);
}

.sidebar-upload > div{
	background-image:linear-gradient(transparent,transparent),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3E upload %3C/title%3E%3Cpath d=%22M17 12v5H3v-5H1v5a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-5z%22/%3E%3Cpath d=%22M10 1 5 7h4v8h2V7h4z%22/%3E%3C/svg%3E");
}

/***
****	Custom pages/templates specific CSS
****	for responsiveness, custom skin and dark mode use
****
***/

/* New library */
.library-card-content{
	/*background:var(--color-surface-0);*/
}

/* New essays page */
.mw-parser-output .essays-sidebar-item > div{
	/*background:var(--color-surface-2)!important;*/
}