MediaWiki:Common.css: Difference between revisions
Content deleted Content added
Redesign Main Page with local search, topic directory and weekly featured destinations |
Improve Main Page browsing, article search, featured article links and independent-wiki information |
||
| (3 intermediate revisions by the same user not shown) | |||
Line 346:
.elite-video-gallery .embedvideo { box-sizing: border-box; }
.elite-video-gallery .embedvideo iframe { max-width: 100%; }
/* BEGIN Elite Main Page shell 20261101: scoped to the home page only. */
body.page-Main_Page.skin-vector-2022 .mw-body-header { display:none; }
Line 353 ⟶ 354:
/* END Elite Main Page shell 20261101 */
/* Vector suppresses its compact sticky header on the Main Page. Keep the actual site header visible. */
/* BEGIN Elite Main Page components 20261101 */▼
body.page-Main_Page.skin-vector-2022 .vector-header-container { position:sticky; top:0; z-index:100; }
body.page-Main_Page.skin-vector-2022 .vector-sticky-header { display:none!important; }
body.page-Main_Page.skin-vector-2022 .elite-home-v2 [id] { scroll-margin-top:5rem; }
body.page-Main_Page.skin-vector-2022 { height:auto; min-height:100vh; }
/* Main Page only. Theme-aware panels, local media and no client-side carousel. */
html body .mw-parser-output .elite-home-v2 { --ed-panel:var(--elite-panel,var(--elite-surface,#fff)); --ed-text:var(--elite-text,var(--elite-ink,#202122)); --ed-line:var(--elite-line,var(--elite-border,#a2a9b1)); --ed-accent:var(--elite-hud,var(--elite-accent,#a54400)); color:var(--ed-text); }
html body .mw-parser-output .elite-home-v2 * { box-sizing:border-box; }
html body .mw-parser-output .elite-home-v2 p { margin:0; }
html body .mw-parser-output .elite-home-v2 .ed-home-hero { padding:clamp(1.5rem,4vw,3rem); border-radius:5px; color:#f5f6f7!important; background:linear-gradient(100deg,rgba(6,12,20,.94),rgba(6,12,20,.4)),url('/w/images/wiki-theme/galaxy-1920.webp') center/cover!important; border:1px solid #46505a; border-top:3px solid #ff9d42; }
html body .mw-parser-output .elite-home-v2 .ed-home-hero h1 { margin:.35rem 0 .75rem; padding:0; border:0; color:#fff!important; background:transparent!important; font-size:clamp(2rem,4vw,3.5rem); line-height:1.1; font-weight:700; }
html body .mw-parser-output .elite-home-v2 .ed-kicker { font-size:.73rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--ed-accent)!important; }
html body .mw-parser-output .elite-home-v2 .ed-home-hero .ed-kicker { color:#ffb16b!important; background:transparent!important; }
html body .mw-parser-output .elite-home-v2 .ed-home-lead { max-width:42em; color:#e0e5eb!important; background:transparent!important; line-height:1.6; }
html body .mw-parser-output .elite-home-v2 .ed-home-search { margin:1.4rem 0 1rem; max-width:43rem; background:transparent!important; }
html body .mw-parser-output .elite-home-v2 .ed-home-search .mw-inputbox-centered { text-align:left; }
html body .mw-parser-output .elite-home-v2 .ed-home-search form { display:flex; align-items:stretch; flex-wrap:wrap; gap:.5rem; margin:0; background:transparent!important; }
html body .mw-parser-output .elite-home-v2 .ed-home-search .mw-inputbox-input { width:100%; min-width:0; margin:0; }
html body .mw-parser-output .elite-home-v2 .ed-home-search input[type="text"] { flex:1 1 20rem; width:auto!important; min-width:0; border:1px solid #97a4b2; border-radius:3px; padding:.8rem 1rem; background:#111820!important; color:#fff!important; font-size:1rem; }
html body .mw-parser-output .elite-home-v2 .ed-home-search input::placeholder { color:#b8c4d1; opacity:1; }
html body .mw-parser-output .elite-home-v2 .ed-home-search input[type="submit"] { padding:.8rem 1.15rem; border:1px solid #ffb66f; border-radius:3px; background:#ff9d42!important; color:#17120e!important; font-size:1rem; font-weight:700; cursor:pointer; }
html body .mw-parser-output .elite-home-v2 .ed-quick { display:flex; flex-wrap:wrap; gap:.4rem .75rem; align-items:center; font-size:.9rem; background:transparent!important; }
html body .mw-parser-output .elite-home-v2 .ed-quick a { color:#ffbc80!important; background:transparent!important; text-decoration:underline; text-underline-offset:3px; }
html body .mw-parser-output .elite-home-v2 .ed-quick span { color:#8494a4!important; background:transparent!important; }
html body .mw-parser-output .elite-home-v2 .ed-section-heading { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:baseline; gap:.4rem 1rem; margin:2rem 0 .9rem; }
html body .mw-parser-output .elite-home-v2 .ed-section-heading h2 { margin:0; padding:0; border:0; font-size:1.8rem; color:var(--ed-text)!important; }
html body .mw-parser-output .elite-home-v2 .ed-section-heading p { font-size:.9rem; color:var(--ed-text)!important; }
html body .mw-parser-output .elite-home-v2 .ed-featured-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
html body .mw-parser-output .elite-home-v2 .ed-feature-card { min-width:0; overflow:hidden; border:1px solid var(--ed-line); border-radius:4px; background:var(--ed-panel)!important; }
html body .mw-parser-output .elite-home-v2 .ed-feature-image { aspect-ratio:16/9; overflow:hidden; background:#070c13!important; }
html body .mw-parser-output .elite-home-v2 .ed-feature-image span, html body .mw-parser-output .elite-home-v2 .ed-feature-image a { display:block; width:100%; height:100%; }
html body .mw-parser-output .elite-home-v2 .ed-feature-image img { display:block; width:100%; height:100%; max-width:100%; object-fit:cover; }
html body .mw-parser-output .elite-home-v2 .ed-feature-copy { padding:1.15rem; border-top:2px solid var(--ed-accent); }
html body .mw-parser-output .elite-home-v2 .ed-feature-copy h3 { margin:.35rem 0 .5rem; font-size:1.65rem; line-height:1.15; }
html body .mw-parser-output .elite-home-v2 .ed-feature-copy h3 a { color:var(--ed-text)!important; }
html body .mw-parser-output .elite-home-v2 .ed-feature-copy>p:not(.ed-kicker) { min-height:4.6em; font-size:.92rem; line-height:1.55; color:var(--ed-text)!important; }
html body .mw-parser-output .elite-home-v2 .ed-read { display:block; margin-top:1rem; font-size:.9rem; font-weight:600; }
html body .mw-parser-output .elite-home-v2 .ed-read a { color:var(--ed-accent)!important; }
html body .mw-parser-output .elite-home-v2 .ed-directory { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border-top:1px solid var(--ed-line); border-left:1px solid var(--ed-line); }
html body .mw-parser-output .elite-home-v2 .ed-topic { position:relative; min-width:0; padding:1.3rem; border-right:1px solid var(--ed-line); border-bottom:1px solid var(--ed-line); background:var(--ed-panel)!important; }
html body .mw-parser-output .elite-home-v2 .ed-topic-number { font-size:.7rem; font-family:monospace; color:var(--ed-accent)!important; }
html body .mw-parser-output .elite-home-v2 .ed-topic h3 { margin:.2rem 0 .5rem; font-size:1.45rem; color:var(--ed-text)!important; }
html body .mw-parser-output .elite-home-v2 .ed-topic p { font-size:.9rem; line-height:1.5; color:var(--ed-text)!important; }
html body .mw-parser-output .elite-home-v2 .ed-topic-links { display:flex; flex-wrap:wrap; gap:.45rem .8rem; margin-top:.85rem; }
html body .mw-parser-output .elite-home-v2 .ed-topic-links a { font-size:.9rem; text-decoration:underline; text-underline-offset:3px; }
html body .mw-parser-output .elite-home-v2 .ed-bottom-grid { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; margin-top:1.75rem; }
html body .mw-parser-output .elite-home-v2 .ed-bottom-grid>div { padding:1.4rem; background:var(--ed-panel)!important; border-left:3px solid var(--ed-accent); }
html body .mw-parser-output .elite-home-v2 .ed-bottom-grid h2 { padding:0; border:0; font-size:1.6rem; margin:.4rem 0 .7rem; color:var(--ed-text)!important; }
html body .mw-parser-output .elite-home-v2 .ed-bottom-grid p { line-height:1.6; color:var(--ed-text)!important; }
html body .mw-parser-output .elite-home-v2 .ed-bottom-grid .ed-kicker { color:var(--ed-accent)!important; }
html body .mw-parser-output .elite-home-v2 .ed-bottom-links { display:flex; flex-wrap:wrap; gap:.55rem .9rem; margin-top:1rem; font-size:.9rem; }
html body .mw-parser-output .elite-home-v2 a:focus-visible, html body .mw-parser-output .elite-home-v2 input:focus-visible { outline:2px solid var(--ed-accent); outline-offset:4px; }
@media (max-width:900px) { html body .mw-parser-output .elite-home-v2 .ed-directory { grid-template-columns:repeat(2,minmax(0,1fr)); } html body .mw-parser-output .elite-home-v2 .ed-featured-grid { gap:.65rem; } html body .mw-parser-output .elite-home-v2 .ed-feature-copy { padding:.9rem; } }
@media (max-width:600px) { html body .mw-parser-output .elite-home-v2 .ed-featured-grid, html body .mw-parser-output .elite-home-v2 .ed-directory, html body .mw-parser-output .elite-home-v2 .ed-bottom-grid { grid-template-columns:1fr; } html body .mw-parser-output .elite-home-v2 .ed-feature-copy>p:not(.ed-kicker) { min-height:0; } html body .mw-parser-output .elite-home-v2 .ed-home-hero { padding:1.25rem; } html body .mw-parser-output .elite-home-v2 .ed-home-search form { flex-direction:column; } html body .mw-parser-output .elite-home-v2 .ed-home-search input[type="text"] { flex:auto; width:100%!important; } html body .mw-parser-output .elite-home-v2 .ed-quick span { display:none; } html body .mw-parser-output .elite-home-v2 .ed-quick { gap:.65rem 1rem; } html body .mw-parser-output .elite-home-v2 .ed-section-heading { margin-top:1.5rem; } }
@media print { html body .mw-parser-output .elite-home-v2 .ed-home-hero { background:#fff!important; color:#000!important; } html body .mw-parser-output .elite-home-v2 .ed-home-hero h1,html body .mw-parser-output .elite-home-v2 .ed-home-lead { color:#000!important; } html body .mw-parser-output .elite-home-v2 .ed-home-search { display:none; } }
@media (forced-colors:active) { html body .mw-parser-output .elite-home-v2 .ed-home-hero, html body .mw-parser-output .elite-home-v2 .ed-home-search input { background:Canvas!important; color:CanvasText!important; } html body .mw-parser-output .elite-home-v2 .ed-home-hero h1,html body .mw-parser-output .elite-home-v2 .ed-home-lead,html body .mw-parser-output .elite-home-v2 .ed-home-hero a { color:CanvasText!important; } }
/* InputBox uses Codex wrappers; size its wrapper as well as its input. */
html body .mw-parser-output .elite-home-v2 .ed-home-search .cdx-text-input { flex:1 1 20rem; min-width:0; }
html body .mw-parser-output .elite-home-v2 .ed-home-search input[name="search"] { width:100%!important; min-width:0; padding:.8rem 1rem; background:#111820!important; color:#fff!important; border:1px solid #97a4b2!important; border-radius:3px; font-size:1rem; }
html body .mw-parser-output .elite-home-v2 .mw-heading { border:0!important; padding:0; }
@media(max-width:600px) { html body .mw-parser-output .elite-home-v2 .ed-home-search .cdx-text-input { flex:0 1 auto; width:100%; } }
/* Main Page revision: concise directory and recognisable navigation buttons. */
html body .mw-parser-output .elite-home-v2 .ed-home-hero { padding:1.6rem 2rem; }
html body .mw-parser-output .elite-home-v2 .ed-home-hero h1 { font-size:clamp(1.8rem,3vw,2.5rem); }
html body .mw-parser-output .elite-home-v2 .ed-home-search input[name="search"], html body .mw-parser-output .elite-home-v2 .ed-home-search input[type="submit"] { box-sizing:border-box!important; height:2.75rem!important; min-height:2.75rem!important; max-height:2.75rem!important; padding:.6rem .9rem!important; line-height:1.2!important; margin:0!important; }
html body .mw-parser-output .elite-home-v2 .ed-quick { margin-top:1rem; gap:.55rem; }
html body .mw-parser-output .elite-home-v2 .ed-quick a, html body .mw-parser-output .elite-home-v2 .ed-bottom-links a { display:inline-flex; align-items:center; justify-content:center; min-height:2.5rem; padding:.45rem .85rem; border:1px solid #ffb16b!important; border-radius:3px; background:#ff9d42!important; color:#17120e!important; text-decoration:none; font-weight:600; }
html body .mw-parser-output .elite-home-v2 .ed-topic-links a { display:inline-flex; align-items:center; padding:.35rem .65rem; min-height:2.25rem; border:1px solid var(--ed-line); border-radius:3px; background:var(--ed-panel)!important; text-decoration:none; }
html body .mw-parser-output .elite-home-v2 .ed-topic-links a:hover { border-color:var(--ed-accent); text-decoration:underline; }
html body .mw-parser-output .elite-home-v2 .ed-topic h3 { margin:0 0 .6rem; }
html body .mw-parser-output .elite-home-v2 .ed-topic-links { margin:0; }
html body .mw-parser-output .elite-home-v2 .ed-feature-copy>p:not(.ed-kicker) { min-height:3.1em; }
@media(max-width:600px) { html body .mw-parser-output .elite-home-v2 .ed-home-hero { padding:1.25rem; } html body .mw-parser-output .elite-home-v2 .ed-feature-copy>p:not(.ed-kicker) { min-height:0; } }
/* Reader improvements: restrained controls, local subject images and compact facts. */
html body .mw-parser-output .elite-home-v2 .ed-home-intro {color:#e0e5eb!important;line-height:1.6;background:transparent!important;}
html body .mw-parser-output .elite-home-v2 .ed-home-stats {display:flex;flex-wrap:wrap;gap:.35rem .65rem;margin-top:1.2rem;font-size:.85rem;color:#b8c4d1!important;}
html body .mw-parser-output .elite-home-v2 .ed-home-stats a {color:#d9e2ed!important;text-decoration:underline;text-underline-offset:3px;}
html body .mw-parser-output .elite-home-v2 .ed-topic-heading {display:flex;align-items:center;gap:.8rem;margin-bottom:1rem;}
html body .mw-parser-output .elite-home-v2 .ed-topic-heading h3 {margin:0;font-size:1.25rem;}
html body .mw-parser-output .elite-home-v2 .ed-topic-image {display:flex;align-items:center;justify-content:center;width:64px;height:54px;flex:0 0 64px;overflow:hidden;}
html body .mw-parser-output .elite-home-v2 .ed-topic-image img {max-width:64px;max-height:54px;width:auto;height:auto;object-fit:contain;}
html body .mw-parser-output .elite-home-v2 .ed-bottom-links a {background:var(--ed-panel)!important;color:var(--ed-text)!important;border-color:var(--ed-line)!important;font-weight:500;}
html body .mw-parser-output .elite-home-v2 .ed-bottom-links a:hover {border-color:var(--ed-accent)!important;text-decoration:underline;}
html body .mw-parser-output .elite-home-v2 .ed-new-players {padding:1rem 0;border-bottom:1px solid var(--ed-line);}
html body .mw-parser-output .elite-home-v2 .ed-new-players h2 {margin:0;font-size:1.2rem;border:0;}
html body .mw-parser-output .elite-home-v2 .ed-new-players .ed-bottom-links {margin-top:.65rem;}
html body .mw-parser-output .elite-home-v2 .ed-feature-facts {display:grid;grid-template-columns:auto 1fr;gap:.3rem .8rem;margin:1rem 0 0;font-size:.85rem;line-height:1.4;}
html body .mw-parser-output .elite-home-v2 .ed-feature-facts dt {font-weight:500;opacity:.75;}
html body .mw-parser-output .elite-home-v2 .ed-feature-facts dd {margin:0;}
html body .mw-parser-output .elite-home-v2 .ed-feature-footer {display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:.5rem;margin-top:1rem;}
html body .mw-parser-output .elite-home-v2 .ed-feature-footer .ed-read {margin:0;}
html body .mw-parser-output .elite-home-v2 .ed-image-credit {font-size:.75rem;}
html body .mw-parser-output .elite-home-v2 .ed-bottom-grid>div {border-left:0;border-top:1px solid var(--ed-line);}
html body .mw-parser-output .elite-home-v2 .ed-stats-note {font-size:.85rem;margin-top:.75rem;}
body.page-Main_Page .ed-home-suggestions {z-index:110;background:var(--elite-panel,var(--elite-surface,#fff));color:var(--elite-text,var(--elite-ink,#202122));border:1px solid var(--elite-line,var(--elite-border,#a2a9b1));border-radius:3px;box-shadow:0 6px 16px #0004;}
body.page-Main_Page .ed-home-suggestions .suggestions-results {border:0;background:transparent;}
body.page-Main_Page .ed-home-suggestions .suggestions-result {padding:.65rem .9rem;color:var(--elite-text,var(--elite-ink,#202122));background:transparent;}
body.page-Main_Page .ed-home-suggestions .suggestions-result-current {background:var(--elite-accent-bg,#eaf3ff);}
body.page-Main_Page .ed-home-suggestions a {color:inherit;}
@media print { html body .mw-parser-output .elite-home-v2 .ed-home-intro,html body .mw-parser-output .elite-home-v2 .ed-home-stats a {color:#000!important;} }
/* END Elite Main Page
| |||