From b0d1cee5f5ad9011086585391b437d1423689c2a Mon Sep 17 00:00:00 2001 From: Florian Heinz Date: Sun, 12 Apr 2026 17:56:39 +0200 Subject: [PATCH] fix desktop header rows for nouri --- nouri/static/css/styles.css | 49 ++++++++++++++++++++---- nouri/templates/base.html | 76 ++++++++++++++++++++----------------- 2 files changed, 83 insertions(+), 42 deletions(-) diff --git a/nouri/static/css/styles.css b/nouri/static/css/styles.css index b88cf32..227156a 100644 --- a/nouri/static/css/styles.css +++ b/nouri/static/css/styles.css @@ -165,10 +165,9 @@ button.secondary:hover, .site-header { position: static; z-index: 10; - display: flex; - flex-wrap: wrap; + display: grid; gap: 1rem; - align-items: center; + align-items: stretch; padding: 1rem 1.2rem; margin-bottom: 1.15rem; background: var(--bg-elevated); @@ -178,6 +177,11 @@ button.secondary:hover, backdrop-filter: blur(26px) saturate(1.18); } +.desktop-header-main, +.desktop-header-sub { + min-width: 0; +} + .brand { display: inline-flex; align-items: center; @@ -224,7 +228,6 @@ h3, flex-wrap: wrap; gap: 0.45rem; justify-content: flex-start; - flex: 1 1 32rem; min-width: 0; } @@ -252,10 +255,39 @@ h3, align-items: center; gap: 0.75rem; justify-content: flex-end; - margin-left: auto; flex-wrap: wrap; } +@media (min-width: 1081px) { + .site-header { + grid-template-columns: 1fr; + row-gap: 0.9rem; + } + + .desktop-header-main { + display: grid; + grid-template-columns: auto minmax(0, 1fr); + align-items: center; + gap: 1.4rem; + } + + .desktop-header-sub { + display: flex; + justify-content: flex-start; + } + + .desktop-nav { + width: 100%; + justify-content: flex-start; + } + + .desktop-actions { + width: 100%; + justify-content: flex-start; + align-self: center; + } +} + .user-chip, .mobile-profile-link { display: inline-flex; @@ -1295,7 +1327,6 @@ legend { } @media (max-width: 1080px) { - .site-header, .hero, .page-intro, .panel-head, @@ -1310,11 +1341,15 @@ legend { .site-header { position: static; - grid-template-columns: 1fr auto; width: 100%; margin: 0 0 1.15rem; } + .desktop-header-main, + .desktop-header-sub { + display: contents; + } + .stats-grid, .two-column, .template-library-grid, diff --git a/nouri/templates/base.html b/nouri/templates/base.html index c6475e3..bb16246 100644 --- a/nouri/templates/base.html +++ b/nouri/templates/base.html @@ -24,43 +24,49 @@
- - - - - - Nouri - einfach essen planen - - +
+ + + + + + Nouri + einfach essen planen + + + + {% if g.user %} + + {% endif %} +
{% if g.user %} - - -
- - Optionen - - {{ g.user.display_name or g.user.username }} - {{ role_labels[g.user.role] }} - - {% if g.user.role == 'admin' %} - Nutzer - {% endif %} -
- {{ csrf_input() }} - -
+
+
+ + Optionen + + {{ g.user.display_name or g.user.username }} + {{ role_labels[g.user.role] }} + + {% if g.user.role == 'admin' %} + Nutzer + {% endif %} +
+ {{ csrf_input() }} + +
+