From a2c3c3eab07c2cc4e08454f2cb021ff827125e73 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Pascal=20Eng=C3=A9libert?= Date: Fri, 26 May 2023 19:02:48 +0200 Subject: [PATCH] Phone menu: fix color theme, a11y, correctness --- sass/css/header.scss | 23 ++++++++++++++--------- templates/base.html | 36 ++++++++++++++++++------------------ 2 files changed, 32 insertions(+), 27 deletions(-) diff --git a/sass/css/header.scss b/sass/css/header.scss index 3dfc6d7..652675e 100644 --- a/sass/css/header.scss +++ b/sass/css/header.scss @@ -37,10 +37,20 @@ header { text-decoration: none; } +@media (prefers-color-scheme: light) { + .header-menu-phone { + background-color: white; + } +} + @media (prefers-color-scheme: dark) { #header-menu a { color: white; } + + .header-menu-phone { + background-color: black; + } } @media (min-width: 768px) { @@ -50,7 +60,7 @@ header { } @media (max-width: 767px) { - .menu-phone { + .header-menu-phone { position: absolute; top: 0; left: 0; @@ -58,10 +68,9 @@ header { flex-direction: column; gap: 1em; padding: 2em; - background-color: white; } - .hidden-phone { + .phone-hidden { display: none; } } @@ -76,14 +85,10 @@ header { opacity: 65%; } -.hamburger-menu:hover { +.hamburger-menu:hover, .hamburger-menu:focus { opacity: 100%; - } -summary { +.hamburger-menu > summary { list-style: none; - } - - diff --git a/templates/base.html b/templates/base.html index 4e5d7d5..7ffebeb 100644 --- a/templates/base.html +++ b/templates/base.html @@ -28,7 +28,7 @@

Librezo

{% block body %}{% endblock body %}