Fix score-card padding in responsive media query

This commit is contained in:
2026-04-09 17:42:14 -04:00
parent f866ce02cb
commit 8b50482621

View File

@@ -601,6 +601,43 @@ input[type="range"] {
margin: 0;
}
.setup-tabs {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 0.5rem;
padding: 0 1.5rem 1rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.setup-tab {
min-height: 3rem;
display: grid;
place-items: center;
gap: 0.15rem;
padding: 0.55rem;
border-radius: 0.85rem;
background: rgba(255, 255, 255, 0.04);
color: rgba(231, 238, 247, 0.78);
border: 1px solid rgba(255, 255, 255, 0.08);
}
.setup-tab--active {
background: rgba(255, 255, 255, 0.1);
color: #f4f7fb;
border-color: rgba(255, 255, 255, 0.16);
}
.setup-tab span:first-child {
font-size: 1rem;
}
.setup-tab span:last-child {
font-size: 0.78rem;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.06em;
}
.modal-body {
flex: 1;
overflow-y: auto;
@@ -659,6 +696,10 @@ input[type="range"] {
}
@media (max-width: 600px) {
.setup-tabs {
grid-template-columns: repeat(2, 1fr);
}
.setup-grid,
.setup-grid--2col,
.setup-grid--3col {
@@ -888,7 +929,7 @@ input[type="range"] {
}
.score-card {
padding: 0.5rem 0.75rem;
padding: 1rem 1.25rem;
}
.score-card__head h2 {