diff --git a/src/styles/global.css b/src/styles/global.css index f0ae713..50c3723 100644 --- a/src/styles/global.css +++ b/src/styles/global.css @@ -659,8 +659,13 @@ a:focus-visible, button:focus-visible { .account-dropdown { position: absolute; top: calc(100% + 0.6rem); - right: 0; - min-width: 180px; + /* Wie auf der Dogfather-Referenzseite (assets/css/main.css, .nav-dropdown): ECHT zentriert + unter dem auslösenden Knopf (left:50% + translateX(-50%)) statt rechtsbündig an dessen + Kante ausgerichtet — bleibt so auch bei unterschiedlich breiten Benutzernamen mittig. */ + left: 50%; + right: auto; + transform: translateX(-50%); + min-width: 190px; background: var(--c-anthracite-light); border: 1px solid rgba(244, 241, 247, 0.1); border-radius: var(--radius-m); @@ -677,22 +682,24 @@ a:focus-visible, button:focus-visible { display: flex; align-items: center; justify-content: center; - gap: 0.6em; + gap: 0.5em; width: 100%; text-align: center; background: none; border: none; color: var(--c-text); - padding: 0.6em 0.7em; + /* Etwas kompakter als vorher (Dogfather-Referenz: .55rem .7rem, .92rem Schrift) — wirkte bei + nur 2 Einträgen sonst unnötig groß/aufgebläht. */ + padding: 0.5em 0.65em; border-radius: var(--radius-s); - font-size: 0.9rem; + font-size: 0.88rem; cursor: pointer; transition: background 0.15s var(--ease); } /* Feste Icon-Spalte, statt das Emoji einfach vor den Text zu schreiben — sonst starten "Mein Konto" und "Abmelden" je nach Emoji-Breite an leicht unterschiedlichen Stellen und wirken unausgerichtet. Mit fixer Breite + zentriertem Icon stehen alle Labels exakt untereinander. */ -.account-dropdown-icon { flex-shrink: 0; width: 1.2em; text-align: center; } +.account-dropdown-icon { flex-shrink: 0; width: 1.1em; text-align: center; font-size: 0.95em; } .account-dropdown a:hover, .account-dropdown button:hover { background: color-mix(in srgb, var(--c-accent) 12%, transparent); } @media (max-width: 860px) {