/* hugo-notice switches on prefers-color-scheme and body.dark; hello-friend-ng stamps data-theme on , so the notices ignored the toggle entirely. */ html[data-theme="dark"] .notice { --title-color: #fff; --title-background-color: #069; --content-color: #ddd; --content-background-color: #023; } html[data-theme="dark"] .notice.info { --title-background-color: #a50; --content-background-color: #420; } html[data-theme="dark"] .notice.tip { --title-background-color: #363; --content-background-color: #121; } html[data-theme="dark"] .notice.warning { --title-background-color: #800; --content-background-color: #400; } /* White on the pastel title bars measured 1.66 to 2.89; these clear 4.5. */ html:not([data-theme="dark"]) .notice { --title-color: #fff; --title-background-color: #26719e; --content-color: #444; --content-background-color: #e7f2fa; } html:not([data-theme="dark"]) .notice.info { --title-background-color: #9c5c0a; --content-background-color: #fec; } html:not([data-theme="dark"]) .notice.tip { --title-background-color: #387238; --content-background-color: #efe; } html:not([data-theme="dark"]) .notice.warning { --title-background-color: #c33; --content-background-color: #fee; }