Module:WikiProject banner/styles.css/sandbox

/* .wpb-header gets unhidden in wpbs */ .wpb-header, .wpb-metadata, /* TODO: Is wpb-iefix still necessary in an IE11/Edge world? */ .wpb-iefix { display: none; }

/* CSS for previous design */ .wpb-header-name { text-align: right; padding: 0.3em 1em 0.3em 0.3em; width: 50%; font-weight: bold; }

.wpb-header-assessment { text-align: left; width: 50%; padding: 0.3em; }

/* CSS for redesign */ .wpb-header-combined { text-align: left; padding: 0.3em 0.3em 0.3em 0; font-weight: bold; }

.wpb-header-bubbles { border-radius: .5em; padding: 0 .3em; margin-left: 0.5em; white-space: nowrap; font-weight: normal; }

.wpb-nested-task-force { font-weight: normal; }

.wpb-header-icon { width: 50px; text-align: center; }

.wpb-category-box { background-color: #F5F5F5; border-width: 1px; width: 500px; }

.wpbs .wpb .wpb-main { background: #FFFAEF; padding: 3px 0 3px 0.7em; }

.wpb .wpb-main { padding: 3px 5px; }

.wpbs .wpb-header { background: #FFFAEF; }

.wpb-main > table { background: transparent; border: none; padding: 0; width: 100%; border-spacing: 0; }

.wpb .wpb-image { padding: 2px 0; }

.wpb-collapsed-head { text-align: left; padding: 0.2em 2px 0.2em 0; }

.wpb-collapsed-notes { padding: 0; }

.wpb-collapsed-notes > table { width: 100%; background: transparent; }

.wpb .wpb-gutter { padding: 2px 0 0 0; }

.wpbs .banner-shell-inner { background: #f8eaba; border: none; }

.wpb-table { table-layout: fixed; }

@media (min-width: 720px) { .wpb { min-width: 80%; } }

.assess { font-weight: bold; text-align: center; white-space: nowrap; }

html.skin-theme-clientpref-night .wpb-category-box { /* brightness flipped */ background-color: #0a0a0a; } html.skin-theme-clientpref-night .wpbs .wpb .wpb-main, html.skin-theme-clientpref-night .wpbs .wpb-header { /* same hue/saturation as light */ background-color: #302f2d; } html.skin-theme-clientpref-night .wpbs .banner-shell-inner { /* matching dark color from Module:Message box/tmbox.css */ background-color: #2e2505; } @media (prefers-color-scheme: dark) { html.skin-theme-clientpref-os .wpb-category-box { /* brightness flipped */ background-color: #0a0a0a; }	html.skin-theme-clientpref-os .wpbs .wpb .wpb-main, html.skin-theme-clientpref-os .wpbs .wpb-header { /* same hue/saturation as light */ background-color: #302f2d; }	html.skin-theme-clientpref-os .wpbs .banner-shell-inner { /* matching dark color from Module:Message box/tmbox.css */ background-color: #2e2505; } }