changement image fond canopee et détails

This commit is contained in:
LUXEY Adrien 2021-02-03 08:58:43 +01:00
parent 05d4edffcd
commit 361eac5728
3 changed files with 10 additions and 4 deletions

View file

@ -1,5 +1,7 @@
# Laboratoire du futur site web de Deuxfleurs # Laboratoire du futur site web de Deuxfleurs
Les tests graphiques sont dans `/lab`, une page HTML par idée à développer. N'hésitez pas à ajouter la vôtre !
## Objectifs techniques ## Objectifs techniques
* Responsive mobile-first design. * Responsive mobile-first design.
@ -10,6 +12,8 @@
* **Branches et canopée** : Des bouts de branches et de canopée qui défilent lors du scroll, contenant des éléments de texte ou autre contenu. * **Branches et canopée** : Des bouts de branches et de canopée qui défilent lors du scroll, contenant des éléments de texte ou autre contenu.
* `ronce/feuille brush.abr` contient la brosse Photoshop utilisée par Ronce pour les feuilles d'arbre au premier plan. On pourrait l'utiliser pour faire des bordures de fond.
* **Parallax** : Exploiter l'illustration au maximum, en la laissant fixée en fond de page tandis que les éléments graphiques défilent (parallax). * **Parallax** : Exploiter l'illustration au maximum, en la laissant fixée en fond de page tandis que les éléments graphiques défilent (parallax).
* S'il faut un menu : barre d'onglets sur PC, menu « sandwich » qui révèle une colonne d'onglets sur smartphone. * S'il faut un menu : barre d'onglets sur PC, menu « sandwich » qui révèle une colonne d'onglets sur smartphone.
* Couleurs : Ronce a proposé quelques couleurs dans `/lab/gimp/branches-et-canopee`. * Couleurs : Ronce a proposé quelques couleurs dans `/lab/gimp/branches-et-canopee`.
@ -22,7 +26,7 @@
Il semblerait qu'Element utilise du [Fira Sans](https://fonts.google.com/specimen/Fira+Sans)... Hm. Il semblerait qu'Element utilise du [Fira Sans](https://fonts.google.com/specimen/Fira+Sans)... Hm.
* [Bordures de `<code>` comme dessinées à la main](https://stackoverflow.com/a/6402175) ? * [Bordures « dessinées à la main »](https://stackoverflow.com/a/6402175) ?
## Inspirations ## Inspirations
@ -40,7 +44,7 @@
Utiliser des bannières qui donnent du sens au contenu. Utiliser des bannières qui donnent du sens au contenu.
* [Semantic CSS] (https://adamwathan.me/css-utility-classes-and-separation-of-concerns/) * [Semantic CSS](https://adamwathan.me/css-utility-classes-and-separation-of-concerns/)
Le fait de ne pas donner d'éléments de graphisme dans notre markup HTML, mais seulement dans le CSS. Par exemple, mettre une classe "text-center" à un &lt;p&gt; est considéré une mauvaise pratique. Le fait de ne pas donner d'éléments de graphisme dans notre markup HTML, mais seulement dans le CSS. Par exemple, mettre une classe "text-center" à un &lt;p&gt; est considéré une mauvaise pratique.

View file

@ -38,7 +38,7 @@ body {
} }
#main-page { #main-page {
background-color: var(--bg-secondary-color); background-color: var(--bg-ternary-color);
padding: 0; padding: 0;
} }

View file

@ -1,6 +1,8 @@
# Illustration de Ronce # Illustration de Ronce
**Ces images ne sont pas libres de droit.** **These images are not free of rights.
Ces images ne sont pas libres de droit.**
Janvier 2021 Janvier 2021