From 8452aad2f804f726b4fcf152b63e3028f88bd2bb Mon Sep 17 00:00:00 2001 From: Holger Weiss Date: Thu, 2 Feb 2023 17:25:56 +0100 Subject: Fix dark theme background color of menu on mobile With the dark theme on small displayes, use a dark background for the menu as well. diff --git a/web/input/resources/plugins.css b/web/input/resources/plugins.css index 70d0ec1..ab6198d 100644 --- a/web/input/resources/plugins.css +++ b/web/input/resources/plugins.css @@ -280,6 +280,26 @@ img.travis { } /* + * Dark scheme. + */ + +@media (prefers-color-scheme: dark) { + /* + * Loosely based on: + * + * https://material.io/archive/guidelines/style/color.html#color-themes + */ + body { + color: #eee; + background-color: #212121; + } + + h1, h2, h3, h4, h5, h6 { + color: #eee; + } +} + +/* * On narrow displays, replace the menu bar with a simple list of items, and * omit the GitHub ribbon. */ @@ -287,7 +307,7 @@ img.travis { @media (max-width: 45em) { div#menu { padding: 1em; - background-color: #fff; + background-color: inherit; border-bottom: 1px dotted #696969; } @@ -298,7 +318,7 @@ img.travis { div#menu span#current { color: #5a95c7; - background-color: #fff; + background-color: inherit; } div#menu a { @@ -311,22 +331,3 @@ img.travis { display: none; } } - -/* - * Dark scheme. - */ -@media (prefers-color-scheme: dark) { - /* - * Loosely based on: - * - * https://material.io/archive/guidelines/style/color.html#color-themes - */ - body { - color: #eee; - background-color: #212121; - } - - h1, h2, h3, h4, h5, h6 { - color: #eee; - } -} -- cgit v0.10-9-g596f