/* =========================================================================== * Page ground. * * The app never declared a background or a colour scheme anywhere. That is * invisible on a light desktop and wrong everywhere else: a browser in dark * mode picks its own canvas, so pages whose own background is transparent — * /people among them — rendered near-black behind dark body text, and the * headings on them could not be read at all. * * Declared on rather than body, and as plain element selectors, so any * page or client theme that deliberately paints its own background (the * corporate dashboards are dark by design) still wins on specificity. This only * supplies the ground that was missing. * * color-scheme also fixes what the browser renders itself: form controls, * scrollbars and spellcheck underlines, none of which the stylesheets touch. * =========================================================================== */ :root { color-scheme: light; } html { background-color: #ffffff; } /* --------------------------------------------------------------------------- * Height of any full-width banner pinned under the site header — the overdue * subscription bar is the one that exists today. * * Zero unless a banner declares otherwise, so this costs nothing on the pages * that never show one. Anything pinned below the header adds it, which is what * keeps a sticky element out from under the bar. * * A banner must set it, once: document.documentElement.style * .setProperty('--shr-banner-h', banner.offsetHeight + 'px'); * ------------------------------------------------------------------------- */ :root { --shr-banner-h: 0px; }