MediaWiki:Common.css: Unterschied zwischen den Versionen
Admin (Diskussion | Beiträge) Keine Bearbeitungszusammenfassung |
Admin (Diskussion | Beiträge) Keine Bearbeitungszusammenfassung |
||
| Zeile 328: | Zeile 328: | ||
} | } | ||
} | } | ||
/* Layout Helpers */ | |||
.grid { display: grid; gap: 1rem; } | |||
.grid-2 { grid-template-columns: 1fr; } | |||
@media (min-width: 900px) { .grid-2 { grid-template-columns: 1.2fr 0.8fr; } } | |||
.col { display: flex; flex-direction: column; gap: 1rem; } | |||
.card { | |||
background: #fff; | |||
border: 1px solid #e6e6e6; | |||
border-radius: 14px; | |||
padding: 1rem 1.2rem; | |||
box-shadow: 0 1px 3px rgba(0,0,0,.04); | |||
} | |||
.card > h2 { margin-top: 0; } | |||
/* Hero */ | |||
.hero { background: linear-gradient(180deg,#f6f6f6,#ffffff); border: 1px solid #eee; border-radius: 16px; } | |||
.hero-content { padding: 1.2rem 1.4rem; text-align: center; } | |||
.hero h1 { margin: .2rem 0; font-size: 2rem; } | |||
.hero-actions a { | |||
display: inline-block; margin: .25rem; padding: .4rem .7rem; border: 1px solid #ddd; | |||
border-radius: 999px; text-decoration: none; background: #fff; | |||
} | |||
.hero-actions a:hover { background: #f5f5f5; } | |||
/* Lists & Pills */ | |||
.list.compact .news-item { display: flex; gap: .6rem; padding: .25rem 0; border-bottom: 1px dashed #eee; } | |||
.list.compact .news-item:last-child { border-bottom: 0; } | |||
.news-item .date { font-variant-numeric: tabular-nums; color:#666; min-width: 7ch; } | |||
.pill-list a { | |||
display:inline-block; margin:.25rem; padding:.35rem .7rem; border:1px solid #ddd; border-radius:999px; text-decoration:none; | |||
} | |||
.pill-list a:hover { background:#f8f8f8; } | |||
/* Whisky cards */ | |||
.whisky-card { display: grid; grid-template-columns: 140px 1fr; gap: .9rem; align-items: start; } | |||
.whisky-card .whisky-media img { border-radius: 10px; } | |||
.whisky-card h3 { margin:.2rem 0; } | |||
.whisky-card .meta { color:#666; font-size:.95rem; } | |||
.whisky-card .note { margin:.4rem 0 0; } | |||
.whisky-mini { display: block; padding:.35rem 0; } | |||
.whisky-mini .dim { color:#666; } | |||
/* Teaser grid (3 columns on wide) */ | |||
.teaser-grid { display:grid; grid-template-columns:1fr; gap:.25rem; } | |||
@media (min-width: 700px){ .teaser-grid { grid-template-columns:1fr 1fr 1fr; } } | |||
/* Recent changes block */ | |||
.recent-changes { max-height: 360px; overflow:auto; border:1px solid #eee; border-radius:10px; padding:.5rem; background:#fafafa; } | |||
/* Simple star rating (rendered via JS) */ | |||
.rating { --stars: 0; position: relative; display:inline-block; font-size: 1.1rem; line-height: 1; } | |||
.rating::before { content: "★★★★★"; letter-spacing: .1rem; color:#ddd; } | |||
.rating::after { content: "★★★★★"; letter-spacing: .1rem; color:#f5b50a; position:absolute; left:0; top:0; width: calc(var(--stars) * 20%); overflow:hidden; } | |||
/* Typo tweaks */ | |||
h2, h3 { scroll-margin-top: 80px; } | |||