Development #67991
Nîmes : intégration graphique
0%
Files
Associated revisions
History
Updated by Corentin Séchet 10 months ago
- File logo.svg logo.svg added
- File combo-desktop.png combo-desktop.png added
- File combo-mobile.png combo-mobile.png added
- File wcs-desktop.png wcs-desktop.png added
- File wcs-mobile.png wcs-mobile.png added
- File 0001-nimes-create-theme-67991.patch 0001-nimes-create-theme-67991.patch added
- Status changed from En cours to Solution proposée
- Patch proposed changed from No to Yes
Updated by Agate Berriot 10 months ago
- File Screenshot 2022-08-23 at 10-19-45 Portail - Cellules.png Screenshot 2022-08-23 at 10-19-45 Portail - Cellules.png added
Premier retour sur la base de mes tests en local, tes screenshots et ce que j'ai pu observer sur https://nimes.fr. Je trouve que leur site est assez fouilli et manque de cohérence, j'imagine que tu as du composer avec ça. Voici les trucs qui m'interrogent et méritent possiblement une adapation ?
1. Couleur body : #f6f5f4 (nimes.fr) vs #ffffff en local
2. Couleur menu: #ffffff (nimes.fr)
3. Footer semble plus petits sur nimes.fr (seule l'extrémité basse a un fond sombre) mais il semble y avoir deux sections de footer chez eux, une grande avec énormément de liens, et une autre sur une ligne.
4. Cellules : J'ai l'impression que les cellules me matchent pas les styles de nimes.fr (e.g https://www.nimes.fr/jeune/petite-enfance-0-3-ans.html)
- bordures et coin rouge rouges en local
- en tête de cellule avec un fond gris / rouge sur nimes.fr
5. Polices :
- Le corps est spécifié en arial sur nimes.fr vs liberation en local. Chez moi le rendu est le même, (j'ai l'impression que liberation sans n'est pas chargée du tout dans mon navigateur), mais ça gagnerait possiblement à être explicite
- le texte est plus petit mais aussi moins lisible sur nimes.fr, je ne sais pas quelle est la politique dans ce genre de cas, j'aurais tendance à garder ta version qui me paraît plus accessible
6. Inputs : sur nimes.fr (e.g https://www.nimes.fr/demarche.html) : fond blanc, focus bleu, pas de border-radius, bordure noire en bas
7. Boutons : Peut-être prendre le style du bouton de l'accueil, bloc latéral sur https://www.nimes.fr/jeune/inscriptions-scolaires.html ou contact dans le pied de page ?
8. Mobile :
- bordure blanche sous le headersuperflue en local ? (cf screenshot)
- réduire la taille du logo pour matcher nimes.fr
Updated by Corentin Séchet 9 months ago
Couleur body : #f6f5f4 (nimes.fr) vs #ffffff en local
Je pick bien du blanc sur le body, si tu parles du background
Couleur menu: #ffffff (nimes.fr)
le menu est en blanc chez moi
Footer semble plus petits sur nimes.fr
J'ai été un peu vite en besogne, j'ai ajouté une zone sous le footer en effet ("bas du pied de page" dans Combo)
J'ai l'impression que les cellules me matchent pas les styles de nimes.fr
J'ai trouvé ces cellules quelque part sur leur site, c'était rigolo à faire mais soit :) J'ai refait ça en mettant des fond gris dans la sidebar, un header rouge uniquement pour les cellules foldable, c'est très rouge sinon.
le texte est plus petit mais aussi moins lisible sur nimes.fr, je ne sais pas quelle est la politique dans ce genre de cas, j'aurais tendance à garder ta version qui me paraît plus accessible
Je suis de ton avis.
Inputs : sur nimes.fr (e.g https://www.nimes.fr/demarche.html) : fond blanc, focus bleu, pas de border-radius, bordure noire en bas
Mettre une border-bottom uniquement sous les inputs n'est pas trivial, on a beaucoup de widgets, et beaucoup de CSS qui utilise $widget-border (on a pas de $widget-border-width). Ça sort du cadre d'une inté native. J'ai passé le focus en bleu cependant.
Boutons : Peut-être prendre le style du bouton de l'accueil, bloc latéral sur https://www.nimes.fr/jeune/inscriptions-scolaires.html ou contact dans le pied de page ?
Oui, c'est fait
bordure blanche sous le headersuperflue en local ?
C'est parce que la page que tu as importée en local doit référencer un asset que tu n'as pas, supprimes l'image de la page et ça devrait s'en aller
réduire la taille du logo pour matcher nimes.fr
Ça m'ennuie parce que le sous-titre devient illisible si on fait ça. A voir avec les clients s'ils ont des retours là-dessus, qu'ils fournissent un logo adapté à une plus petite taille.
Updated by Frédéric Péters 9 months ago
Mettre une border-bottom uniquement sous les inputs n'est pas trivial, on a beaucoup de widgets, et beaucoup de CSS qui utilise $widget-border (on a pas de $widget-border-width). Ça sort du cadre d'une inté native. J'ai passé le focus en bleu cependant.
Éventuellement tu peux tester $form-style: light;
Updated by Anaïs Ecuvillon 9 months ago
Corentin Séchet a écrit :
Ça m'ennuie parce que le sous-titre devient illisible si on fait ça. A voir avec les clients s'ils ont des retours là-dessus, qu'ils fournissent un logo adapté à une plus petite taille.
en même temps, ce logo ainsi que le sous-titre sont dédiés au site de Nîmes.fr, je vais leur en demander un dédié pour le site de démarches, des recommandations ?
Updated by Agate Berriot 9 months ago
- File Screenshot_20220830_093155.png Screenshot_20220830_093155.png added
- File Screenshot_20220830_094542.png Screenshot_20220830_094542.png added
Corentin Séchet a écrit :
Couleur body : #f6f5f4 (nimes.fr) vs #ffffff en local
Je pick bien du blanc sur le body, si tu parles du background
Waow, visiblement, il y a une inconsistence du rendu sur Chrome et Firefox. Sur Firefox, le body est légèrement grisé chez moi (cf capture ci jointe), sur Chrome il est bien blanc. J'imagine qu'il doit y avoir un style par défaut du navigateur qui diffère. Tu peux oublier ainsi que ma remarque et la suivante sur la couleur du menu.
J'ai été un peu vite en besogne, j'ai ajouté une zone sous le footer en effet ("bas du pied de page" dans Combo)
👌
J'ai l'impression que les cellules me matchent pas les styles de nimes.fr
J'ai trouvé ces cellules quelque part sur leur site, c'était rigolo à faire mais soit :) J'ai refait ça en mettant des fond gris dans la sidebar, un header rouge uniquement pour les cellules foldable, c'est très rouge sinon.
Ah, j'ai du les rater, j'ai croisé au moins 3 ou 4 styles différents sur leur site… Cette dernière version me parait bien
Inputs : sur nimes.fr (e.g https://www.nimes.fr/demarche.html) : fond blanc, focus bleu, pas de border-radius, bordure noire en bas
Mettre une border-bottom uniquement sous les inputs n'est pas trivial, on a beaucoup de widgets, et beaucoup de CSS qui utilise $widget-border (on a pas de $widget-border-width). Ça sort du cadre d'une inté native. J'ai passé le focus en bleu cependant.
Noté, top.
bordure blanche sous le headersuperflue en local ?
C'est parce que la page que tu as importée en local doit référencer un asset que tu n'as pas, supprimes l'image de la page et ça devrait s'en aller
J'avais bien une image inexistante qui avait sauté lors de l'import de ta page. Je l'ai enlevée (et il n'y a plus la 404 correspondante dans les logs navigateur), mais le problème semble toujours être là, cf capture ci-jointe. Si le souci ne se présente que chez moi, je suis okay pour considérer que c'est lié à mon environnement.
réduire la taille du logo pour matcher nimes.fr
Ça m'ennuie parce que le sous-titre devient illisible si on fait ça. A voir avec les clients s'ils ont des retours là-dessus, qu'ils fournissent un logo adapté à une plus petite taille.
Effectivement. Je suis okay pour laisser comme ça ou trouver un autre asset avec le client comme suggéré par Anaïs :)
Updated by Corentin Séchet 9 months ago
Frédéric Péters a écrit :
Éventuellement tu peux tester
$form-style: light;
Magnifique, merci.
Anaïs Écuvillon a écrit:
en même temps, ce logo ainsi que le sous-titre sont dédiés au site de Nîmes.fr, je vais leur en demander un dédié pour le site de démarches, des recommandations ?
Du coup on pourra intégrer ça avec leur retours. S'ils pouvaient en faire un qui aille sur fond rouge juste, ça éviterai d'avoir trop de changements à faire.
Agate Berriot a écrit :
J'avais bien une image inexistante qui avait sauté lors de l'import de ta page. Je l'ai enlevée (et il n'y a plus la 404 correspondante dans les logs navigateur), mais le problème semble toujours être là, cf capture ci-jointe. Si le souci ne se présente que chez moi, je suis okay pour considérer que c'est lié à mon environnement.
C'est moi qui avait mal regardé, tu avais raison, c'est fixé.
Updated by Agate Berriot 9 months ago
- Status changed from Solution proposée to Solution validée
Corentin Séchet a écrit :
Frédéric Péters a écrit :
Éventuellement tu peux tester
$form-style: light;
Magnifique, merci.
Testé en local, ça rend super bien !
Agate Berriot a écrit :
J'avais bien une image inexistante qui avait sauté lors de l'import de ta page. Je l'ai enlevée (et il n'y a plus la 404 correspondante dans les logs navigateur), mais le problème semble toujours être là, cf capture ci-jointe. Si le souci ne se présente que chez moi, je suis okay pour considérer que c'est lié à mon environnement.
C'est moi qui avait mal regardé, tu avais raison, c'est fixé.
Testé également, c'est nickel :)
Updated by Corentin Séchet 9 months ago
- Status changed from Solution validée to Résolu (à déployer)
commit 43832f4ea83837e944b418232c05fcd5c9c3a175 Author: Corentin Séchet <csechet@entrouvert.com> Date: Fri Aug 5 16:05:16 2022 +0200 nimes: create theme (#67991)
Updated by Transition automatique 9 months ago
- Status changed from Résolu (à déployer) to Solution déployée
nimes: create theme (#67991)