MediaWiki:Common.css: Difference between revisions
Content deleted Content added
No edit summary |
No edit summary |
||
Line 1,326:
/* =================================================================
12. EDITORIAL DESIGN SYSTEM
Appended LAST deliberately: later rules of equal specificity win,
so this section restyles typography / color / spacing WITHOUT
Line 1,332:
color variables from here — a later :root wins). Delete the whole
section to revert.
v6: Minerva (mobile) gets the paper canvas + serif voice, the
text/infobox axis is hardened against any infobox markup, tables
drop to two line tones, AI assistant panel joins the theme.
================================================================= */
Line 1,371 ⟶ 1,372:
--ed-faint: #807973; /* page refs, list markers, footer body */
--ed-hairline: #e7e2db; /* light warm line (infobox frame) */
--ed-hairline-strong: #d6d0c8; /* stronger warm line (
--ed-link: #0d7680; /* interactive teal (FT's link color) */
--ed-underline: #ccc1b7; /* resting link underline tint */
Line 1,387 ⟶ 1,388:
--wt-border: #ece8e1;
--wt-rule: #b3aca3;
--wt-edge: var(--
--wt-th-bg: #f3efe8;
--wt-th-text: var(--ed-secondary);
Line 1,403 ⟶ 1,404:
background-color: transparent !important;
}
/* Minerva (mobile skin) paints its own white wrappers over body */
#mw-mf-page-center, .mw-body { background-color: var(--ed-paper) !important; }
.vector-sticky-pinned-container::after {
background: linear-gradient(transparent, var(--ed-paper)) !important;
Line 1,420 ⟶ 1,423:
@media (min-width: 1680px) { .mw-logo { margin-left: calc(15.5rem + 24px); } }
/* ── Prose voice: serif, warm ink
its wrapper is #bodyContent.content) ── */
.mw-body-content
.skin-minerva #bodyContent.content {
font-family: var(--ed-serif);
font-size: var(--ed-body);
Line 1,433 ⟶ 1,438:
.mw-parser-output > ol,
.mw-parser-output > dl { max-width: var(--ed-measure); }
/* nested paragraphs too (hand-written page structures); table cells released */
.mw-parser-output p { max-width: var(--ed-measure); }
.mw-parser-output table p { max-width: none; }
/* guards: the data voice stays sans at the ONE small size — otherwise the
serif body size would silently scale section 11's 0.85em tables (and
Line 1,511 ⟶ 1,519:
/* page-reference superscripts — present everywhere, must whisper.
line-height:0 stops them inflating the line box */
.mw-body-content sup
.skin-minerva .content sup {
font-size: 68%;
line-height: 0;
Line 1,547 ⟶ 1,556:
/* ── Section headings: sans semibold on the house rules. Scoped to
.mw-body-content — Vector's own typography rules are
class-qualified (0,1,1), so bare h2/h3 selectors would LOSE.
.mw-body-content h2, .mw-body-content .mw-heading2, .section-heading,
.skin-minerva .content h2 {
font-family: var(--ed-sans);
font-size: 1.4rem;
Line 1,560 ⟶ 1,571:
padding-bottom: 0.3em;
}
.mw-body-content h3
.skin-minerva .content h3 {
font-family: var(--ed-sans);
font-size: 1.08rem;
Line 1,633 ⟶ 1,645:
/* ── Infobox: the page's ONE white card, in the data voice; its width
is the SAME token the prose measure subtracts, ENFORCED with
!important so inline widths
.mw-parser-output .infobox { /* class-generic: any infobox markup */
box-sizing: border-box;▼
}
.mw-parser-output table.infobox {
font-family: var(--ed-sans);
font-size: var(--ed-small);
▲ width: var(--ed-infobox-w) !important; /* SAME token as the measure; !important
▲ box-sizing: border-box;
background-color: #fff !important;
border: 1px solid var(--ed-hairline) !important;
Line 1,690 ⟶ 1,702:
#footer a, #footer a:visited,
.mw-footer a, .mw-footer a:visited { color: var(--ed-secondary) !important; }
/* ── AI assistant panel on the theme: warm card, serif answers,
teal send button (later !important wins the ties vs section 8) ── */
.ext-aiassistant-panel { border: 1px solid var(--ed-hairline-strong) !important; }
.ext-aiassistant-header { border-bottom: 1px solid var(--ed-hairline) !important; }
.ext-aiassistant-message-user .ext-aiassistant-message__content {
background-color: var(--ed-ink) !important;
}
.ext-aiassistant-message-assistant {
font-family: var(--ed-serif) !important;
color: var(--ed-ink) !important;
}
.ext-aiassistant-footer {
border-top: 1px solid var(--ed-hairline) !important;
background-color: var(--ed-paper) !important;
}
.ext-aiassistant-prompt-composer:focus-within .ext-aiassistant-prompt-composer__input,
.ext-aiassistant-prompt-composer__input:focus { border-color: var(--ed-ink) !important; }
.ext-aiassistant-prompt-composer__send:not(:disabled) {
background-color: var(--ed-link) !important;
border-color: var(--ed-link) !important;
}
.ext-aiassistant-prompt-composer__send:disabled {
background-color: var(--ed-hairline) !important;
border-color: var(--ed-hairline) !important;
}
.ext-aiassistant-panel .cdx-button--weight-quiet:not(.cdx-button--icon-only)::before {
color: var(--ed-link) !important;
}
/* ── Mobile ── */
@media screen and (max-width: 768px) {
:root { --ed-measure: 100%; } /* infobox is full-width on mobile */
.mw-parser-output
h1#firstHeading, .mw-first-heading { font-size: 1.7rem; }
.mw-body-content h2, .mw-body-content .mw-heading2 { font-size: 1.22rem; }
.ext-aiassistant-prompt-composer { border-bottom: 1px solid var(--ed-hairline) !important; }
}
| |||