MediaWiki:Common.css: Difference between revisions

Jump to navigation Jump to search
Undo revision 21157 by Tom (talk)
(try drilldown to left)
Tag: Reverted
(Undo revision 21157 by Tom (talk))
Tag: Undo
Line 1,118: Line 1,118:


/* </source> */
/* </source> */
/* === TEMP TEST: Force Cargo Drilldown left-sidebar layout ===
  Use this to override Cargo's styles; refine selectors after inspecting
*/
body.special-SpecialDrilldown .filters,              /* common filter class */
body.special-SpecialDrilldown .drilldown-filters,    /* possible variant */
body.special-SpecialDrilldown [class*="filter"] {    /* broad match for testing */
    flex: 0 0 300px;
    max-width: 360px;
    background: #f8f9fa;
    padding: 15px;
    border-inline-end: 1px solid var(--mw-border-color-base, #a2a9b1);
    border-radius: 4px;
    order: 1;  /* left side */
}
body.special-SpecialDrilldown .results,              /* common results class */
body.special-SpecialDrilldown .drilldown-results,    /* possible variant */
body.special-SpecialDrilldown [class*="result"] {
    flex: 1 1 auto;
    min-width: 0;
    order: 2;  /* right side */
}
body.special-SpecialDrilldown [class*="drilldown-container"],
body.special-SpecialDrilldown .cargo-drilldown,
body.special-SpecialDrilldown .drilldown {            /* main container variants */
    display: flex !important;
    flex-direction: row;
    gap: 20px;
    margin: 20px 0;
}
/* Desktop sticky etc. – scoped to Special:Drilldown */
@media (min-width: 48em) {
    body.special-SpecialDrilldown .filters,
    body.special-SpecialDrilldown .drilldown-filters {
        position: sticky !important;
        top: 1em;
        align-self: flex-start;
        max-height: calc(100vh - 2em);
        overflow-y: auto;
    }
}
/* Mobile stack */
@media (max-width: 47.999em) {
    body.special-SpecialDrilldown [class*="drilldown-container"],
    body.special-SpecialDrilldown .cargo-drilldown,
    body.special-SpecialDrilldown .drilldown {
        flex-direction: column !important;
    }
    body.special-SpecialDrilldown .results,
    body.special-SpecialDrilldown .drilldown-results {
        order: 1 !important;
    }
    body.special-SpecialDrilldown .filters,
    body.special-SpecialDrilldown .drilldown-filters {
        order: 2 !important;
        max-width: none;
        flex: 1 1 auto;
        border-inline-end: 0;
        border-block-end: 1px solid var(--mw-border-color-base, #a2a9b1);
    }
}

Navigation menu