Diferencia entre revisiones de «MediaWiki:SiteColor.css»

Revisión actual - 09:09 26 feb 2024

/**
Se llama desde [[MediaWiki:Common.css]] para el uso del sitio.
Ver [[Módulo:SiteColor/doc]] para valores actualizados en invocaciones de plantillas y módulos.

NOTA: El editor no sabe cómo manejar las variables CSS y se quejará
sobre la existencia de errores cuando se guarda este archivo. Asegúrese de revisar sus
ediciones cuidadosamente antes de guardar.

NOTA: Importado de Inkipedia inglesa y traducido al español.
*/

/**************
*   TABLAS    *
**************/
/** Debe estar aquí para que el color del sitio pueda anularse. */
/* Clase wikitable para el diseño de tablas. los colores por defecto están pensados para tablas generadas por MediaWiki, como la tabla de historial de archivos. Hay otros esquemas de color disponibles para su uso en Mainspace; ver las clases SiteColor más abajo. */
table.wikitable {
  background-color: var(--input, #fff);
  color: var(--input-text, #222);
  margin: 1em 0;
  border-style: solid;
  border-width: 5px 2px;
  border-color: #006400;
  border-collapse: collapse;
  box-shadow: 0 2px 16px rgba(0,0,0,0.25);
  overflow-wrap: normal;  /** Thanks Chromium */
}

/* Clase cebra destinado a ser utilizado en el espacio de nombres Inkipedia, por ejemplo, la página de personal. */
table.zebra-inkipedia > tbody > tr:nth-child(odd) > td {
  background-color: var(--ui-main-theme-b, rgba(55, 139, 0, 0.2));  /* green, the same shade used for links but with 20% opacity */
}

table.wikitable > thead > tr > th,
table.wikitable > tbody > tr > th,
table.wikitable > tbody > tr > td {
  border-style: solid;
  border-width: 1px;
  border-color: var(--ui-main-theme, #006400);
  padding: 0.2em 0.4em;
  overflow-wrap: normal;  /** Thanks Chromium */
}

table.wikitable > thead > tr > th,
table.wikitable > tbody > tr > th {
  background-color: var(--ui-main-theme, #378B00);
  color: var(--input, #fff);
}

table.wikitable > caption {
  font-weight: bold;
}

/**************
* SITE COLORS *
**************/

/** Generico: "0, 153, 255" <!-- #0099FF --> **/
.sitecolor-generico, .site-color-generico {
  color: var(--site-color-generico, rgb(0, 153, 255));
}

.sitecolor-text-generico, .site-color-text-generic {
  color: var(--site-color-text-generico, black);
}

.sitecolor-background-generico, .site-color-background-generico {
  background: var(--site-color-background-generico, rgb(0, 153, 255));
}

.sitecolor-background-shadow-generico, .site-color-background-shadow-generico {
  background: var(--site-color-background-shadow-generico, rgba(0, 153, 255, 0.2));
}

table.sitecolor-generico,
table.sitecolor-generico > thead > tr > th,
table.sitecolor-generico > tbody > tr > th,
table.sitecolor-generico > tbody > tr > td {
  border-color: var(--site-color-generico, rgba(0, 153, 255, 1));
}

table.sitecolor-generico > thead > tr > th,
table.sitecolor-generico > tbody > tr > th {
  background-color: var(--site-color-background-generico, rgba(0, 153, 255, 0.25));
  color: var(--site-color-text-generico, black);
}

/* Alterna los colores de fondo de las filas en las tablas de clase cebra.
Hay opciones pares e impares para seleccionar qué fila cambia de color primero */
table.sitecolor-generico.zebra-even > tbody > tr:nth-child(even) > td,
table.sitecolor-generico.zebra-odd > tbody > tr:nth-child(odd) > td {
  background-color: var(--site-color-background-b-generico, rgba(0, 153, 255, 0.15));
}

/* vertical zebra stripes */
table.sitecolor-generic.zebra-vert tbody td:nth-child(even) {
  background-color: var(--site-color-background-b-generic, rgba(0, 153, 255, 0.15));
}


/** Octo Expansion: "174, 21, 102" <!-- #AE1566 --> **/
.sitecolor-oe, .site-color-oe {
  color: var(--site-color-oe, rgb(174, 21, 102));
}

.sitecolor-text-oe, .site-color-text-oe {
  color: var(--site-color-text-oe, white);
}

.sitecolor-background-oe, .site-color-background-oe {
  background: var(--site-color-background-oe, rgb(174, 21, 102));
}

.sitecolor-background-shadow-oe, .site-color-background-shadow-oe {
  background: var(--site-color-background-shadow-oe, rgba(174, 21, 102, 0.2));
}

table.sitecolor-oe,
table.sitecolor-oe > thead > tr > th,
table.sitecolor-oe > tbody > tr > th,
table.sitecolor-oe > tbody > tr > td {
  border-color: var(--site-color-oe, rgba(174, 21, 102, 1));
}

table.sitecolor-oe > thead > tr > th,
table.sitecolor-oe > tbody > tr > th {
  background-color: var(--site-color-background-oe, rgba(174, 21, 102, 0.25));
  color: var(--site-color-text-oe, black);  /* different to the text color! */
}

table.sitecolor-oe.zebra-even > tbody > tr:nth-child(even) > td,
table.sitecolor-oe.zebra-odd > tbody > tr:nth-child(odd) > td {
  background-color: var(--site-color-background-b-oe, rgba(174, 21, 102, 0.15));
}

table.sitecolor-niwa.zebra-vert tbody td:nth-child(even) {
  background-color: var(--site-color-background-b-oe, rgba(174, 21, 102, 0.15));
}


/** Salmon Run: "242, 124, 47" <!-- #F27C2F --> **/
.sitecolor-sr, .site-color-sr {
  color: var(--site-color-sr, rgb(242, 124, 47));
}

.sitecolor-text-sr, .site-color-text-sr {
  color: var(--site-color-text-sr, black);
}

.sitecolor-background-sr, .site-color-background-sr {
  background: var(--site-color-background-sr, rgb(242, 124, 47));
}

.sitecolor-background-shadow-sr, .site-color-background-shadow-sr {
  background: var(--site-color-background-shadow-sr, rgba(242, 124, 47, 0.2));
}

table.sitecolor-sr,
table.sitecolor-sr > thead > tr > th,
table.sitecolor-sr > tbody > tr > th,
table.sitecolor-sr > tbody > tr > td {
  border-color: var(--site-color-sr, rgba(242, 124, 47, 1));
}

table.sitecolor-sr > thead > tr > th,
table.sitecolor-sr > tbody > tr > th {
  background-color: var(--site-color-background-sr, rgba(242, 124, 47, 0.25));
  color: var(--site-color-text-sr, black);
}

table.sitecolor-sr.zebra-even > tbody > tr:nth-child(even) > td,
table.sitecolor-sr.zebra-odd > tbody > tr:nth-child(odd) > td {
  background-color: var(--site-color-background-b-sr, rgba(242, 124, 47, 0.15));
}

table.sitecolor-sr.zebra-vert tbody td:nth-child(even) {
  background-color: var(--site-color-background-b-sr, rgba(242, 124, 47, 0.15));
}


/** La cara del orden: "207, 133, 120" <!-- #CF8578 --> **/
.sitecolor-co, .site-color-co {
  color: var(--site-color-co, rgb(207, 133, 120));
}

.sitecolor-text-co, .site-color-text-co {
  color: var(--site-color-text-co, black);
}

.sitecolor-background-co, .site-color-background-co {
  background: var(--site-color-background-co, rgb(207, 133, 120));
}

.sitecolor-background-shadow-co, .site-color-background-shadow-co {
  background: var(--site-color-background-shadow-co, rgba(207, 133, 120, 0.2));
}

table.sitecolor-co,
table.sitecolor-co > thead > tr > th,
table.sitecolor-co > tbody > tr > th,
table.sitecolor-co > tbody > tr > td {
  border-color: var(--site-color-co, rgba(207, 133, 120, 1));
}

table.sitecolor-co > thead > tr > th,
table.sitecolor-co > tbody > tr > th {
  background-color: var(--site-color-background-co, rgba(207, 133, 120, 0.25));
  color: var(--site-color-text-co, black);
}

table.sitecolor-co.zebra-even > tbody > tr:nth-child(even) > td,
table.sitecolor-co.zebra-odd > tbody > tr:nth-child(odd) > td {
  background-color: var(--site-color-background-b-co, rgba(207, 133, 120, 0.15));
}


/** Splatoon: "170, 220, 0" <!-- #AADC00 --> **/
.sitecolor-s, .site-color-s {
  color: var(--site-color-s, rgb(170, 220, 0));
}

.sitecolor-text-s, .site-color-text-s {
  color: var(--site-color-text-s, black);
}

.sitecolor-background-s, .site-color-background-s {
  background: var(--site-color-background-s, rgb(170, 220, 0));
}

.sitecolor-background-shadow-s, .site-color-background-shadow-s {
  background: var(--site-color-background-shadow-s, rgba(170, 220, 0, 0.2));
}

table.sitecolor-s,
table.sitecolor-s > thead > tr > th,
table.sitecolor-s > tbody > tr > th,
table.sitecolor-s > tbody > tr > td {
  border-color: var(--site-color-s, rgba(170, 220, 0, 1));
}

table.sitecolor-s > thead > tr > th,
table.sitecolor-s > tbody > tr > th {
  background-color: var(--site-color-background-s, rgba(170, 220, 0, 0.25));
  color: var(--site-color-text-s, black);
}

table.sitecolor-s.zebra-even > tbody > tr:nth-child(even) > td,
table.sitecolor-s.zebra-odd > tbody > tr:nth-child(odd) > td {
  background-color: var(--site-color-background-b-s, rgba(170, 220, 0, 0.15));
}

table.sitecolor-s.zebra-vert tbody td:nth-child(even) {
  background-color: var(--site-color-background-b-s, rgba(170, 220, 0, 0.15));
}


/** Splatoon 2: "240, 60, 120" <!-- #F03C78 --> **/
.sitecolor-s2, .site-color-s2 {
  color: var(--site-color-s2, rgb(240, 60, 120));
}

.sitecolor-text-s2, .site-color-text-s2 {
  color: var(--site-color-text-s2, white);
}

.sitecolor-background-s2, .site-color-background-s2 {
  background: var(--site-color-background-s2, rgb(240, 60, 120));
}

.sitecolor-background-shadow-s2, .site-color-background-shadow-s2 {
  background: var(--site-color-background-shadow-s2, rgba(240, 60, 120, 0.2));
}

table.sitecolor-s2,
table.sitecolor-s2 > thead > tr > th,
table.sitecolor-s2 > tbody > tr > th,
table.sitecolor-s2 > tbody > tr > td {
  border-color: var(--site-color-s2, rgba(240, 60, 120, 1));
}

table.sitecolor-s2 > thead > tr > th,
table.sitecolor-s2 > tbody > tr > th {
  background-color: var(--site-color-background-s2, rgba(240, 60, 120, 0.25));
  color: var(--site-color-text-s2, black);  /* different to the text color! */
}

table.sitecolor-s2.zebra-even > tbody > tr:nth-child(even) > td,
table.sitecolor-s2.zebra-odd > tbody > tr:nth-child(odd) > td {
  background-color: var(--site-color-background-b-s2, rgba(240, 60, 120, 0.15));
}

table.sitecolor-s2.zebra-vert tbody td:nth-child(even) {
  background-color: var(--site-color-background-b-s2, rgba(240, 60, 120, 0.15));
}


/** Splatoon 3: "235, 238, 61" <!-- #EBEE3D --> **/
.sitecolor-color-s3, .site-color-color-s3 {
  color: var(--site-color-s3, rgb(235, 238, 61));
}

.sitecolor-text-s3, .site-color-text-s3 {
  color: var(--site-color-text-s3, black);
}

.sitecolor-background-s3, .site-color-background-s3 {
  background: var(--site-color-background-s3, rgb(235, 238, 61));
}

.sitecolor-background-shadow-s3, .site-color-background-shadow-s3 {
  background: var(--site-color-background-shadow-s3, rgba(235, 238, 61, 0.2));
}

table.sitecolor-s3,
table.sitecolor-s3 > thead > tr > th,
table.sitecolor-s3 > tbody > tr > th,
table.sitecolor-s3 > tbody > tr > td {
  border-color: var(--site-color-s3, rgba(235, 238, 61, 1));
}

table.sitecolor-s3 > thead > tr > th,
table.sitecolor-s3 > tbody > tr > th {
  background-color: var(--site-color-background-s3, rgba(235, 238, 61, 0.25));
  color: var(--site-color-text-s3, black);
}

table.sitecolor-s3.zebra-even > tbody > tr:nth-child(even) > td,
table.sitecolor-s3.zebra-odd > tbody > tr:nth-child(odd) > td {
  background-color: var(--site-color-background-b-s3, rgba(235, 238, 61, 0.15));
}

table.sitecolor-s3.zebra-vert tbody td:nth-child(even) {
  background-color: var(--site-color-background-b-s3, rgba(235, 238, 61, 0.15));
}


/** Default: "192, 192, 192" <!-- #C0C0C0 --> **/
.sitecolor-default, .site-color-default {
  color: var(--site-color-default, rgb(192, 192, 192));
}

.sitecolor-text-default, .site-color-text-default {
  color: var(--site-color-text-default, inherit);
}

.sitecolor-background-default, .site-color-background-default {
  background: var(--site-color-background-default, rgb(192, 192, 192));
}

.sitecolor-background-shadow-default, .site-color-background-shadow-default {
  background: var(--site-color-background-shadow-default, rgba(192, 192, 192, 0.2));
}

table.sitecolor-default,
table.sitecolor-default > thead > tr > th,
table.sitecolor-default > tbody > tr > th,
table.sitecolor-default > tbody > tr > td {
  border-color: var(--site-color-default, rgba(192, 192, 192, 1));
}

table.sitecolor-default > thead > tr > th,
table.sitecolor-default > tbody > tr > th {
  background-color: var(--site-color-background-default, rgba(192, 192, 192, 0.25));
  color: var(--site-color-text-default, black);
}

table.sitecolor-s3.zebra-even > tbody > tr:nth-child(even) > td,
table.sitecolor-s3.zebra-odd > tbody > tr:nth-child(odd) > td {
  background-color: var(--site-color-background-b-default, rgba(192, 192, 192, 0.15));
}

table.sitecolor-s3.zebra-vert tbody td:nth-child(even) {
  background-color: var(--site-color-background-b-default, rgba(192, 192, 192, 0.15));
}

/** Side Order: "207, 133, 120" <!-- #CF8578 --> **/
.sitecolor-so, .site-color-so {
  color: var(--site-color-so, rgb(207, 133, 120));
}

.sitecolor-text-so, .site-color-text-so {
  color: var(--site-color-text-so, black);
}

.sitecolor-background-so, .site-color-background-so {
  background: var(--site-color-background-so, rgb(207, 133, 120));
}

.sitecolor-background-shadow-so, .site-color-background-shadow-so {
  background: var(--site-color-background-shadow-so, rgba(207, 133, 120, 0.2));
}

table.sitecolor-so,
table.sitecolor-so > thead > tr > th,
table.sitecolor-so > tbody > tr > th,
table.sitecolor-so > tbody > tr > td {
  border-color: var(--site-color-so, rgba(207, 133, 120, 1));
}

table.sitecolor-so > thead > tr > th,
table.sitecolor-so > tbody > tr > th {
  background-color: var(--site-color-background-so, rgba(207, 133, 120, 0.25));
  color: var(--site-color-text-so, black);
}