Focus: refactor scss

[Fupete]

Esiste già una discussione sul tema che ti interessa, o su un tema simile?

• Ho verificato e non esiste

Versione della libreria

2.13.2

Cosa

Abbiamo di recente fatto diversi fix al file utilities/focus.scss per migliorare la gestione del focus e l'accessibilità, che dopo l'integrazione di Bootstrap nel framework era saltata in alcuni componenti come i Buttons. Ricordo che nella v2.12 è cambiato proprio tutto il focus, vedi: #1254

Contesto:

• stiamo cercando di centralizzare in utilities/focus.scss la gestione del focus di tutto il framework, per semplificarne l'approccio, andare verso l'idea di un unico focus coerente per qualunque situazione, ed aumentarne la manutenibilità. Qui gestiamo principalmente proprietà border, outline, outline-offset, box-shadow in modo da avere il nuovo focus bicolore, e alcune eccezioni dedicate ai singoli componenti;
• uso di !important in utitlities/focus.scss: diverse proprietà CSS sono forzate per garantire che abbiano la precedenza su altri stili specifici dei componenti. Questo approccio ci risolve a breve termine i problemi emersi con l'integrazione di Bootstrap dalla v2.13;
• ci sono poi ancora diversi stili di messa a fuoco per elementi e componenti sparsi nei diversi scss specifici, con alcune cose utili a livello di proprietà z-index, color (non gestite centralmente);
• ci sono mixin e classi dinamicamente applicate dedicati al focus e al focus via mouse (anche per escluderlo con :not). Come si diceva qui: feat: new focus state #1254 alcuni sono relativi ai colori dedicati dei buttons.

Questa issue per tracciare:

• che gli stili di messa a fuoco in focus.scss non siano sovrascritti da stili specifici dei componenti. Magari andando a rimuovere gli stili specifici che attualmente sovrascriviamo con !important;
• verificare la coerenza di approccio e finire di portare in focus.scss tutti gli stili di outline (ad es. in Tab ci sono ancora stili con !important necessari per la corretta visualizzazione);
• verificare che automatismi e mixin ancora servano o eliminarli, vedi anche feat: new focus state #1254.
• verificare cosa e se migliorare lato design tokens con il lavoro che sta facendo @zetareticoli per la futura v3.

Perché

Navigabile. Robusto.

Contesto

No response

Altro

No response