MediaWiki:Citizen.css: Difference between revisions

From Pactoria Wiki
Jump to navigation Jump to search
No edit summary
No edit summary
Line 1: Line 1:
/* =============================================
/* =============================================
   Pactoria Wiki — Citizen Skin Theme
   Pactoria Wiki — Citizen Skin Theme
   Dark fantasy, earthy gold accents
   Dark base, steel blue & white accents
   ============================================= */
   ============================================= */


Line 10: Line 10:
   --pactoria-bg-base:        #0d0e10;
   --pactoria-bg-base:        #0d0e10;
   --pactoria-bg-surface:    #111214;
   --pactoria-bg-surface:    #111214;
   --pactoria-bg-raised:      #161719;
   --pactoria-bg-raised:      #161820;
   --pactoria-bg-sidebar:    #0f1012;
   --pactoria-bg-sidebar:    #0f1012;
   --pactoria-border:        #2a2215;
   --pactoria-border:        #1e2235;
   --pactoria-border-strong:  #3a2e1e;
   --pactoria-border-strong:  #2a3050;
   --pactoria-gold:          #c9a227;
   --pactoria-blue:          #7aa2d4;
   --pactoria-gold-light:    #e8d49a;
   --pactoria-blue-light:    #b8d0ef;
   --pactoria-text:          #b8a88a;
  --pactoria-blue-bright:    #4f8cc9;
   --pactoria-text-muted:    #6a5e44;
   --pactoria-text:          #b8c8d8;
   --pactoria-text-dim:      #3a3020;
   --pactoria-text-muted:    #5a6a80;
   --pactoria-link:          #c9a227;
   --pactoria-text-dim:      #2a3040;
   --pactoria-link:          #7aa2d4;
}
}


Line 42: Line 43:
.firstHeading {
.firstHeading {
   font-family: 'Cinzel', 'Palatino Linotype', serif !important;
   font-family: 'Cinzel', 'Palatino Linotype', serif !important;
   color: var(--pactoria-gold-light) !important;
   color: var(--pactoria-blue-light) !important;
   letter-spacing: 0.04em;
   letter-spacing: 0.04em;
   font-weight: 600;
   font-weight: 600;
Line 54: Line 55:
   padding-bottom: 0.3em;
   padding-bottom: 0.3em;
   margin-bottom: 0.5em;
   margin-bottom: 0.5em;
   color: var(--pactoria-gold-light) !important;
   color: var(--pactoria-blue-light) !important;
}
}


Line 74: Line 75:


a:hover {
a:hover {
   color: var(--pactoria-gold-light) !important;
   color: var(--pactoria-blue-light) !important;
   text-decoration: underline;
   text-decoration: underline;
}
}


a.new { color: #b85a3a !important; } /* red links stay visible */
a.new { color: #c06060 !important; }


/* --- Header / top bar --- */
/* --- Header / top bar --- */
.citizen-header,
.citizen-header,
#citizen-header {
#citizen-header {
   background-color: #0a0b0d !important;
   background-color: #0a0b0f !important;
   border-bottom: 1px solid var(--pactoria-border-strong) !important;
   border-bottom: 1px solid var(--pactoria-border-strong) !important;
}
}
Line 91: Line 92:
.citizen-wordmark {
.citizen-wordmark {
   font-family: 'Cinzel', serif !important;
   font-family: 'Cinzel', serif !important;
   color: var(--pactoria-gold) !important;
   color: var(--pactoria-blue-light) !important;
   letter-spacing: 0.08em;
   letter-spacing: 0.08em;
}
}
Line 112: Line 113:
.citizen-nav__item a:hover,
.citizen-nav__item a:hover,
.citizen-nav__item--active a {
.citizen-nav__item--active a {
   color: var(--pactoria-gold) !important;
   color: var(--pactoria-blue-light) !important;
   background-color: #1a1710 !important;
   background-color: #131620 !important;
}
}


Line 120: Line 121:
   font-size: 0.7em;
   font-size: 0.7em;
   letter-spacing: 0.12em;
   letter-spacing: 0.12em;
   color: var(--pactoria-gold) !important;
   color: var(--pactoria-blue) !important;
   text-transform: uppercase;
   text-transform: uppercase;
}
}
Line 132: Line 133:
}
}


/* --- Infoboxes / tables --- */
/* --- Main page table fix --- */
#mw-content-text table,
#mw-content-text table td,
#mw-content-text table th {
  background-color: #111214 !important;
  color: #b8c8d8 !important;
  border-color: #1e2235 !important;
}
 
