fix(dashboard): Profil-Button an btn-icon-Stil angleichen

Nutzt dieselbe 36px-Höhe, Farben und Hover wie die übrigen Header-Buttons; auf Mobile nur Icon in Kreisform.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
2026-05-31 09:27:21 +02:00
co-authored by Cursor
parent 6ad75ff947
commit b72b20b66c
2 changed files with 12 additions and 24 deletions
+10 -22
View File
@@ -732,31 +732,14 @@ html.scheme-dark .themed-select-option.is-selected {
border: 1px solid rgba(239, 68, 68, 0.2); border: 1px solid rgba(239, 68, 68, 0.2);
} }
.skipper-badge { .skipper-badge.btn-icon {
display: flex; width: auto;
align-items: center; border-radius: 18px;
padding: 0 12px;
gap: 6px; gap: 6px;
font-size: 13px; font-size: 13px;
padding: 6px 12px; font-weight: 500;
border-radius: 20px;
background: rgba(148, 163, 184, 0.08);
border: 1px solid rgba(148, 163, 184, 0.18);
color: var(--app-text-muted);
cursor: pointer;
user-select: none; user-select: none;
font-family: inherit;
transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.skipper-badge:hover {
background: rgba(148, 163, 184, 0.14);
border-color: rgba(148, 163, 184, 0.28);
color: var(--app-text);
}
.skipper-badge:focus-visible {
outline: 2px solid var(--app-accent, #38bdf8);
outline-offset: 2px;
} }
.skipper-badge__name { .skipper-badge__name {
@@ -1912,6 +1895,11 @@ html.scheme-dark .themed-select-option.is-selected {
display: none; display: none;
} }
.skipper-badge.btn-icon {
width: 36px;
padding: 0;
}
.btn-back { .btn-back {
padding: 8px 10px; padding: 8px 10px;
flex-shrink: 0; flex-shrink: 0;
+2 -2
View File
@@ -212,12 +212,12 @@ export default function LogbookDashboard({ onSelectLogbook, onLogout, onOpenProf
{/* Skipper profile */} {/* Skipper profile */}
<button <button
type="button" type="button"
className="skipper-badge" className="btn-icon skipper-badge"
onClick={onOpenProfile} onClick={onOpenProfile}
title={t('dashboard.open_profile', { name: username })} title={t('dashboard.open_profile', { name: username })}
aria-label={t('dashboard.open_profile', { name: username })} aria-label={t('dashboard.open_profile', { name: username })}
> >
<User size={16} aria-hidden="true" /> <User size={18} aria-hidden="true" />
<span className="skipper-badge__name">{username}</span> <span className="skipper-badge__name">{username}</span>
</button> </button>