mwf975_git/tippspiel
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: card polish — badge spacing, no separator line, wider tip row

Browse Source 
- Badges: more margin below (10px), better text centering (line-height:1)
- Removed border-top separator between flags and tip area
- Tipped row: full width to align with flag edges
- Reduced card padding for compactness

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Ronny
2026-04-12 14:53:34 +02:00
parent a7485da0e9
commit 07f6a8ae13
1 changed files with 12 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/components/MatchCard.module.css
+12 -6
View File
@@ -1,7 +1,7 @@
/* MatchCard — Stadium Elite Style */ /* MatchCard — Stadium Elite Style */
.card { .card {
padding: 20px 24px; padding: 16px 20px;
transition: box-shadow 0.2s, transform 0.15s; transition: box-shadow 0.2s, transform 0.15s;
cursor: default; cursor: default;
} }
@@ -26,7 +26,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
gap: 10px; gap: 10px;
margin-bottom: 6px; margin-bottom: 10px;
} }
.badgeSlot { .badgeSlot {
@@ -91,10 +91,13 @@
.countdownBadge { .countdownBadge {
font-size: 11px; font-size: 11px;
font-weight: 700; font-weight: 700;
padding: 3px 9px; padding: 4px 10px;
border-radius: 20px; border-radius: 20px;
background: var(--surface-high); background: var(--surface-high);
color: var(--text-secondary); color: var(--text-secondary);
line-height: 1;
display: inline-flex;
align-items: center;
} }
.countdownUrgent { .countdownUrgent {
@@ -109,9 +112,12 @@
font-weight: 600; font-weight: 600;
color: var(--primary); color: var(--primary);
background: var(--primary-dim); background: var(--primary-dim);
padding: 3px 9px; padding: 4px 10px;
border-radius: 20px; border-radius: 20px;
border: 1px solid rgba(75,183,248,0.15); border: 1px solid rgba(75,183,248,0.15);
line-height: 1;
display: inline-flex;
align-items: center;
} }
/* LED time between flags */ /* LED time between flags */
@@ -234,8 +240,7 @@
/* Tipp area */ /* Tipp area */
.tipRow { .tipRow {
border-top: 1px solid var(--border-subtle); padding-top: 8px;
padding-top: 14px;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
@@ -413,6 +418,7 @@
padding: 10px 14px; padding: 10px 14px;
cursor: pointer; cursor: pointer;
transition: background 0.2s; transition: background 0.2s;
width: 100%;
} }
.tippedRow:hover { .tippedRow:hover {
background: rgba(52, 211, 153, 0.14); background: rgba(52, 211, 153, 0.14);