Jump to content

MediaWiki:Common.css: Difference between revisions

From Sun Keeperverse Wiki
No edit summary
Headings now use smooth Verdana (no serif, no excessive bold). Body remains crisp Verdana 13pt. Light background, darker parchment info boxes remain unchanged. No more dark-mode flips or heavy title rendering.
 
(9 intermediate revisions by the same user not shown)
Line 1: Line 1:
/* CSS placed here will be applied to all skins */
/* ===== Sun Keeperverse — Bright canvas + darker parchment cards ===== */
/* Keeperverse wiki typography – UESP-inspired */


/* Force LIGHT palette */
:root {
  color-scheme: light !important;
  --color-base: #2b2414 !important;
  --color-link: #36c !important;
  --color-link-new: #d33 !important;
}
/* Bright page canvas */
html, body {
  background: #ffffff !important;
  color: #2b2414 !important;
}
/* Main containers: transparent so the page reads bright */
.vector-page,
.mw-page-container,
.mw-body,
.mw-content-container {
  background: transparent;
  border: none;
  box-shadow: none;
  border-radius: 0;
}
.mw-body-content,
.vector-body {
  max-width: 1100px;
  margin: 1.5rem auto;
  padding: 1.25rem 1.5rem;
}
/* Typography: Verdana 13pt */
body,
body,
.mw-body,
.mw-body-content,
#content {
.vector-body,
   font-family: Verdana, Geneva, sans-serif;
.mw-content-ltr,
   font-size: 14px;
.mw-parser-output {
   font-family: Verdana, Geneva, sans-serif !important;
   font-size: 13pt !important;
   line-height: 1.55;
   line-height: 1.55;
   color: #2b2414;
   color: #2b2414;
  background-color: #f8f5e9;
}
}


/* Headings slightly larger and darker for readability */
/* --- Headings: Verdana, not over-bold, smooth rendering --- */
h1, h2, h3, h4, h5, h6 {
.mw-page-title-main,
   font-family: Verdana, Geneva, sans-serif;
#firstHeading,
   font-weight: bold;
.mw-body h1,
   color: #1f190b;
.mw-body h2,
.mw-body h3,
.mw-body h4,
.mw-body h1 .mw-headline,
.mw-body h2 .mw-headline,
.mw-body h3 .mw-headline,
.mw-body h4 .mw-headline {
   font-family: Verdana, Geneva, sans-serif !important;
   font-weight: 400 !important;
  letter-spacing: 0.1px;
  line-height: 1.25;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
   color: #2b2414;
}
}


/* Links – warm blue for readability against parchment background */
/* Links: default blue, mossy-green hover, real redlinks */
a,
a,
a:visited {
a:visited {
   color: #003399;
   color: var(--color-link, #36c) !important;
}
}
a:hover {
a:hover {
   color: #0000cc;
   color: #547c4b !important;
  text-decoration: underline;
}
a.new,
a.new:visited {
  color: var(--color-link-new, #d33) !important;
}
a.new:hover {
  color: #b00000 !important;
   text-decoration: underline;
   text-decoration: underline;
}
}


/* Boxes, infoboxes, table backgrounds */
/* Section heading rules */
pre,
.mw-body h1,
code,
.mw-body h2 {
.infobox,
  border-bottom: 2px solid #d6c796;
.toc,
  padding-bottom: 0.45rem;
.navbox {
   margin-bottom: 0.6rem;
   background-color: #f3efdc;
   margin-top: 1.2em;
   border-color: #c6b480;
}
}


/* Center content, comfortable reading width */
/* Paragraphs, lists, content padding */
.mw-body-content {
.mw-body-content {
   max-width: 1080px;
   padding: 0.85rem 1.1rem;
   margin: 0 auto;
}
.mw-body-content p {
  margin: 0.9em 0;
}
.mw-body-content ul,
.mw-body-content ol {
   margin: 0.55em 0 0.85em 1.6em;
}
}


/* Ensure templates inherit */
/* Darker parchment cards (TOC, tables, info/nav boxes) */
.worldbox {
:root {
   font-family: inherit;
   --card-bg: #efe3c1;
  --card-border: #c9b172;
}
}


/* --- Keeperverse box styling: square book-like edges --- */
#toc,
 
.toc,
/* Remove rounding sitewide */
.wikitable,
.infobox,
.infobox,
.toc,
.navbox,
.navbox,
.metadata,
.worldbox,
.worldbox,
.mw-body-content table,
.worldnav {
.mw-ui-input,
  background: var(--card-bg);
.mw-ui-button,
  border: 1px solid var(--card-border);
.mw-ui-widget,
  border-radius: 0;
pre,
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
code {
}
   border-radius: 0 !important;
 
   box-shadow: none !important;
#toc,
   border-color: #c6b480;
.toc {
   padding: 0.5em 0.75em;
}
 
#toc .toctitle {
  color: #5b4a22;
}
 
#toc ul {
   margin-left: 1.2em;
}
 
.wikitable th,
.wikitable td {
   padding: 0.5em 0.75em;
}
}


