From edde8b6927b3271ab435c789c79dbe508df57f7f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?J=C3=B8rn=20A=CC=8Ane?= Date: Tue, 13 Feb 2018 18:17:41 +0100 Subject: [PATCH] Prevent strange jumping when opening menu, and add hover effects --- www/css/style.css | 20 ++++++++++++++++++-- 1 file changed, 18 insertions(+), 2 deletions(-) diff --git a/www/css/style.css b/www/css/style.css index 36589b7..89813ce 100644 --- a/www/css/style.css +++ b/www/css/style.css @@ -22,10 +22,10 @@ h1, h2, h3, h4, h5, h6, li, a.btn, p.login{ } nav, #menu { - background: #024; padding: 0; } nav { + background: #024; position: absolute; width: 100%; top: 0; @@ -106,6 +106,7 @@ nav #usermenu:target { nav #menu li.active { top: -3em; /* -3em for absolute, 0 for fixed.. huh? */ left: 0; + background: transparent; } nav { @@ -124,15 +125,29 @@ nav #usermenu:target { right: 0; padding: 0; } + nav #menu:target { + top: 0; + padding-top: 3em; + } nav #menu li, nav #menu li a { margin-left: 0; display: block; } - nav #menu, nav #menu li.active a { + nav #menu li a { padding-left: 1em; } nav #menu li { display: none; + background: #024; + } + nav #menu li:hover { + background: #1a3957; + } + nav #menu li.active:hover { + background: transparent; + } + nav #menu:target li.active:hover { + background: rgba(255,255,255,.1); } nav #menu:target li, nav #menu li.active { display: block; @@ -146,6 +161,7 @@ nav #usermenu:target { } nav #menu:target li.active { right: 0; + top: 0; } nav #menu_toggle { text-align: center;