Development #62483
Creér le thème pour Noyelles-Godault
0%
Description
Test déjà existante : https://noyelles-godault.test.entrouvert.org/
Thème simple (comme pour Gonfreville) sur base de https://www.ville-noyelles-godault.fr/
Fichiers
Révisions associées
Historique
Mis à jour par Corentin Séchet il y a environ 2 ans
- Fichier 0001-noyelles-godault-create-theme-62483.patch 0001-noyelles-godault-create-theme-62483.patch ajouté
- Fichier noyelles-combo-desktop.png ajouté
- Fichier noyelles-combo-mobile.png ajouté
- Fichier noyelles-wcs-desktop.png ajouté
- Fichier noyelles-wcs-mobile.png ajouté
- Statut changé de Nouveau à Solution proposée
- Patch proposed changé de Non à Oui
Mis à jour par Thomas Jund il y a environ 2 ans
- Le mode `$nav-item-selected-mode: bottom-border` sera surement plus proche du site de Noyelle
- C'est fait exprès les bordures des cellules tronquées ?
- Je trouve la nav trop proche du logo.
- Ta proposition est très austère, tu pourrais te rapprocher du code graphique et coloré du portail : fond gris, cellules blanches et border-radius (sauf 1 angle)
- Pourquoi n'y a-t-il plus de logo en mobile ?
- Pourquoi une couleur avec une opacité réduite pour le texte ? mettre un gris opaque.
- Le titre des formulaires ne se voit pas.
Je ne comprends pas :
$source-sans: Montserrat; $font-family: $source-sans;
Source sans est une police de caractère, la montserrat une autre.
Et le portail de Noyelle utilise la 'source sans' et la "Poppins"
`unset` non compatible IE :
position: unset; // utilise static à la place
On verra pour la suite après.
Mis à jour par Corentin Séchet il y a environ 2 ans
- Fichier noyelles-combo-desktop.png ajouté
- Fichier noyelles-combo-mobile.png ajouté
- Fichier noyelles-wcs-desktop.png ajouté
- Fichier noyelles-wcs-mobile.png ajouté
- Fichier 0001-noyelles-godault-create-theme-62483.patch 0001-noyelles-godault-create-theme-62483.patch ajouté
Je ne suis pas satisfait de la navigation, je ne savais pas trop quoi faire (il y a des bordures plus épaisses en bas en mobile, la bordure-top est visible en mobile même quand le menu est fermé, je ne pense pas que le fond gris-foncé soit très bien). Je veux bien un avis sur comment faire ça plus proprement.
Mis à jour par Thomas Jund il y a environ 2 ans
- Fichier 0001-noyelles-godault-add-some-proposals-for-header-cells.patch 0001-noyelles-godault-add-some-proposals-for-header-cells.patch ajouté
Voilà une proposition depatch pour le header et les cellules (juste 2 vars).
Patch poussé sur la branche.
Je reste à ta dispo si tu as des questions / remarques
Mis à jour par Corentin Séchet il y a environ 2 ans
- Fichier 0001-noyelles-godault-create-theme-62483.patch 0001-noyelles-godault-create-theme-62483.patch ajouté
- Fichier noyelles-combo-desktop.png noyelles-combo-desktop.png ajouté
- Fichier noyelles-combo-mobile.png noyelles-combo-mobile.png ajouté
- Fichier noyelles-wcs-desktop.png noyelles-wcs-desktop.png ajouté
- Fichier noyelles-wcs-mobile.png noyelles-wcs-mobile.png ajouté
J'ai intégré tes modifications, fixé le border-radius en bas pour les liens dans les cellules et mis la même couleur de fond pour le menu en desktop et mobile.
Mis à jour par Benjamin Dauvergne il y a environ 2 ans
Je trouve que la liste à puces dans le footer jure un peu, enlever les puces, ajouter un titre pour que ce soit symétrique avec les deux premiers ("Liens utiles" ?).
Sur le site d'origine en mobile le menu hamburger est en dessous du logo et le header est "position: fixed". La nav en général est effectivement pas mal différente (mais chez moi leur header déconne, l'icône recherche sort de l'écran sans scroll possible).
Mis à jour par Corentin Séchet il y a environ 2 ans
- Fichier 0001-noyelles-godault-Make-mobile-menu-fixed.patch 0001-noyelles-godault-Make-mobile-menu-fixed.patch ajouté
Pour les listes à puce, c'est dans des cellules de texte, ça ne fait pas partie du thème. La navigation est effectivement différente : ils ont des couleurs selont les rubriques. Je ne pense pas que ça soit souhaitable que le thème dépende du contenu, ça nous obligerait à intervenir sur le thème quand une catégorie est ajoutée par exemple. J'ai passé le menu en fixed pour coller au site mobile de la ville.
Mis à jour par Thomas Jund il y a environ 2 ans
- Fichier 0004-toplinks-position-and-colors.patch 0004-toplinks-position-and-colors.patch ajouté
- Fichier 0003-header-nav-position.patch 0003-header-nav-position.patch ajouté
- Fichier 0002-header-gray-xlight-with-shadow.patch 0002-header-gray-xlight-with-shadow.patch ajouté
- Fichier 0001-make-sticky-menu-scrollable.patch 0001-make-sticky-menu-scrollable.patch ajouté
Après visite du site instit, je propose encore quelques modifs/améliorations
position fixed du header
Attention, en utilisant cette position, la nav n'est pas scollable. Donc si tu as plus de 10 items (assez facile avec les items de sous menu), ces entrées de menus ne seront pas disponibles.
Je te propose d'utiliser `position: sticky` à la place, cela permettra accéder aux items (mais uniquement après le scroll de la page, ce qui n'est pas top non plus mais déjà mieux.
Couleur background header
J'ai fait un tour sur le site instit et noté que le header est dans un gris plus clair avec une ombre, je propose d'appliquer le même style
Alignement de la nav en desktop
J'ai aligné la nav de manière identique au site instit : les items centrés sur le logo mais la bordure collée en bas de header.
Position des liens de connexion
Dans l'alignement des items de la nav
Attention, ne jamais mettre `$link-color: $font-color;` : cela signifie que des liens au sein d'un texte seront invisibilisés !
Mis à jour par Corentin Séchet il y a environ 2 ans
Peut-être qu'il ne vaut mieux pas mettre la nav ni en fixed, ni en sticky, si ça rend la navigation plus difficile ?
Mis à jour par Frédéric Péters il y a environ 2 ans
Oui, et la réalité est une petite commune, il n'y aura pas dix entrées dans le menu.
Mis à jour par Thomas Jund il y a environ 2 ans
si ça rend la navigation plus difficile ?
C'est un choix d'UI, avec ses avantages et ses inconvénients.
Mais si c'est proposé, il faut veiller à ce que tous les items de la nav puissent être accessibles (et comme on ne sait pas combien il y en aura…), ce n'était pas le cas; mon patch propose une solution pour cela.
Mis à jour par Corentin Séchet il y a environ 2 ans
- Fichier 0001-noyelles-godault-create-theme-62483.patch 0001-noyelles-godault-create-theme-62483.patch ajouté
J'ai pris en compte tes modifs Thomas et j'ai fixé la typo pour les titres, qui était en Poppins sur le site institutionnel et non en Open Sans. Fixé également les titres et le padding dans les cellules texte.
Mis à jour par Thomas Jund il y a environ 2 ans
- Statut changé de Solution proposée à Solution validée
Mis à jour par Corentin Séchet il y a environ 2 ans
- Statut changé de Solution validée à Résolu (à déployer)
commit 3523eb01816ac0adfc903bcfdff28bf9f638ac55
Author: Corentin Séchet <csechet@entrouvert.com>
Date: Tue Mar 8 11:22:49 2022 +0100
noyelles-godault: create theme (#62483)Mis à jour par Transition automatique il y a environ 2 ans
- Statut changé de Résolu (à déployer) à Solution déployée
noyelles-godault: create theme (#62483)