/* --- Infoboxes / wikitables --- */
.infobox,
.infobox,
table.wikitable {
table.wikitable {
   background-color: #0d0f0a !important;
   background-color: #0d0f14 !important;
   border: 1px solid var(--pactoria-border-strong) !important;
   border: 1px solid var(--pactoria-border-strong) !important;
   color: var(--pactoria-text) !important;
   color: var(--pactoria-text) !important;
Line 143: Line 153:
.infobox th,
.infobox th,
table.wikitable th {
table.wikitable th {
   background-color: #1e1a0e !important;
   background-color: #131828 !important;
   color: var(--pactoria-gold) !important;
   color: var(--pactoria-blue-light) !important;
   font-family: 'Cinzel', serif !important;
   font-family: 'Cinzel', serif !important;
   font-size: 0.85em;
   font-size: 0.85em;
Line 153: Line 163:
.infobox td,
.infobox td,
table.wikitable td {
table.wikitable td {
   border-color: #1e1a12 !important;
   border-color: #1a1f2e !important;
   color: var(--pactoria-text) !important;
   color: var(--pactoria-text) !important;
}
}


table.wikitable tr:nth-child(even) td {
table.wikitable tr:nth-child(even) td {
   background-color: #0f1012 !important;
   background-color: #0f1118 !important;
}
}


Line 174: Line 184:
/* --- Blockquotes --- */
/* --- Blockquotes --- */
blockquote {
blockquote {
   border-left: 3px solid var(--pactoria-gold) !important;
   border-left: 3px solid var(--pactoria-blue) !important;
   background-color: #0f1012 !important;
   background-color: #0f1118 !important;
   padding: 0.6em 1em;
   padding: 0.6em 1em;
   color: var(--pactoria-text-muted) !important;
   color: var(--pactoria-text-muted) !important;
Line 184: Line 194:
/* --- Code blocks --- */
/* --- Code blocks --- */
pre, code {
pre, code {
   background-color: #0a0b0a !important;
   background-color: #0a0b0f !important;
   border: 1px solid var(--pactoria-border) !important;
   border: 1px solid var(--pactoria-border) !important;
   color: #8fb87a !important;
   color: #7ab8d4 !important;
   font-size: 0.88em;
   font-size: 0.88em;
}
}
Line 199: Line 209:
#toc,
#toc,
.citizen-toc__list {
.citizen-toc__list {
   background-color: #0f1012 !important;
   background-color: #0f1118 !important;
   border: 1px solid var(--pactoria-border) !important;
   border: 1px solid var(--pactoria-border) !important;
}
}
Line 210: Line 220:
.citizen-toc__item a:hover,
.citizen-toc__item a:hover,
#toc a:hover {
#toc a:hover {
   color: var(--pactoria-gold) !important;
   color: var(--pactoria-blue-light) !important;
}
}


/* --- Category links at bottom --- */
/* --- Category links at bottom --- */
#catlinks {
#catlinks {
   background-color: #0f1012 !important;
   background-color: #0f1118 !important;
   border-top: 1px solid var(--pactoria-border) !important;
   border-top: 1px solid var(--pactoria-border) !important;
   color: var(--pactoria-text-muted) !important;
   color: var(--pactoria-text-muted) !important;
   font-family: 'EB Garamond', serif;
   font-family: 'EB Garamond', serif;
   font-size: 0.9em;
   font-size: 0.9em;
}
/* Fix main page table colours */
#mw-content-text table,
#mw-content-text table td,
#mw-content-text table th {
  background-color: #111214 !important;
  color: #b8a88a !important;
  border-color: #2a2215 !important;
}
}

Revision as of 14:57, 11 June 2026

/* =============================================
   Pactoria Wiki — Citizen Skin Theme
   Dark base, steel blue & white accents
   ============================================= */

@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;600&family=EB+Garamond:ital,wght@0,400;0,500;1,400&display=swap');

/* --- Colour tokens --- */
:root {
  --pactoria-bg-base:        #0d0e10;
  --pactoria-bg-surface:     #111214;
  --pactoria-bg-raised:      #161820;
  --pactoria-bg-sidebar:     #0f1012;
  --pactoria-border:         #1e2235;
  --pactoria-border-strong:  #2a3050;
  --pactoria-blue:           #7aa2d4;
  --pactoria-blue-light:     #b8d0ef;
  --pactoria-blue-bright:    #4f8cc9;
  --pactoria-text:           #b8c8d8;
  --pactoria-text-muted:     #5a6a80;
  --pactoria-text-dim:       #2a3040;
  --pactoria-link:           #7aa2d4;
}

/* --- Base background & text --- */
body,
.skin-citizen {
  background-color: var(--pactoria-bg-base) !important;
  color: var(--pactoria-text) !important;
}

/* --- Typography --- */
body,
.citizen-page-content,
.mw-body {
  font-family: 'EB Garamond', Georgia, serif !important;
  font-size: 16px;
  line-height: 1.75;
}

h1, h2, h3, h4, h5, h6,
.citizen-page-heading,
.firstHeading {
  font-family: 'Cinzel', 'Palatino Linotype', serif !important;
  color: var(--pactoria-blue-light) !important;
  letter-spacing: 0.04em;
  font-weight: 600;
}

/* --- Page title --- */
.firstHeading,
#firstHeading {
  font-size: 1.9em;
  border-bottom: 1px solid var(--pactoria-border-strong);
  padding-bottom: 0.3em;
  margin-bottom: 0.5em;
  color: var(--pactoria-blue-light) !important;
}

