Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Visualizzazione link (inline-block) #168

Open
enrimk opened this issue Aug 2, 2024 · 4 comments
Open

Visualizzazione link (inline-block) #168

enrimk opened this issue Aug 2, 2024 · 4 comments
Labels
bug Something isn't working wontfix This will not be worked on

Comments

@enrimk
Copy link

enrimk commented Aug 2, 2024

Follow-up da italia/design-comuni-wordpress-theme#314

Su tutti i tag <a> viene applicato indiscriminatamente display: inline-block.
In molti casi questo impedisce il corretto layout.

Ad esempio, negli elenchi puntati, come rilevato in #314.

Un altro caso, altrettanto comune, è quello di normali link in un qualunque testo di pagina, che siano però lunghi più di una riga o che comunque vadano a capo.

In questa condizione tutti i link, in qualunque zona del sito, si comportano come "box" rettangolari: formano un riquadro a parte, circondato dal testo (in modo simile a come il browser tratta le immagini).

Verosimilmente non è questo il comportamento voluto.
[ NB: La regola css in questione è stata aggiunta allo stylesheet di reset. ]

image

@enrimk
Copy link
Author

enrimk commented Aug 2, 2024

Lo scopo dell'aggiunta della regola, stando al messaggio di commit, è per correggere qualcosa nella linea di contorno degli stati :focus dei link.
In effetti, togliendola, si vede che i link con focus hanno un contorno irregolare.
Tuttavia, questo si è reso necessario soprattutto perché in Bootstrap Italia si è scelto di simulare l'outline con un box-shadow.
Alla luce di un supporto dei browser per gli elementi di accessibilità che è sicuramente migliorato nel frattempo, andrebbe forse rivisto e aggiustato il ricorso a questi stratagemmi (compreso il polyfill :not(.focus--mouse) per simulare :focus-visible).

Ora:

errata-visualizzazione-link-modello-comuni_3

<a> inline:

errata-visualizzazione-link-modello-comuni_4

Normale outline (:focus), senza shadow:

errata-visualizzazione-link-modello-comuni__focus--outline

:focus-visible in browser moderni (Chrome):

errata-visualizzazione-link-modello-comuni__focus-visible

In ogni caso, forse non è poi appropriato che una regola con uno scopo così specifico, e soprattutto non indipendente ma in dipendenza da scelte fatte in altri stylesheet, stia proprio nello stylesheet di reset, che di solito viene usato per cose fondamentali come costituire una base di partenza e uniformare i browser.

@zetareticoli zetareticoli added the bug Something isn't working label Aug 2, 2024
@zetareticoli
Copy link
Member

Metto in priorità alta.

Copy link

stale bot commented Oct 2, 2024

Questo problema è stato automaticamente contrassegnato come non aggiornato perché non ha avuto attività recentemente. Sarà chiuso se non si verificano ulteriori attività. Considerate inoltre l'aggiornamento alle ultime versioni del tema. Grazie.

@stale stale bot added the wontfix This will not be worked on label Oct 2, 2024
@enrimk
Copy link
Author

enrimk commented Oct 2, 2024

Suggerirei, per arginare Stalebot in una funzione più utile:

diff --git a/.github/stale.yml b/.github/stale.yml
--- .github/stale.yml
+++ .github/stale.yml
@@ -5,4 +5,6 @@
 # Issues with these labels will never be considered stale
 exemptLabels:
   - pinned
   - security
+exemptProjects: true
+exemptAssignees: true

(exemptProjects, exemptAssignees)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working wontfix This will not be worked on
Projects
Status: Todo
Development

No branches or pull requests

2 participants