attilio/segnapunti
1
0
Fork 0
Code Issues 6 Pull Requests Actions Packages Projects Releases 1 Wiki Activity

Feat(cambi): supporto cambi multipli con UI migliorata

Browse Source 
Consente di effettuare fino a 2 cambi simultanei per squadra con una nuova
interfaccia utente più compatta e visuale. Gli input IN sono colorati di
verde, gli OUT di rosso, e una freccia indica la direzione del cambio.

La validazione permette cambi parziali (campi vuoti) ma richiede che ogni
cambio inserito sia completo (sia IN che OUT) e che almeno un cambio sia
presente per confermare
This commit is contained in:
davide3011
2026-01-29 11:08:25 +01:00
parent 9df74a760f
commit f190db2161
3 changed files with 128 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files

73
src/style.css
View File

@@ -191,27 +191,74 @@ button:focus-visible {
margin: 0;
}
.cambi-table {
width: 100%;
border-collapse: collapse;
.cambi-rows {
display: flex;
flex-direction: column;
gap: 12px;
padding: 8px 0;
}
.cambi-table th,
.cambi-table td {
padding: 8px;
.cambi-dialog {
padding: 8px 6px 2px;
}
.cambi-title {
text-align: center;
font-weight: 800;
letter-spacing: 0.5px;
margin-bottom: 8px;
padding-bottom: 6px;
border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}
.cambi-table th {
font-weight: bold;
.cambi-row {
display: flex;
align-items: center;
justify-content: center;
gap: 12px;
}
.cambi-table .row-label {
text-align: left;
font-weight: bold;
width: 90px;
.cambi-arrow {
font-weight: 700;
font-size: 18px;
line-height: 1;
padding: 6px 8px;
border-radius: 999px;
background: rgba(255, 255, 255, 0.08);
white-space: nowrap;
}
.cambi-input {
min-width: 110px;
min-width: 48px;
max-width: 64px;
}
.cambi-input input,
.cambi-input .w-input__input,
.cambi-input .w-input__field {
border: 2px solid rgba(255, 255, 255, 0.35);
border-radius: 8px;
padding: 6px 10px;
color: #000;
text-align: center;
box-sizing: border-box;
}
.cambi-in input,
.cambi-in .w-input__input,
.cambi-in .w-input__field {
background: rgba(120, 200, 120, 0.4);
}
.cambi-out input,
.cambi-out .w-input__input,
.cambi-out .w-input__field {
background: rgba(200, 120, 120, 0.4);
}
.cambi-input input:focus,
.cambi-input .w-input__input:focus,
.cambi-input .w-input__field:focus {
border-color: rgba(255, 255, 255, 0.7);
outline: none;
}