style: fix badge centering over flags, plain theme toggle icon

- badgeRow now uses same gap (10px) as matchRow for exact alignment
- Theme toggle: removed button box, plain icon like admin gear
- Both icons use text-secondary color, consistent style

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Ronny
2026-04-12 14:29:52 +02:00
parent d44927ec23
commit d1189d5d6e
2 changed files with 12 additions and 12 deletions
+6 -9
View File
@@ -74,21 +74,18 @@
} }
.themeToggle { .themeToggle {
background: var(--surface-high); background: none;
border: 1px solid var(--border-subtle); border: none;
border-radius: var(--radius-sm);
width: 34px;
height: 34px;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
font-size: 16px; padding: 4px;
cursor: pointer; cursor: pointer;
transition: background 0.15s, transform 0.1s; transition: color 0.2s;
flex-shrink: 0; flex-shrink: 0;
color: var(--gold); color: var(--text-secondary);
} }
.themeToggle:hover { background: var(--primary-dim); } .themeToggle:hover { color: var(--text-primary); }
.themeToggle:active { transform: scale(0.92); } .themeToggle:active { transform: scale(0.92); }
.main { .main {
+6 -3
View File
@@ -21,21 +21,24 @@
inset 0 1px 0 rgba(255,255,255,0.07) !important; inset 0 1px 0 rgba(255,255,255,0.07) !important;
} }
/* Badge row — same flex proportions as matchRow so badges align over flags */ /* Badge row — mirrors matchRow layout for centered alignment */
.badgeRow { .badgeRow {
display: flex; display: flex;
align-items: center; align-items: center;
margin-bottom: 8px; gap: 10px;
margin-bottom: 6px;
} }
.badgeSlot { .badgeSlot {
flex: 1; flex: 1;
display: flex; display: flex;
justify-content: center; justify-content: center;
min-width: 0;
} }
.badgeSpacer { .badgeSpacer {
min-width: 60px; /* matches scoreBox width */ min-width: 60px; /* matches scoreBox min-width */
flex-shrink: 0;
} }
.status { .status {