User:Shahar/timeless.css

From Inkipedia, the Splatoon wiki
< User:Shahar
Revision as of 19:09, 7 September 2022 by Shahar (talk | contribs) (Troubleshoot)

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.
@import url("https://splatoonwiki.org/wiki/User:GuyPerfect/timeless-tinted.css?action=raw&ctype=text/css");

/*==================================================
  TABLES
==================================================*/

/* wikitable class for skinning tables. default colors are intended for mediawiki-generated tables, like the file history table. other color schemes are available for use in mainspace; see the sitecolor classes below. */
table.wikitable {
  background-color: var(--input, #fff);
  color: var(--input-text, #222);
  margin: 1em 0;
  border-style: solid;
  border-width: 5px 2px;
  border-color: var(--border, #006400);
  border-collapse: collapse;
  box-shadow: 0 0 1em var(--shadow, rgba(0, 0, 0, 0.25));
}

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

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

/* classes for adding site colors to tables 
   site colors are documented at [[Template:SiteColor]] */
table.sitecolor-generic,
table.sitecolor-generic > thead > tr > th,
table.sitecolor-generic > tbody > tr > th,
table.sitecolor-generic > tbody > tr > td {
  border-color: var(--site-color-generic, rgba(0, 153, 255, 1));  /* generic blue */
}

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

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

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(--input-text, #222);
}

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

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(--input-text, #222);
}

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));  /* Octo Expansion default ink color */
}

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(--input-text, #222);
}

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

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(--input-text, #222);
}

table.sitecolor-niwa,
table.sitecolor-niwa > thead > tr > th,
table.sitecolor-niwa > tbody > tr > th,
table.sitecolor-niwa > tbody > tr > td {
  border-color: var(--site-color-niwa, rgba(255, 128, 0, 1));  /* NIWA orange */
}

table.sitecolor-niwa > thead > tr > th,
table.sitecolor-niwa > tbody > tr > th {
  background-color: var(--site-color-background-niwa, rgba(255, 128, 0, 0.25));
  color: var(--input-text, #222);
}

/* alternates background colors for rows in zebra-classed tables 
   there are even and odd options to select which row changes color first */
table.sitecolor-generic.zebra-even > tbody > tr:nth-child(even) > td,
table.sitecolor-generic.zebra-odd > tbody > tr:nth-child(odd) > td {
  background-color: var(--site-color-background-b-generic, rgba(0, 153, 255, 0.15)); /* generic blue */
}

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

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

table.sitecolor-niwa.zebra-even > tbody > tr:nth-child(even) > td,
table.sitecolor-niwa.zebra-odd > tbody > tr:nth-child(odd) > td {
  background-color: var(--site-color-background-b-niwa, rgba(255, 128, 0, 0.15)); /* NIWA orange */
}

/* zebra class intended for use in the inkipedia namespace, for example the staff page. */
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 */
}

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

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 1 grello */
}

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 2 pink */
}

table.sitecolor-niwa.zebra-vert tbody td:nth-child(even) {
  background-color: var(--site-color-background-b-niwa, rgba(255, 128, 0, 0.15)); /* NIWA orange */
}

/* removes borders from table cells to complement zebra stripes */
table.nocellborder > thead > tr > th,
table.nocellborder > tbody > tr > th,
table.nocellborder > tbody > tr > td {
  border-style: none;
}

/* left-aligns header cell text to complement zebra stripes */
table.nocellborder > thead > tr > th,
table.nocellborder > tbody > tr > th {
  text-align: left;
}