MediaWiki:Common.css: Difference between revisions
Appearance
Created page with "→Region toggle pills (mimics EarthMC boxes): .region-pills { margin: .35em 0 .6em 0; display: inline-flex; gap: .4em; flex-wrap: wrap; } .region-pill { display: inline-block; padding: .15em .45em; border: 1px solid #ddd; box-shadow: 0 2px 3px #666; background: #fff; font-size: 1.2em; line-height: 1.4; cursor: pointer; user-select: none; } .region-pill.active { background: #000; color: #fff; border-color: #ddd; } →Head strip look: .nav-bloc..." |
No edit summary |
||
(One intermediate revision by the same user not shown) | |||
Line 1: | Line 1: | ||
/* Region toggle pills (mimics | /* Region toggle pills (mimics boxes) */ | ||
.region-pills { margin: .35em 0 .6em 0; display: inline-flex; gap: .4em; flex-wrap: wrap; } | .region-pills { margin: .35em 0 .6em 0; display: inline-flex; gap: .4em; flex-wrap: wrap; } | ||
.region-pill { | .region-pill { | ||
Line 24: | Line 24: | ||
background:#000; padding:.2em .4em; color:#FFF; border:1px solid #DDD; box-shadow:#666 0 2px 3px; font-size:1.5em; | background:#000; padding:.2em .4em; color:#FFF; border:1px solid #DDD; box-shadow:#666 0 2px 3px; font-size:1.5em; | ||
} | } | ||
.oc-grid { | |||
display: grid; | |||
grid-template-columns: minmax(360px, 1fr) minmax(280px, 420px); | |||
gap: 16px; | |||
align-items: start; | |||
} | |||
@media (max-width: 980px) { | |||
.oc-grid { | |||
grid-template-columns: 1fr; | |||
} | |||
} | |||
.oc-left .nav-block, | |||
.oc-right .nav-block { | |||
background: #fff; | |||
border: 1px solid #ddd; | |||
box-shadow: 0 2px 3px rgba(0,0,0,.2); | |||
} | |||
.nav-title { | |||
font-weight: 700; | |||
font-size: 1.25em; | |||
padding: .4em .6em; | |||
border-bottom: 1px solid #eee; | |||
} | |||
.hero-tagline { padding: .4em .6em; color:#444; } | |||
.region-pills { display:flex; flex-wrap:wrap; gap:.5em; margin:.6em 0; } | |||
.region-pill { background:#eee; padding:.25em .5em; border-radius:.6em; cursor:pointer; } | |||
.region-pill.active { background:#dce6ff; font-weight:700; } |
Latest revision as of 18:37, 19 September 2025
/* Region toggle pills (mimics boxes) */ .region-pills { margin: .35em 0 .6em 0; display: inline-flex; gap: .4em; flex-wrap: wrap; } .region-pill { display: inline-block; padding: .15em .45em; border: 1px solid #ddd; box-shadow: 0 2px 3px #666; background: #fff; font-size: 1.2em; line-height: 1.4; cursor: pointer; user-select: none; } .region-pill.active { background: #000; color: #fff; border-color: #ddd; } /* Head strip look */ .nav-block { background:#F0F0F0; margin:6px; padding:.2em .4em; border:1px solid #DDD; box-shadow:#666 0 2px 3px; } .nav-title { background:#000; padding:.2em .4em; color:#FFF; border:1px solid #DDD; box-shadow:#666 0 2px 3px; font-size:1.5em; } .oc-grid { display: grid; grid-template-columns: minmax(360px, 1fr) minmax(280px, 420px); gap: 16px; align-items: start; } @media (max-width: 980px) { .oc-grid { grid-template-columns: 1fr; } } .oc-left .nav-block, .oc-right .nav-block { background: #fff; border: 1px solid #ddd; box-shadow: 0 2px 3px rgba(0,0,0,.2); } .nav-title { font-weight: 700; font-size: 1.25em; padding: .4em .6em; border-bottom: 1px solid #eee; } .hero-tagline { padding: .4em .6em; color:#444; } .region-pills { display:flex; flex-wrap:wrap; gap:.5em; margin:.6em 0; } .region-pill { background:#eee; padding:.25em .5em; border-radius:.6em; cursor:pointer; } .region-pill.active { background:#dce6ff; font-weight:700; }