From 56f0b632de6a79bce23ee3c48c187a099e49c847 Mon Sep 17 00:00:00 2001 From: JiriUhlir <149317995+JiriUhlir@users.noreply.github.com> Date: Fri, 29 May 2026 11:42:46 +0200 Subject: [PATCH] navigace --- app/static/styles.css | 44 +++++++++++++++++++++++++++++------------ app/templates/layout.py | 4 ++-- 2 files changed, 33 insertions(+), 15 deletions(-) diff --git a/app/static/styles.css b/app/static/styles.css index 939aefe..f250b0a 100644 --- a/app/static/styles.css +++ b/app/static/styles.css @@ -47,7 +47,7 @@ header { nav { display: flex; align-items: center; - gap: 8px; + gap: 4px; flex-wrap: wrap; } @@ -74,12 +74,15 @@ nav { padding: 6px 8px; } -nav a { +nav a, +.nav-menu-button { color: white; text-decoration: none; font-weight: 600; - padding: 9px 12px; + padding: 10px 12px; border-radius: 8px; + font-size: 14px; + line-height: 1.2; } nav a:hover, @@ -92,19 +95,31 @@ nav a:hover, .nav-menu { position: relative; + padding-bottom: 10px; + margin-bottom: -10px; } .nav-menu-button { background: transparent; color: white; - padding: 9px 12px; + border: 1px solid rgba(255, 255, 255, 0.20); min-height: 0; + display: inline-flex; + align-items: center; + gap: 7px; +} + +.nav-menu-button::after { + content: "▾"; + font-size: 10px; + line-height: 1; + opacity: 0.82; } .nav-menu-panel { display: none; position: absolute; - top: calc(100% + 6px); + top: 100%; left: 0; z-index: 20; min-width: 180px; @@ -115,6 +130,15 @@ nav a:hover, box-shadow: 0 12px 28px rgba(10, 31, 42, 0.28); } +.nav-menu-panel::before { + content: ""; + position: absolute; + left: 0; + right: 0; + top: -10px; + height: 10px; +} + .nav-menu:hover .nav-menu-panel, .nav-menu:focus-within .nav-menu-panel { display: block; @@ -123,6 +147,7 @@ nav a:hover, .nav-menu-panel a { display: block; margin: 0; + padding: 10px 12px; white-space: nowrap; } @@ -304,16 +329,9 @@ button:hover, text-decoration: none; } -.nav-menu-button, .nav-menu-button:hover { - background: transparent; - color: white; - width: auto; -} - -.nav-menu:hover .nav-menu-button, -.nav-menu:focus-within .nav-menu-button { background: rgba(255, 255, 255, 0.12); + color: white; } .btn + .btn { diff --git a/app/templates/layout.py b/app/templates/layout.py index 38bdf09..1c44b0e 100644 --- a/app/templates/layout.py +++ b/app/templates/layout.py @@ -14,8 +14,8 @@ def page(title: str, body: str, user=None) -> str: display_name = html.escape(user.get("display_name") or user.get("username", "")) nav = """