/* --- Section headings --- */
.mw-body h2 {
  font-size: 1.3em;
  border-bottom: 1px solid var(--pactoria-border);
  padding-bottom: 4px;
  margin-top: 1.6em;
}

.mw-body h3 { font-size: 1.1em; }

/* --- Links --- */
a, a:visited {
  color: var(--pactoria-link) !important;
  text-decoration: none;
}

a:hover {
  color: var(--pactoria-blue-light) !important;
  text-decoration: underline;
}

a.new { color: #c06060 !important; }

/* --- Header / top bar --- */
.citizen-header,
#citizen-header {
  background-color: #0a0b0f !important;
  border-bottom: 1px solid var(--pactoria-border-strong) !important;
}

/* --- Site logo / wordmark --- */
.citizen-header__wordmark,
.citizen-wordmark {
  font-family: 'Cinzel', serif !important;
  color: var(--pactoria-blue-light) !important;
  letter-spacing: 0.08em;
}

/* --- Sidebar --- */
.citizen-drawer,
#citizen-drawer,
.citizen-toc {
  background-color: var(--pactoria-bg-sidebar) !important;
  border-right: 1px solid var(--pactoria-border) !important;
}

.citizen-nav__item a,
.citizen-drawer a {
  color: var(--pactoria-text-muted) !important;
  font-family: 'EB Garamond', serif;
  font-size: 0.95em;
}

.citizen-nav__item a:hover,
.citizen-nav__item--active a {
  color: var(--pactoria-blue-light) !important;
  background-color: #131620 !important;
}

.citizen-nav__heading {
  font-family: 'Cinzel', serif !important;
  font-size: 0.7em;
  letter-spacing: 0.12em;
  color: var(--pactoria-blue) !important;
  text-transform: uppercase;
}

/* --- Main content area --- */
.mw-body,
.citizen-page-container,
#mw-content-text {
  background-color: var(--pactoria-bg-surface) !important;
  color: var(--pactoria-text) !important;
}

/* --- Main page table fix --- */
#mw-content-text table,
#mw-content-text table td,
#mw-content-text table th {
  background-color: #111214 !important;
  color: #b8c8d8 !important;
  border-color: #1e2235 !important;
}

/* --- Infoboxes / wikitables --- */
.infobox,
table.wikitable {
  background-color: #0d0f14 !important;
  border: 1px solid var(--pactoria-border-strong) !important;
  color: var(--pactoria-text) !important;
  font-family: 'EB Garamond', serif;
}

.infobox th,
table.wikitable th {
  background-color: #131828 !important;
  color: var(--pactoria-blue-light) !important;
  font-family: 'Cinzel', serif !important;
  font-size: 0.85em;
  letter-spacing: 0.06em;
  border-color: var(--pactoria-border-strong) !important;
}

.infobox td,
table.wikitable td {
  border-color: #1a1f2e !important;
  color: var(--pactoria-text) !important;
}

table.wikitable tr:nth-child(even) td {
  background-color: #0f1118 !important;
}

/* --- Search bar --- */
.citizen-search__input,
#searchInput {
  background-color: var(--pactoria-bg-raised) !important;
  border: 1px solid var(--pactoria-border-strong) !important;
  color: var(--pactoria-text) !important;
  font-family: 'EB Garamond', serif;
}

.citizen-search__input::placeholder { color: var(--pactoria-text-dim) !important; }

/* --- Blockquotes --- */
blockquote {
  border-left: 3px solid var(--pactoria-blue) !important;
  background-color: #0f1118 !important;
  padding: 0.6em 1em;
  color: var(--pactoria-text-muted) !important;
  font-style: italic;
  margin: 1em 0;
}

/* --- Code blocks --- */
pre, code {
  background-color: #0a0b0f !important;
  border: 1px solid var(--pactoria-border) !important;
  color: #7ab8d4 !important;
  font-size: 0.88em;
}

/* --- Horizontal rules --- */
hr {
  border: none;
  border-top: 1px solid var(--pactoria-border-strong);
}

/* --- TOC --- */
#toc,
.citizen-toc__list {
  background-color: #0f1118 !important;
  border: 1px solid var(--pactoria-border) !important;
}

.citizen-toc__item a,
#toc a {
  color: var(--pactoria-text-muted) !important;
}

.citizen-toc__item a:hover,
#toc a:hover {
  color: var(--pactoria-blue-light) !important;
}

/* --- Category links at bottom --- */
#catlinks {
  background-color: #0f1118 !important;
  border-top: 1px solid var(--pactoria-border) !important;
  color: var(--pactoria-text-muted) !important;
  font-family: 'EB Garamond', serif;
  font-size: 0.9em;
}