Diferencia entre revisiones de «MediaWiki:Citizen.css»

Página de la interfaz de MediaWiki
(Página creada con «→‎All CSS here will be loaded for users of the Citizen skin: body { font-family: 'Roboto', sans-serif; } blockquote { padding: 8px 16px; font-size: 100%; font-style: inherit; color: var(--color-base) } .skin-citizen-dark .mwe-popups-container { background-color: var(--background-color-dp-03); } .skin-citizen-light { --color-base: #1c2431; } →‎EDITOR CONFIGURATION: .skin-citizen-light .wikiEditor-ui { box-shadow: 0px 0px 0.6em -0.15em rgba(0, 0, 0, 0.…»)
 
m (Atualizado estilos)
Línea 1: Línea 1:
/* All CSS here will be loaded for users of the Citizen skin */
/***
****
**** CSS Variables
****
***/
@media screen {
:root {
--border-color-1:#b0b0b0;
--border-color-2:#c7c7c7;
--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-codeeditor-select:#b5d5ff;
--color-codeeditor-similar:#fafaff;
--color-codeeditor-similar-border:#c8c8fa;
--color-red-2:#900010;
--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-codeeditor-select:#485465;
--color-codeeditor-similar:#394350;
--color-codeeditor-similar-border:#4c5561;
--color-red-2:#900010;
--color-surface-subtle-red:hsl(0, 45%, 28%);
--color-primary:#5c85d6;
}
}
 
/***
****
**** Mobile Citizen CSS
****
***/
@media (max-width: 720px) {
  table {
  width:100% !important;
  display: table;
  }
}
 
 
 
 
/**
* General theming
*
**/
 
/***
**** CSS for 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 #a20012;
}
#citizen-languages__buttonCheckbox::after {
  background: var(--color-red-3);
}


body {
/***
font-family: 'Roboto', sans-serif;
**** 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%)
}
 
 
.toccolours {
  background-color: var(--color-surface-2);
  border: 1px solid var(--border-color-1);
}
}


blockquote {
blockquote {
padding: 8px 16px;
  font-family: inherit;
font-size: 100%;
  color: inherit;
font-style: inherit;
  font-style: inherit;
color: var(--color-base)
  font-size: 95%;
}
/***
**** CSS for input textboxes
***/
.mw-ui-input {
border-color: var(--border-color-1);
}
}


.skin-citizen-dark .mwe-popups-container {
/***
background-color: var(--background-color-dp-03);
**** 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);
}
}


.skin-citizen-light {
/***
--color-base: #1c2431;
**** 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;
}
}
/* EDITOR CONFIGURATION */
.infobox.geography .mergedtoprow td, .infobox.geography .mergedtoprow th {
.skin-citizen-light .wikiEditor-ui {
border-top: 1px solid var(--border-color-1);
box-shadow: 0px 0px 0.6em -0.15em rgba(0, 0, 0, 0.5);
padding: 0.4em 1.5em 0.2em 1.5em;
}
}
.skin-citizen-dark .wikiEditor-ui {
 
box-shadow: 0px 0px 0.6em -0.15em rgba(0, 0, 0);
.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;
}
}
.skin-citizen-dark .ui-state-default {
.infobox.geography .mergedrow td, .infobox.geography .mergedrow th {
background: var(--background-color-framed);
border:0;
padding: 0 1.5em 0.2em 1.5em;
}
}


.skin-citizen-dark .ace-tm {
.infobox.geography .maptable td,
background-color: var(--background-color-dp-01);
.infobox.geography .maptable th {
color: var(--color-base)
border: 0;
padding: 0;
}
 
 
 
 
/***
**** CSS for Navboxes
***/
.navbox th, .navbox-title {
background-color: var(--color-surface-4);
}
}
.skin-citizen-dark .ace-tm .ace_print-margin {
.navbox-abovebelow, th.navbox-group, .navbox-subgroup .navbox-title {
background: var(--background-color-dp-00);
background-color: var(--color-surface-5);
}
}
.skin-citizen-dark .ace-tm .ace_gutter {
.navbox {
background: var(--color-surface-1);
background-color: var(--color-surface-1);
border: 1px solid var(--border-color-1);
}
}
.skin-citizen-dark .ace-tm .ace_gutter-active-line {
.navbox-list {
background-color: var(--color-surface-2--active);
border-color: var(--border-color-2);
}
}
.skin-citizen-dark .codeEditor-status {
.navbox-even {
background-color: var(--color-surface-2);
background-color: var(--color-surface-2);
border-top:0;
}
tr + tr > .navbox-abovebelow, tr + tr > .navbox-group, tr + tr > .navbox-image, tr + tr > .navbox-list {
border-top: 2px solid var(--border-color-2);
}
}


.skin-citizen-dark .editOptions {
/***
background-color: var(--color-surface-1);
**** CSS for Message boxes
color: var(--color-base);
***/
box-shadow: 0px 0px 0.6em -0.15em rgba(0, 0, 0);
.mbox {
border:0;
border: 1px solid var(--border-color-1) !important;
background-color: var(--color-surface-2) !important;
border-left: 10px solid var(--color-red-3) !important;
}
}
.skin-citizen-light .editOptions {
/***
border:0;
**** Sidebar CSS
box-shadow: 0px 0px 0.6em -0.15em rgba(0, 0, 0, 0.5);
***/
.skin-citizen .sidebar {
background: var(--color-surface-2) !important;
border: 1px solid var(--border-color-1) !important;
}
}


/* TOC CONFIGURATION */
 
@media screen {
 
.skin-citizen-dark #toc {
/**
box-shadow: 0px 2.25em 1em -0.15em rgb(0, 0, 0);
* StructuredDiscussions theming (discussion pages)
}
*
.skin-citizen-light #toc {
**/
box-shadow: 0px 2.25em 1em -0.15em rgb(0, 0, 0,0.5);
.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 screen and (max-width: 1300px) {
 
.skin-citizen-dark #toc {
 
box-shadow: none;
@media all and (min-width:1165px) {
}
.flow-component.flow-board-page .flow-board-navigation,
.skin-citizen-light #toc {
.flow-component.flow-board-page .flow-board {
box-shadow: none;
float:none;
}
.flow-component.flow-board-page .flow-board-header {
min-height:0;
}
}
}
}


