la boussole n'est pas navigable au clavier.
A priori rien de bien méchant, il doit manquer des :focus pour compléter les :hover
Je peux regarder ça mais je ne trouve pas comment est compilé le fichier .less en .css
J'ai installé le squelette _galaxie_/boussole + le plugin boussole v2.7.1, pour appeler /?page=spipnav.js en local et travailler dessus.
Si je compile /boussole/css/boussole_topnav.less et que je le compare avec /boussole/css/boussole_topnav.css :
- avec le plugin lesscss (compilateur php), je n'obtiens pas la même chose dans /local/cache-less (fichier pas minifié),
- avec le compileur en CLI et `lessc --compress`, le fichier est minifié mais sur une seule ligne.
Donc, b_b, cerdic ou Eric, savez vous avec quoi/comment le fichier less est compilé ?
(ce serait bien de l'indiquer dans une doc ou autre)
Je n’arrive pas à retrouver le même formatage en fait, alors que je vois que les dernières modifs, faites par b_b ou cerdic conservent bien le formatage du css.
Par exemple :
Pas très grave, c’est surtout pour que le commit ne soit pas juste un gros diff glonal -/+ sur le fichier .css La référence est le fichier .less, c’est le plus important. Oui, ce serait un ajout de code js et des ajouts de classes dans le markup html, en reprenant le css existant. Concernant le poids du JS
J'ai donc ajouté le script js de Nicolas Hofmann, minifié (5.2 Ko), j'ai ajouté des classes sur le markup html de la boussole, et j'ai adapté/simplifié la css (depuis le .less recomplié), qui fait un Ko de moins ^^
C'est donc navigable au clavier, avec TAB pour la prise de focus, puis avec les flèches de direction, et ESC pour quitter le menu.
J'ai donc ajouté le script js de Nicolas Hofmann, minifié (5.2 Ko), j'ai ajouté des classes sur le markup html de la boussole, et j'ai adapté/simplifié la css (depuis le .less recomplié), qui fait un Ko de moins ^^
C'est donc navigable au clavier, avec TAB pour la prise de focus, puis avec les flèches de direction, et ESC pour quitter le menu.
Qu'en pensez vous ?
Moi je ne dirais qu'une chose : bravo !
Et merci !
Tu as changé le comportement en hover sur les entrées de menu et il y a des flèches en fin de ligne.
C’est voulu ou juste un bug css suite à tes modifications ?
Tu as changé le comportement en hover sur les entrées de menu et il y a des flèches en fin de ligne.
C'est voulu ou juste un bug css suite à tes modifications ?
Pour le comportement changé en hover, je ne vois pas, tu peux m'expliquer ?
Pour les flèches en fin de ligne c'est parce que la boussole est affichée sur le squelette dist, et que dans la css il y a l'ajout d'une fleche sur les liens externes, c'est donc lié à la css de la dist uniquement.
Tu as changé le comportement en hover sur les entrées de menu et il y a des flèches en fin de ligne.
C'est voulu ou juste un bug css suite à tes modifications ?
Pour le comportement changé en hover, je ne vois pas, tu peux m'expliquer ?
Pour les flèches en fin de ligne c'est parce que la boussole est affichée sur le squelette dist, et que dans la css il y a l'ajout d'une fleche sur les liens externes, c'est donc lié à la css de la dist uniquement.
Ce que tu as relevé est lié à la css de la dist, pas à la boussole en elle même.
Est-ce qu'il serait par contre possible d'avoir le focus clavier plus manifesté ?
Là, il n'y a que le natif du navigateur (les pointillés autour).
Est-ce que ça pourrait être le même style qu'au :hover (underline, et violet plus foncé pour l'item dans le bandeau) ?
Le 14 août 2017 à 16:39, nicod_ <nicolas.dorigny@gmail.com <mailto:nicolas.dorigny@gmail.com>> a écrit :
Le 10/08/2017 à 22:39, nicod_ a écrit :
Le 10/08/2017 à 21:39, Eric Lupinacci a écrit :
Tu as changé le comportement en hover sur les entrées de
menu et il y a des flèches en fin de ligne.
C'est voulu ou juste un bug css suite à tes modifications ?
Pour le comportement changé en hover, je ne vois pas, tu peux
m'expliquer ?
Pour les flèches en fin de ligne c'est parce que la boussole
est affichée sur le squelette dist, et que dans la css il y a
l'ajout d'une fleche sur les liens externes, c'est donc lié à
la css de la dist uniquement.
Ce que tu as relevé est lié à la css de la dist, pas à la
boussole en elle même.
Faudrait faire apparaitre le menu d'accessibilité qu'en il est au focus sinon on ne comprends pas pourquoi le tab met deux coup avant d'aller au logo.
J'ai mis un moment à comprendre, en fait on parle plutôt de menu d'évitement, pas d'accessibilité.
Oui effectivement, ça fait deux liens cachés qui prennent le focus.
Je vais regarder comment gérer ça.
Comme sur mediaspip en fait ...
Pas compris, tu peux préciser ? mediaspip.net ou medias.spip.net ?
Je ne vois pas de menu d'évitement sur les deux.
Faudrait faire apparaitre le menu d'accessibilité qu'en il est au focus sinon on ne comprends pas pourquoi le tab met deux coup avant d'aller au logo.
J'ai mis un moment à comprendre, en fait on parle plutôt de menu d'évitement, pas d'accessibilité.
Oui effectivement, ça fait deux liens cachés qui prennent le focus.
Voilà, les liens apparaissent au focus.
Problème suivant : le menu de langue.
Il faudrait qu'il prenne le focus et qu'il s'ouvre, avec un lien d'évitement qui permette de ne pas se taper les 25 langues avec tab tab tab etc, lien d'évitement vers le bloc de recherche donc.
PS : tout ceci concerne le squelette galactic, pas la boussole.
Il faudrait qu'il prenne le focus et qu'il s'ouvre, avec un lien d'évitement qui permette de ne pas se taper les 25 langues avec tab tab tab etc, lien d'évitement vers le bloc de recherche donc.
ça tu dois pouvoir le faire en js, en ciblant sur une class du menu lang ou une id, et tu enlève les tabindex des items de langue. non ?
Bonne soirée
Arnaud B. (Mist. GraphX)
Le 16/08/2017 à 13:26, nicod_ a écrit :
Le 16/08/2017 à 12:45, nicod_ a écrit :
Le 16/08/2017 à 08:32, Mist. GraphX a écrit :
Faudrait faire apparaitre le menu d'accessibilité qu'en il est au focus sinon on ne comprends pas pourquoi le tab met deux coup avant d'aller au logo.
J'ai mis un moment à comprendre, en fait on parle plutôt de menu d'évitement, pas d'accessibilité.
Oui effectivement, ça fait deux liens cachés qui prennent le focus.
Voilà, les liens apparaissent au focus.
Problème suivant : le menu de langue.
Il faudrait qu'il prenne le focus et qu'il s'ouvre, avec un lien d'évitement qui permette de ne pas se taper les 25 langues avec tab tab tab etc, lien d'évitement vers le bloc de recherche donc.
PS : tout ceci concerne le squelette galactic, pas la boussole.
