Implement enter scores page with per-field and round validation
Each player gets a number input; scores are validated individually (divisible by 5, ≤ 110) and as a round (must sum to −110). Submit stays disabled until all constraints pass. A running sum indicator turns green when the round is valid. Submitting appends the round to game state and persists it to localStorage. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -0,0 +1,40 @@
|
||||
.row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.75rem;
|
||||
margin-bottom: 0.75rem;
|
||||
}
|
||||
|
||||
.name {
|
||||
flex: 1;
|
||||
font-size: 1.1rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.scoreInput {
|
||||
width: 6rem;
|
||||
padding: 0.85rem 0.5rem;
|
||||
font-size: 1.1rem;
|
||||
font-family: inherit;
|
||||
text-align: center;
|
||||
border: 1.5px solid var(--color-parchment-border);
|
||||
border-radius: 0.75rem;
|
||||
background: #fdfaf4;
|
||||
}
|
||||
|
||||
.scoreInputError {
|
||||
border-color: #c0392b;
|
||||
background: #fff5f5;
|
||||
}
|
||||
|
||||
.sumLine {
|
||||
margin: 0.5rem 0 0;
|
||||
text-align: center;
|
||||
font-size: 0.95rem;
|
||||
color: var(--color-parchment-border);
|
||||
}
|
||||
|
||||
.sumValid {
|
||||
color: #4a9e6a;
|
||||
font-weight: 600;
|
||||
}
|
||||
Reference in New Issue
Block a user