/* INFOBOX CONFIGURATION */
 
.skin-citizen-dark .infobox {
 
color: var(--color-base);
 
 
/**
* 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);
background-color: var(--color-surface-2);
box-shadow: 0px 0px 0.6em -0.15em rgb(0,0,0);
border: 0;
}
}
.skin-citizen-light .infobox {
.mw-special-ConfirmAccounts fieldset {
box-shadow: 0px 0px 0.6em -0.15em rgb(0,0,0,0.5);
border: 1px solid var(--border-color-1);
border: 0;
}
.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);
}
}
.skin-citizen-dark .sidebar {
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button {
background-color: var(--color-surface-2) !important;
background-color:var(--color-red-3);
border: 0 !important;
border-color: var(--color-red-light-3);
box-shadow: 0px 0px 0.6em -0.15em rgb(0,0,0) !important;
}
}
.skin-citizen-light .sidebar {
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover {
border: 0 !important;
border-color: var(--color-red-light-3);
box-shadow: 0px 0px 0.6em -0.15em rgb(0,0,0,0.5) !important;
}
}
.skin-citizen-dark .sidebar-list-title {
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover{
border-bottom: 1px solid var(--background-color-dp-24) !important;
background-color:var(--color-red-light-3);
}
}


/* NAVBOX CONFIGURATION */
/***
.skin-citizen-dark .navbox {
****
background-color: var(--color-surface-2);
**** Source editor interface
border:0;
****
box-shadow: 0px 0px 0.6em -0.15em rgb(0,0,0)
***/
.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);
}
}
.skin-citizen-light .navbox {
.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover {
border:0;
border-color: var(--border-color-2);
box-shadow: 0px 0px 0.6em -0.15em rgb(0,0,0,0.5)
}
}
.skin-citizen-dark .navbox-title {
 
background-color: var(--color-surface-4);
 
/***
**** Recent changes theming
***/
.rc-sidebar-user {
color: var(--color-base--subtle);
}
}
.skin-citizen-dark th.navbox-group {
 
background-color: var(--color-surface-4);
/***
**** Page view CSS
***/
 
/* Image CSS */
.citizen-body a.image:hover:not(.lazy):not(.new) > img{
transform: scale(1.03);
}
}
.skin-citizen-dark .navbox-even {
 
background-color: var(--color-surface-2);
/* Table of Content styling */
.citizen-toc-level--1 > a{
font-weight:bold;
font-style:normal;
}
}
.skin-citizen-dark .navbox-odd {
 
background-color: var(--color-surface-2);
.citizen-toc-level--3 > a{
font-weight:lighter;
font-style:normal;
}
}
.skin-citizen-dark tr + tr > .navbox-group {
 
border-top: 2px solid var(--border-color-base);
.citizen-toc-level--4 > a{
font-size:0.9em;
font-style:normal;
font-weight:lighter;
}
}
.skin-citizen-dark tr + tr > .navbox-list {
 
border-top: 2px solid var(--border-color-base);
.citizen-toc-level--5 > a{
display:none;
}
}
.skin-citizen-dark .navbox-list {
 
border-color: var(--border-color-base);
/***
**** Success message after publishing an edit
***/
.oo-ui-messageWidget.oo-ui-flaggedElement-success:not(.oo-ui-messageWidget-block) {
color: var(--color-success2);
}
}


/* LOGO */
/***
.mw-logo-icon {
****
width:32px;
**** Bug fixes
object-fit:contain;
****
***/
.oo-ui-windowManager-modal > .oo-ui-dialog {
z-index: 12;;
}
}

Revisión del 18:39 15 jun 2023

/***
****
****	CSS Variables
****
***/
@media screen {
	:root {
		--border-color-1:#b0b0b0;
		--border-color-2:#c7c7c7;
		--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-codeeditor-select:#b5d5ff;
		--color-codeeditor-similar:#fafaff;
		--color-codeeditor-similar-border:#c8c8fa;
		--color-red-2:#900010;
		--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-codeeditor-select:#485465;
		--color-codeeditor-similar:#394350;
		--color-codeeditor-similar-border:#4c5561;
		--color-red-2:#900010;
		--color-surface-subtle-red:hsl(0, 45%, 28%);
		--color-primary:#5c85d6;
	}
}

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




/**
 *		General theming
 *		
**/

/***
****	CSS for 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 #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%)
}


.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;
}



/**
 *		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);
}

/* 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: 12;;
}
Obtenido de «https://es.prolewiki.org/index.php?title=MediaWiki:Citizen.css&oldid=5604»
Última modificación
Esta página se editó por última vez el 15 jun 2023 a las 18:39.
⧼citizen-page-info-viewcount⧽
Esta página ha recibido 161 visitas.