Projet

Général

Profil

Development #67991

Nîmes : intégration graphique

Ajouté par Corentin Séchet il y a plus d'un an. Mis à jour il y a plus d'un an.

Statut:
Fermé
Priorité:
Normal
Assigné à:
Version cible:
-
Début:
05 août 2022
Echéance:
% réalisé:

0%

Temps estimé:
Patch proposed:
Oui
Planning:
Non

Description

Sur la base de https://nimes.fr/


Fichiers

logo.svg (18 ko) logo.svg Corentin Séchet, 10 août 2022 11:49
combo-desktop.png (2,11 Mo) combo-desktop.png Corentin Séchet, 10 août 2022 11:49
combo-mobile.png (1,35 Mo) combo-mobile.png Corentin Séchet, 10 août 2022 11:49
wcs-desktop.png (418 ko) wcs-desktop.png Corentin Séchet, 10 août 2022 11:49
wcs-mobile.png (1,51 Mo) wcs-mobile.png Corentin Séchet, 10 août 2022 11:49
0001-nimes-create-theme-67991.patch (6,54 ko) 0001-nimes-create-theme-67991.patch Corentin Séchet, 10 août 2022 11:50
Screenshot 2022-08-23 at 10-19-45 Portail - Cellules.png (70,3 ko) Screenshot 2022-08-23 at 10-19-45 Portail - Cellules.png Header sur mobile A. Berriot, 23 août 2022 10:41
0001-nimes-create-theme-67991.patch (7,31 ko) 0001-nimes-create-theme-67991.patch Corentin Séchet, 29 août 2022 22:15
Screenshot_20220830_093155.png (51,2 ko) Screenshot_20220830_093155.png Menu - body A. Berriot, 30 août 2022 09:32
Screenshot_20220830_094542.png (14,4 ko) Screenshot_20220830_094542.png Bordure menu A. Berriot, 30 août 2022 09:46
0001-nimes-create-theme-67991.patch (7,8 ko) 0001-nimes-create-theme-67991.patch Corentin Séchet, 30 août 2022 11:21

Révisions associées

Révision 242adc54 (diff)
Ajouté par Corentin Séchet il y a plus d'un an

nimes: create theme (#67991)

Historique

#2

Mis à jour par Corentin Séchet il y a plus d'un an

  • Statut changé de Nouveau à En cours
#3

Mis à jour par Corentin Séchet il y a plus d'un an

#4

Mis à jour par A. Berriot il y a plus d'un an

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

#5

Mis à jour par Corentin Séchet il y a plus d'un an

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.

#6

Mis à jour par Frédéric Péters il y a plus d'un an

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;

#7

Mis à jour par Anaïs Ecuvillon → en congés, retour le 30/04 il y a plus d'un an

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 ?

#8

Mis à jour par A. Berriot il y a plus d'un an

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 :)

#9

Mis à jour par Corentin Séchet il y a plus d'un an

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é.

#10

Mis à jour par A. Berriot il y a plus d'un an

  • Statut changé de Solution proposée à 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 :)

#11

Mis à jour par Corentin Séchet il y a plus d'un an

  • Statut changé de Solution validée à 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)
#12

Mis à jour par Transition automatique il y a plus d'un an

  • Statut changé de Résolu (à déployer) à Solution déployée
#13

Mis à jour par Transition automatique il y a plus d'un an

Automatic expiration

Formats disponibles : Atom PDF