/* Lightly emphasize borders like parchment frames */
.wikitable > tr > th,
.infobox,
.wikitable > * > tr > th {
.toc,
   background: #e6d7a8;
.navbox,
   border: 1px solid var(--card-border);
.worldbox {
   color: #2b2414;
   border-width: 1px;
   border-style: solid;
   background-color: #f8f5e9;
}
}


/* Citizen layout cards or Vector sections */
.wikitable > tr > td,
.mw-body,
.wikitable > * > tr > td {
#content {
   border: 1px solid #ddc996;
   background: #f8f5e9;
  border: none;
}
}


/* Optional: link underline offset for a more print-like feel */
/* Generic infobox/navbox layout on the right */
a {
.infobox,
   text-underline-offset: 2px;
.navbox,
.metadata,
.worldnav {
   float: right;
  clear: right;
  width: 340px;
  max-width: 42%;
  margin: 0 0 12px 18px;
  padding: 6px;
}
}


/* --- Default MediaWiki redlink colors --- */
@media (max-width: 900px) {
a.new,
  .infobox,
a.new:visited {
  .navbox,
  color: #ba0000 !important;
  .metadata,
  .worldnav {
    float: none;
    width: auto;
    max-width: 100%;
    margin: 8px auto;
  }
}
}
a.new:hover {
 
   color: #ff0000 !important;
/* Titlebar spacing */
  text-decoration: underline;
.vector-page-titlebar {
   padding: 6px 0;
}
}


/* --- Force default redlinks across skins (Citizen/Vector) --- */
/* Sidebar and footer stay neutral on bright canvas */
.mw-parser-output a.new,
.vector-feature-zebra-design-enabled .vector-sidebar-container {
.mw-parser-output a.new:visited,
   background: transparent;
.skin-citizen .mw-parser-output a.new,
.skin-citizen .mw-parser-output a.new:visited,
.skin-vector .mw-parser-output a.new,
.skin-vector .mw-parser-output a.new:visited,
a.mw-selflink.new {
   color: #ba0000 !important;
}
}


.mw-parser-output a.new:hover,
.mw-footer {
.skin-citizen .mw-parser-output a.new:hover,
  background: transparent;
.skin-vector .mw-parser-output a.new:hover {
  border-top: 1px solid #d6c796;
   color: #ff0000 !important;
   color: #6e5d33;
  text-decoration: underline;
}
}

Latest revision as of 07:51, 30 October 2025

/* ===== Sun Keeperverse — Bright canvas + darker parchment cards ===== */

/* Force LIGHT palette */
:root {
  color-scheme: light !important;
  --color-base: #2b2414 !important;
  --color-link: #36c !important;
  --color-link-new: #d33 !important;
}

