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 {
background: var(--surface-high);
border: 1px solid var(--border-subtle);
border-radius: var(--radius-sm);
width: 34px;
height: 34px;
background: none;
border: none;
display: flex;
align-items: center;
justify-content: center;
font-size: 16px;
padding: 4px;
cursor: pointer;
transition: background 0.15s, transform 0.1s;
transition: color 0.2s;
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); }
.main {
+6 -3
View File
@@ -21,21 +21,24 @@
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 {
display: flex;
align-items: center;
margin-bottom: 8px;
gap: 10px;
margin-bottom: 6px;
}
.badgeSlot {
flex: 1;
display: flex;
justify-content: center;
min-width: 0;
}
.badgeSpacer {
min-width: 60px; /* matches scoreBox width */
min-width: 60px; /* matches scoreBox min-width */
flex-shrink: 0;
}
.status {