Correzioni alla UI dopo la verifica sul terminale

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>
This commit is contained in:
2026-09-17 11:52:31 +02:00
parent 2a0054aa30
commit 811d8a86d8
6 changed files with 84 additions and 8 deletions
+11 -1
View File
@@ -14,6 +14,12 @@
padding: var(--space-md);
}
/* Su schermo stretto il form e' lungo: ogni pixel di padding e' una riga di
lavoro in meno visibile a colpo d'occhio. */
@media (max-width: 380px) {
.form-group { padding: var(--space-sm) var(--space-14); }
}
.form-group__label {
display: flex;
align-items: center;
@@ -317,7 +323,11 @@
}
.action-tile__icon--neutral { background-color: var(--neutral-surface); color: var(--neutral-ink); }
.action-tile__icon--primary { background-color: var(--danger-surface); color: var(--primary); }
/* Le azioni costruttive secondarie non portano l'accento: il corallo resta del
pulsante primario. Un fondo corallo tenue sarebbe comunque indistinguibile
dal tono danger, perche' il primario di SteUP e' gia' un rosso — ed e'
esattamente cosi' che "Nuova scheda" finiva identica a "Elimina ispezione". */
.action-tile__icon--primary { background-color: var(--info-surface); color: var(--info-ink); }
.action-tile__icon--success { background-color: var(--success-surface); color: var(--success-ink); }
.action-tile__icon--danger { background-color: var(--danger-surface); color: var(--danger-ink); }
.action-tile__icon--info { background-color: var(--info-surface); color: var(--info-ink); }