search

jolleon / GeoNature-citizen

Portail web d'inventaire citoyen de la biodiversité à destination du grand public
https://geonature-citizen.readthedocs.io
GNU Affero General Public License v3.0
1 stars 0 forks source link

Mettre la plateforme aux couleurs de la LPO (bleu, etc) #26

Closed jolleon closed 5 years ago

jolleon commented 5 years ago

cf. frontend/src/styles.css Il y a une class :root dans ce ficher qui permet de configurer les couleurs principales. Quelques couleurs ne sont pas contrôlées là, e.g. les pointeurs sur la carte sont une image (verte...).

lpofredc commented 5 years ago

Utiliser le fichier ̀frontend/src/custom/custom.css.template (à copier dans frontend/src/custom/custom.css) qui reprend cette class :root et permet la personnalisation par surcouche.

Pour les marqueurs de carte, j'ai posté une issue pour fournir les originaux https://github.com/PnX-SI/GeoNature-citizen/issues/105

jolleon commented 5 years ago

Ok, je vois le template mais custom.css n'est utilisé nulle part... il manque quelque chose non? (sauf si l'idée c'est de remplacer styles.css en prod?)

jolleon commented 5 years ago

Styles LPO à inclure pour le déploiement LPO (peut être en ajoutant custom.css dans les styles dans angular.json):

:root {
    --default-font-color: #5d6970;
    --primary: #004fbd;
    --dark-primary: #6610f2;
    --secondary: #fd7e14;
    --secondary-gradient: #fd7e14;
    --ternary: #007bff;
    --list-toggler-width: 21px;
    --list-obs-offset: 170px;
    --router-outlet-offset: 113px;
    --modal-header-bg-moz: moz-linear-gradient(top, var(--secondary) 0%, var(--secondary) 50%, var(--secondary-gradient) 51%, var(--secondary-gradient) 100%);
    --modal-header-bg-webkit: moz-linear-gradient(top, var(--secondary) 0%, var(--secondary) 50%, var(--secondary-gradient) 51%, var(--secondary-gradient) 100%);
    --modal-header-bg-linear: linear-gradient(to bottom, var(--secondary) 0%, var(--secondary) 50%, var(--secondary-gradient) 51%, var(--secondary-gradient) 100%);
}

@lpofredc pour les marqueurs de carte on remplacera les images directement en prod avec des icones aux bonnes couleurs, ou bien est-ce que tu as une autre solution ?

lpofredc commented 5 years ago

Dans le dépot principal, custom.css est intégré dans 'angular.json', intégré en surcouche de styles.css

https://github.com/PnX-SI/GeoNature-citizen/blame/b702487ef3ae301e26564b479309386eb64f391f/frontend/angular.json#L32

jolleon commented 5 years ago

Ack, je viens de comprendre ce qu'il se passe...

Lorsque j'ai merge les nouveaux développements dans notre projet (le 21 mai), upstream/dev était sur le commit 16e56eeab80e50e4a02eb7b28869456aed87a06b (https://github.com/PnX-SI/GeoNature-citizen/commit/16e56eeab80e50e4a02eb7b28869456aed87a06b) sur lequel custom.css n'était pas là dans angular.json... même si la branche de @lpofredc qui le rajoute a bien été mergée dans dev avant ça, car il semble que ce changement ait disparu d'une façon ou d'une autre, et @patkap a effectivement corrigé le problème plus tard: https://github.com/PnX-SI/GeoNature-citizen/commit/eb37c4c0e36c8d547b5a6262ad9c525c4b0c492c#diff-6b33ff949134bbe0de31effc7e1f6d13

Ce dernier commit de @patkap est plus vieux que le 21 mai mais la branche sur laquelle il était n'a été mergé dans upstream/dev que le 22 mai, donc après qu'on ait récupéré les changements sur ce fork.

Je vais refaire un merge de upstream/dev ça devrait régler le problème.

lpofredc commented 5 years ago

Pour les pointeurs, je vois pour intégrer la customisation dans le dépot principal, via le fichier map.config.ts.

lpofredc commented 5 years ago

Personnalisation de markers ajouté ici, via le fichier map.config.ts. markers png à ajouter au dossier custom/images

https://github.com/PnX-SI/GeoNature-citizen/pull/110