Quasi tutto il testo dell'app stava fra 600 e 800: etichette, valori, indirizzi,
conteggi, voci di elenco. Un grassetto ovunque non segnala niente, e la pagina
Profilo era il caso peggiore — ogni riga gridava come un titolo.
La scala ora ha quattro gradini, documentati nei token:
400 corpo, metadati, valori descrittivi
500 etichette di campo, voci di lista, testo dei controlli
600 stati brevi (badge, voce attiva), nomi in una riga di elenco
700 titoli, uno solo per blocco
Sopra il 700 non si sale: l'800 dei titoli di card e dell'avatar e' sceso a 700.
Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
MudDialogProvider aveva NoHeader="true" come valore predefinito di tutti i
dialog. MudMessageBox rende il proprio titolo nella testata, quindi quel
valore lo sopprimeva ovunque: davanti a "Elimina" si leggeva solo il testo
delle conseguenze, senza la domanda.
Le schermate a tutto schermo (form scheda, scelta punto vendita, scelta
articoli) chiedono gia' NoHeader per conto loro nelle DialogOptions, quindi
toglierlo dal provider non le tocca.
I titoli ora dicono cosa sta per succedere invece del generico "Attenzione!":
"Eliminare la scheda?", "Uscire dall'account?", "Inviare le schede del
reparto?".
Le scelte in fondo al dialog si dispongono a destra e, sotto i 380 punti,
diventano una colonna a piena larghezza: con etichette lunghe come "Salva come
bozza" i bersagli non si comprimono.
Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Prime correzioni fatte guardando l'app su un Honeywell EDA52 (720x1440
@320dpi, cioe' 360 punti logici di larghezza) invece che a occhio.
- Barra di stato: era tinta di corallo da colorPrimaryDark, cioe' l'accento
usato come decorazione della cornice di sistema. Ora si fonde con lo
sfondo dell'app, con icone scure (WindowInsetsController).
- Gradino compatto sotto i 380px: la scala di STILE_UI e' tarata su telefoni
piu' larghi, e a misura piena i titoli si troncavano e in una schermata
entrava pochissimo lavoro. Le proporzioni restano, cambia la taglia.
Sui telefoni normali non cambia nulla.
- Icone delle azioni costruttive: usavano il fondo del tono danger, quindi
"Nuova scheda" e "Aggiungi una foto" erano identiche a "Elimina
ispezione". Ora usano il tono info. Un --primary-surface non risolveva:
il primario di SteUP e' gia' un rosso, quindi un suo fondo tenue resta
indistinguibile da quello danger.
- Testata: il titolo puo' andare su due righe prima di troncare. Il nome del
punto vendita e' l'ancora del compito, "D11-PRIMO PREZ..." non aiuta.
- Schermata ispezione: il nome del punto vendita non e' piu' ripetuto nel
pannello di riepilogo, dove era gia' in testata.
- Padding dei gruppi di form e della barra azioni ridotti su schermo stretto.
Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Adotta lo stile condiviso delle app Integry: superfici piatte, raggi ampi,
spaziature a scala fissa, gerarchia data dallo spazio prima che dalla
decorazione. La palette storica di SteUP resta intatta; sono stati aggiunti
solo i ruoli che mancavano (workspace, surfaceMuted, divider, inkMuted e le
triplette dei toni semantici).
Fondamenta
- tokens.css: ruoli colore, scale di spazio/raggi/tipografia, curve di
movimento e scala z-index semantica. Unica fonte di verita': pilotano
anche le variabili CSS di MudBlazor.
- Inter variabile ospitata in locale (133KB) al posto di Nunito da Google
Fonts: l'app lavora offline, un font che arriva dalla rete in campo non
arriva.
- base.css: shell applicativa e comportamenti da app nativa — niente
selezione testo, niente menu al tocco lungo, niente lampo grigio sul tap,
niente rimbalzo elastico, niente zoom a doppio tocco, scroll con inerzia.
- mudblazor-overrides.css: MudBlazor appiattito (elevation 0, nessun tint,
target 44/48, etichette in caso naturale).
- Rimossi Bootstrap (CSS, icone e JS) e i 996 righe di CSS con ambito per
componente del vecchio sistema: erano tutti inutilizzati.
Struttura
- Navigazione flottante in basso con icona piena sulla voce attiva; da 720px
diventa colonna laterale. Il MudFabMenu e' sostituito da un bottom sheet:
stessa funzione, bersagli molto piu' grandi.
- Testata alta col titolo a sinistra, fusa con la pagina.
- Nel form scheda il salvataggio sta in una barra ancorata in fondo, non in
coda a uno scroll lungo.
- Scelta di punto vendita e articoli a schermo intero con ricerca; la
selezione multipla usa righe da 56px invece di un menu a tendina.
- Urgenza scelta a pillole invece che da una select.
Stato e riscontro
- StatusBadgeHelper: tono, icona ed etichetta di ogni stato in un punto solo,
cosi' lo stesso stato si presenta identico ovunque.
- Scheletri al posto degli spinner; l'overlay bloccante dice sempre cosa sta
facendo; gli stati vuoti suggeriscono la mossa successiva.
- Rimosso il ritardo artificiale di 250ms in InspectionCard, che non
attendeva nulla.
DESIGN.md riscritto sul nuovo sistema.
Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Ispezione:
- Stato sync visibile: badge per-scheda (Da inviare/Inviato) e contatore
"N da inviare" per reparto (nuovo SchedaSyncHelper)
- Completamento: progresso reale nell'overlay + spunta di successo;
NON completa se una scheda fallisce (resta editabile, schede "Da inviare")
- Export reparto/completamento blindati: conferma + guardia anti doppio-tap,
try/finally che libera sempre l'overlay
- Accento corallo unico per l'azione "invia"; target di tocco >=44px;
empty state; solo il primo pannello espanso di default
- Tasto "Invia" nascosto sulle schede gia inviate
- Messaggio d'errore comprensibile in campo (dettaglio tecnico nei log)
- Fix OnSchedaModified (index >= 0)
Aspetto card:
- SchedaCard e InspectionCard: superficie Carta + hairline border + ombra
morbida (nuovo token --card-box-shadow); pagina con tinta Grigio Campo
- SchedaCard compattata
Form scheda (ModalFormScheda):
- Tasto Salva/Aggiorna full-width
- Fix "Suggerisci note descrittive": la nota selezionata ora viene inserita
nel campo (metodo async sul thread UI + OnAfterChangeValue)
StatusEnum: etichette in sentence-case
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>