Menu : respecter le styleguide pour la couleur de typo des pages en gris car sinon pas lisible about ifs_afd-aces-dev HOT 11 CLOSED

@clementWedodata il me semblait avoir bien mis la bonne couleur sur les titres désactivés du menu (le gris #6a6192) sur fond violet... La seule chose qui différait était le 'bold' appliqué uniquement sur le lien actif (current page). Correction comme suit ...

ma propale donc :

fond blanc : en bold sur le lien actif uniquement,
fond violet (cartes) : en bold sur tous les liens, couleur #6a6192 sur les liens non actifs
tous les fonds : letter-spacing de .1em pour mieux coller au styleguide (.05em semblait très collé par rapport au styleguide)

from ifs_afd-aces-dev.

@JulienParis

voici ce que je proposais dans le styleguide par rapport au menu. Le page active doit avoir un background #6a6192. Tous les textes sont en blanc hormis la langue non active. Ça évite un problème d'accessibilité. Le hover est très bien comme tu l'as fais.
Pour le letter spacing, pas de problème on adapte pour être au plus proche de la maquette.

Merci

from ifs_afd-aces-dev.

@clementWedodata ok je viens d'ajouter un fix pour check... commit d72ee8f

from ifs_afd-aces-dev.

@JulienParis

tu as pushé ? je ne vois pas de différence.
D'autre part le filet qui sépare "favorite aces" et "About" est cliquable et recharge la webapp. Étrange.

from ifs_afd-aces-dev.

oui oui c'est pushé et maintenant repushé avec le filet désactivé

from ifs_afd-aces-dev.

@JulienParis

hum, merci pour l'update. Par contre, peut être qu'on arrive pas à se comprendre sur ce menu, mais voici un screenshot qui met en vis à vis ma proposition (à gauche) et ton inté (à droite).
Du coup, sur ta proposition, les textes des liens pour lesquels nous ne sommes pas sur la page active ne sont pas accessible. Le contraste ne passe pas le RG2A, donc il faut écrire en blanc comme sur ma proposition.
Enfin, dans mon idée et sur le styleguide, je simule l'état d'une page active avec le rectangle violet clair sous le lien (Homepage).

Pour clore le ticket, il faudrait que le bouton close soit dans un rond blanc pour être cohérent avec les autres boutons et revoir le dégradé sous le panel pour lequel je t'avais mis le lien vers le bon code du gradient.

Je te remercie, je reste dispo s'il reste des zones d'ombres pour toi.

from ifs_afd-aces-dev.

ok j'ai fait des modifs dessus... pas encore au clair sur comment/où éditer ce calque gris qui s'applique par défaut en-dessous

from ifs_afd-aces-dev.

@JulienParis

ok ça me parait pas mal.

• Qu'est ce qui n'est pas clair pour le bandeau "gris" ?
• Concernant l'ombre du menu, j'avais imaginé utiliser un gradient en background d'une div placé en before ou after de ton panel menu pour arriver au même rendu que sur la maquette. Ce n'est peut être pas la bonne solution en terme de code, donc voici un box shadow qui se rapproche du rendu :
  -webkit-box-shadow: -20px 0 50px 0 rgba(27,20,59,0.6);
  box-shadow: -20px 0 50px 0 rgba(27,20,59,0.6);

from ifs_afd-aces-dev.

oui entre-temps j'ai résolu cette histoire de fond gris... je regarde pour le box shadow

from ifs_afd-aces-dev.

@clementWedodata normalement on devrait pouvoir clore ici... pour check

from ifs_afd-aces-dev.

Ok impec pour moi. Merci

from ifs_afd-aces-dev.