2206
редагувань
MediaWiki:Common.css: відмінності між версіями
hero-block для сторінок країн (поки тільки Румунія, сірий фон як плейсхолдер)
Admin (обговорення | внесок) (видалити cities-infobox CSS блок) |
Admin (обговорення | внесок) (hero-block для сторінок країн (поки тільки Румунія, сірий фон як плейсхолдер)) |
||
| Рядок 241: | Рядок 241: | ||
/* Hide TOC header "Зміст сховати" in left sidebar */ | /* Hide TOC header "Зміст сховати" in left sidebar */ | ||
#mw-panel-toc .vector-toc-pinnable-header { display: none !important; } | #mw-panel-toc .vector-toc-pinnable-header { display: none !important; } | ||
/* ============================================================ | |||
Page hero — повноширинний блок з заголовком на сторінках країн | |||
============================================================ | |||
Селектор по конкретних body-класах page-XXX. При додаванні нової | |||
країни — допиши її селектор у :is(...) нижче. | |||
Поки що сірий фон. Щоб поставити зображення — заміни значення | |||
--page-hero-bg на url(...) (можна на конкретну країну). | |||
*/ | |||
:root { | |||
--page-hero-bg: #e8e8e8; | |||
--page-hero-fg: #1a2240; | |||
} | |||
body:is(.page-🇷🇴_Румунія) .mw-body { | |||
/* hero виходить за обмеження grid колонки titlebar — на всю ширину */ | |||
grid-template-columns: 1fr; | |||
grid-template-areas: | |||
"titlebar" | |||
"toolbar" | |||
"content"; | |||
} | |||
body:is(.page-🇷🇴_Румунія) .vector-page-titlebar { | |||
background: var(--page-hero-bg); | |||
background-size: cover; | |||
background-position: center; | |||
padding: 64px 32px; | |||
margin: -0.5em 0 24px; /* компенсація padding-top mw-body, відступ до контенту */ | |||
display: flex; | |||
align-items: center; | |||
justify-content: center; | |||
min-height: 220px; | |||
border-radius: 8px; | |||
} | |||
body:is(.page-🇷🇴_Румунія) .vector-page-titlebar .firstHeading { | |||
text-align: center; | |||
font-size: 40px; | |||
font-weight: 700; | |||
color: var(--page-hero-fg); | |||
margin: 0; | |||
border: none; | |||
padding: 0; | |||
word-wrap: break-word; | |||
line-height: 1.2; | |||
} | |||
/* Mobile: менший padding/шрифт */ | |||
@media screen and (max-width: 720px) { | |||
body:is(.page-🇷🇴_Румунія) .vector-page-titlebar { | |||
padding: 40px 16px; | |||
min-height: 140px; | |||
border-radius: 0; | |||
margin-left: -16px; | |||
margin-right: -16px; | |||
} | |||
body:is(.page-🇷🇴_Румунія) .vector-page-titlebar .firstHeading { | |||
font-size: 28px; | |||
} | |||
} | |||