/* Bright page canvas */
html, body {
  background: #ffffff !important;
  color: #2b2414 !important;
}

/* Main containers: transparent so the page reads bright */
.vector-page,
.mw-page-container,
.mw-body,
.mw-content-container {
  background: transparent;
  border: none;
  box-shadow: none;
  border-radius: 0;
}

.mw-body-content,
.vector-body {
  max-width: 1100px;
  margin: 1.5rem auto;
  padding: 1.25rem 1.5rem;
}

/* Typography: Verdana 13pt */
body,
.mw-body-content,
.vector-body,
.mw-content-ltr,
.mw-parser-output {
  font-family: Verdana, Geneva, sans-serif !important;
  font-size: 13pt !important;
  line-height: 1.55;
  color: #2b2414;
}

/* --- Headings: Verdana, not over-bold, smooth rendering --- */
.mw-page-title-main,
#firstHeading,
.mw-body h1,
.mw-body h2,
.mw-body h3,
.mw-body h4,
.mw-body h1 .mw-headline,
.mw-body h2 .mw-headline,
.mw-body h3 .mw-headline,
.mw-body h4 .mw-headline {
  font-family: Verdana, Geneva, sans-serif !important;
  font-weight: 400 !important;
  letter-spacing: 0.1px;
  line-height: 1.25;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: #2b2414;
}

/* Links: default blue, mossy-green hover, real redlinks */
a,
a:visited {
  color: var(--color-link, #36c) !important;
}
a:hover {
  color: #547c4b !important;
  text-decoration: underline;
}
a.new,
a.new:visited {
  color: var(--color-link-new, #d33) !important;
}
a.new:hover {
  color: #b00000 !important;
  text-decoration: underline;
}

/* Section heading rules */
.mw-body h1,
.mw-body h2 {
  border-bottom: 2px solid #d6c796;
  padding-bottom: 0.45rem;
  margin-bottom: 0.6rem;
  margin-top: 1.2em;
}

/* Paragraphs, lists, content padding */
.mw-body-content {
  padding: 0.85rem 1.1rem;
}
.mw-body-content p {
  margin: 0.9em 0;
}
.mw-body-content ul,
.mw-body-content ol {
  margin: 0.55em 0 0.85em 1.6em;
}

/* Darker parchment cards (TOC, tables, info/nav boxes) */
:root {
  --card-bg: #efe3c1;
  --card-border: #c9b172;
}

#toc,
.toc,
.wikitable,
.infobox,
.navbox,
.metadata,
.worldbox,
.worldnav {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 0;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

#toc,
.toc {
  padding: 0.5em 0.75em;
}

#toc .toctitle {
  color: #5b4a22;
}

#toc ul {
  margin-left: 1.2em;
}

.wikitable th,
.wikitable td {
  padding: 0.5em 0.75em;
}

.wikitable > tr > th,
.wikitable > * > tr > th {
  background: #e6d7a8;
  border: 1px solid var(--card-border);
  color: #2b2414;
}

.wikitable > tr > td,
.wikitable > * > tr > td {
  border: 1px solid #ddc996;
}

/* Generic infobox/navbox layout on the right */
.infobox,
.navbox,
.metadata,
.worldnav {
  float: right;
  clear: right;
  width: 340px;
  max-width: 42%;
  margin: 0 0 12px 18px;
  padding: 6px;
}

@media (max-width: 900px) {
  .infobox,
  .navbox,
  .metadata,
  .worldnav {
    float: none;
    width: auto;
    max-width: 100%;
    margin: 8px auto;
  }
}

/* Titlebar spacing */
.vector-page-titlebar {
  padding: 6px 0;
}

/* Sidebar and footer stay neutral on bright canvas */
.vector-feature-zebra-design-enabled .vector-sidebar-container {
  background: transparent;
}

.mw-footer {
  background: transparent;
  border-top: 1px solid #d6c796;
  color: #6e5d33;
}