MediaWiki:Common.css: Difference between revisions
Tag: Undo |
No edit summary |
||
| Line 123: | Line 123: | ||
} | } | ||
/* Typography inside cards */ | |||
.bc-card h2 { | .bc-card h2 { | ||
margin: 0 0 10px 0; | margin: 0 0 10px 0; | ||
| Line 181: | Line 182: | ||
font-size: 12px; | font-size: 12px; | ||
color: #555; | color: #555; | ||
} | |||
/* ============================================================ | |||
Section color accents (subtle, modern) | |||
============================================================ */ | |||
.bc-card[class*="bc-accent-"] { | |||
background-clip: padding-box; | |||
} | |||
/* ACI – Blue */ | |||
.bc-accent-aci { | |||
border-left: 6px solid #2563eb; | |||
background: linear-gradient( | |||
90deg, | |||
rgba(37, 99, 235, 0.04), | |||
rgba(255,255,255,0) 35% | |||
); | |||
} | |||
/* ACE – Red */ | |||
.bc-accent-ace { | |||
border-left: 6px solid #dc2626; | |||
background: linear-gradient( | |||
90deg, | |||
rgba(220, 38, 38, 0.04), | |||
rgba(255,255,255,0) 35% | |||
); | |||
} | |||
/* In-Bond – Purple */ | |||
.bc-accent-ib { | |||
border-left: 6px solid #7c3aed; | |||
background: linear-gradient( | |||
90deg, | |||
rgba(124, 58, 237, 0.04), | |||
rgba(255,255,255,0) 35% | |||
); | |||
} | |||
/* Onboarding – Amber */ | |||
.bc-accent-onboard { | |||
border-left: 6px solid #f59e0b; | |||
background: linear-gradient( | |||
90deg, | |||
rgba(245, 158, 11, 0.05), | |||
rgba(255,255,255,0) 35% | |||
); | |||
} | |||
/* Reference – Slate */ | |||
.bc-accent-ref { | |||
border-left: 6px solid #334155; | |||
background: linear-gradient( | |||
90deg, | |||
rgba(51, 65, 85, 0.035), | |||
rgba(255,255,255,0) 35% | |||
); | |||
} | |||
/* Soft / General – Teal */ | |||
.bc-accent-soft { | |||
border-left: 6px solid #0f766e; | |||
background: linear-gradient( | |||
90deg, | |||
rgba(15, 118, 110, 0.04), | |||
rgba(255,255,255,0) 35% | |||
); | |||
} | } | ||
/* ============================================================ | /* ============================================================ | ||
HEADER — LARGE LOGO, TIGHT HEIGHT, BODY-ALIGNED | HEADER — LARGE LOGO, TIGHT HEIGHT, BODY-ALIGNED | ||
============================================================ */ | ============================================================ */ | ||
| Line 201: | Line 269: | ||
} | } | ||
/* Keep header bar | /* Keep header bar normal flow */ | ||
.vector-header { | .vector-header { | ||
background: #fff; | |||
padding-left: var(--padding-inline-page-container, 16px) !important; | padding-left: var(--padding-inline-page-container, 16px) !important; | ||
padding-right: var(--padding-inline-page-container, 16px) !important; | padding-right: var(--padding-inline-page-container, 16px) !important; | ||
| Line 208: | Line 277: | ||
} | } | ||
/* Constrain header content to | /* Constrain header content to same width as layout */ | ||
.vector-header-container { | .vector-header-container { | ||
max-width: var(--width-layout) !important; | max-width: var(--width-layout) !important; | ||
| Line 239: | Line 308: | ||
} | } | ||
/* Large logo | /* Large logo */ | ||
.mw-logo img { | .mw-logo img { | ||
height: 135px !important; | height: 135px !important; | ||
| Line 260: | Line 329: | ||
background-color: #171a1d; | background-color: #171a1d; | ||
border-color: #3a3a3a; | border-color: #3a3a3a; | ||
} | |||
html.skin-theme-clientpref-night .bc-card[class*="bc-accent-"] { | |||
background: linear-gradient( | |||
90deg, | |||
rgba(255,255,255,0.04), | |||
rgba(0,0,0,0) 35% | |||
); | |||
} | } | ||