feat: landing page content

TODO.md

@@ -1,10 +1,43 @@
 # TODO
 
-- [ ] add favicon
+- [x] add favicon
 - [ ] add logo on header
 - [ ] better transparent logo
 - [ ] add illustration images
 - [ ] add opengraph and json-ld
 - [ ] refonte landing page
-- [ ] Add working newsletter form, using listmonk
+- [x] Add working newsletter form, using listmonk
 - [ ] Add contact form
+
+# Structure landing page
+
+VMEMS
+slogan: Ensemble Rendons Gaillon-Aubevoye cyclable !
+avec une image de background de vélos ensemble avec des gens qui font les courses
+
+Section: "pourquoi"
+Accroche: "Pourquoi développer le vélo du quotidien?"
+- Bon pour la santé
+- Économique
+- Écologique
+- Convivial
+
+Section "FAQ/Debunk"
+Accroche: Réponses aux idées reçues courantes
+- Le vol n'est pas une fatalité!
+- Pour se protéger de la météo il suffit d'être équipé
+- Je ne suis pas sportif ! -> Le VAE existe
+
+Section "comment développer le vélo"
+Accroche: comment développer le vélo ?
+Il faut lever les freins:
+- Manque d'aménagements sécuriser
+- Manque de stationnements pratique et sécurisés dans l'espace publique, devant les commerces, dans le parc résidentiel et zones de bureau et d'activités.
+
+Section "présentation actions association"
+
+Section "aider"
+Accroche: Nous avons besoin de vous!
+
+Section "actualités"
+Accroche: Nos dernières actus

assets/sass/figure.scss

@@ -0,0 +1,8 @@
+@media (max-width: $md-breakpoint) {
+    figure {
+      img {
+        max-width: 100% !important;
+      }
+    }
+}
+

assets/sass/landing.scss

@@ -10,6 +10,23 @@
     column-gap: 2rem;
 }
 
+.landing__container {
+  section {
+    border-bottom: 1px solid rgba(0, 0, 0, 0.2);
+    padding: 2rem 0;
+    h2 {
+      margin-bottom: 1.2rem;
+    }
+  }
+  section:last-of-type {
+    border-bottom: none;
+  }
+}
+
+.landing__container .landing__section:nth-child(even) {
+  background-color: #00912430;
+}
+
 @media(max-width: $md-breakpoint) {
     .split-two {
         display: block;

assets/sass/main.scss

@@ -17,6 +17,7 @@ $secondary: #f15a24;
 @import "./landing.scss";
 @import "./footer.scss";
 @import "./nav.scss";
+@import "./figure.scss";
 
 .page-footer {
   border-top: 1px solid rgba(140, 130, 115, 0.15);

content/_index.md

@@ -1,75 +1,7 @@
 ---
 title: Ensemble, rendons Gaillon-Aubevoye cyclable !
+description: |
+    Formée en octobre 2023, nous voulons promouvoir et aider à développer une alternative à la voiture dans le bassin de vie de Gaillon-Aubevoye.
 body_class: "landing-page"
 ---
 
-Bienvenue sur ce site web, il est en construction.
-
-<div class="split-two">
-<div>
-
-## L'association VMEMS
-
-Formée en octobre 2023, nous voulons promouvoir et aider à développer une alternative à la voiture dans le bassin de vie de Gaillon-Aubevoye.
-
-### Nos actions
-
-- Montrer et promouvoir la solution vélo auprès du grand public
-    - Organisation d'évènements publics, sensibilisation
-- Faire interface entre les élus et les usagers
-    - Montrer aux élus le besoin en infrastructure et les avantages du vélos
-    - Être force de propositions, signaler les problèmes et faire des critiques constructives des aménagements cyclables et projets des collectivités
-- Porter le besoin des cyclistes auprès d'entreprises privées
-    - Par exemple, plaidoyer à la mise en place de stationnements dans enceinte privées (ex: centre commerciaux, locaux d'entreprises)
-- Aider les cyclistes, plus particulièrement les novices
-
-### Juridique
-
-Notre association est une association de loi 1901 déclaré en préfecture de l'Eure, inscrite au RNA sous le numéro `W271006679`.
-
-### Statuts
-
-[Vous pouvez consulter les statuts, approuvé par l'assemblée constituante le 4 octobre 2023.](/statuts)
-
-### Représentation
-
-- Sébastien DENISE, Président
-- Matthieu BESSAT, Secrétaire
-- Alexis Martini, Secrétaire-Adjoint
-
-</div>
-<div>
-
-## Contact
-
-N'hésitez pas à nous faire part de vos remarques ou questions par e-mail : [contact@vmems.fr](contact@vmems.fr)
-
-## Rejoindre l'association
-
-Nous avons besoin de vous ! Toutes sortes de compétences sont requise pour mener à bien les actions de l'asso.
-Pour nous rejoindre, veuillez envoyer un e-mail (n'hésitez pas à vous présenter), nous vous transmettrons ensuite une invitation au groupe [Signal](https://www.signal.org/fr) interne de l'association.
-
-## Actualités
-
-### Journée du vélo
-
-Le samedi 20 avril 2024, nous participons à la [Fête du vélo organisée par la commune du Val d'Hazey](https://www.agglo-seine-eure.fr/actualites/le-val-dhazey-fete-du-velo/) en animant un stand pour promouvoir le vélo et autres mobilités douces comme moyen de déplacement dans le bassin de Gaillon Aubevoye.
-Venez nous rencontrer sur le stand !
-
-### Stationnements vélo centre-ville de Gaillon
-
-Nous aidons actuellement la mairie de Gaillon à installer une dizaine de place vélo Rue du Général de Gaulle à Gaillon. [Une lettre a été envoyé fin mars 2024.](https://fichiers.vmems.fr/proposition_parking_gaillon/lettre_phase_1/lettre.html)
-
-### Réunion préparatoire projet RD316
-
-L'agglo Seine-Eure prépare un projet d'infrastructure cyclable longeant la RD316, profitons de cette opportunité pour proposer un projet pratique et utile pour les usagers.
-
-Une rencontre a eu lieu le samedi 28 octobre 2023, de 17h30 à 19h30, 6 personnes étaient présentes. Après une phase de présentation de l'association aux nouveaux, une discussion sur le projet RD316 a aboutit à un ensemble de questions et autres remarques à transmettre à l'agglo Seine-Eure.
-
-### Assemblée générale constituante
-
-Elle a eu lieu le 4 octobre 2023 à la maison des associations de Gaillon. 11 personnes se sont manifestées et ont répondus à l'appel 💪.
-
-</div>
-</div>
-<!-- 2024-04-13 9521d03b-c84a-498b-9567-0c084555d3d2 -->

content/etat/index.md

@@ -0,0 +1,43 @@
+---
+title: État des aménagement à l'heure actuelle sur Gaillon-Aubevoye
+---
+
+## Stationnements
+
+Voici la liste des stationnements adapté depuis openstreetmap
+
+### Aubevoye
+
+#### Gare SNCF
+
+- 8 cages pour vélo (elle sont casiment toutes pleines)
+
+### Gaillon
+
+#### public
+- Devant la caisse d'épargne, 1 arceau sur bollard
+
+#### privé
+- Arceaux à l'Atelier
+
+## Piste cyclable
+
+(néant)
+
+## Trottoir "partagés" piéton/vélos
+
+- Itinéraire, Rue Verdum <-> Paul Noyer <-> Collège <-> Lycée
+
+## Voie partagés piéton/vélos
+
+- Itinéraire Collège <-> Gare SNCF (Rue Lavoisier)
+
+## Double sens-cyclables
+
+### à Gaillon
+
+### à Aubevoye
+
+- Rue de la créquinière (entre la rue des vignes, et la rue des valets)
+- le haut de la Rue du courtillet
+

content/etat/stationnement/index.md

@@ -0,0 +1,24 @@
+---
+title: L'état des stationnements actuels
+---
+Cette page a pour vocation de lister toute les endroits public ou privé où on peut trouver du stationnement ou parking adapté pour vélos du quotidien et leurs caractéristiques.
+
+<!--more-->
+
+## Stationnements
+
+Voici la liste des stationnements adapté depuis OpenStreetMap. Vous pouvez vous même ajouter un stationnement depuis l'éditeur en ligne iD et contribuer à améliorer la carte commune.
+
+### Aubevoye
+
+#### Gare SNCF
+
+- 8 cages pour vélo (elle sont casiment toutes pleines)
+
+### Gaillon
+
+#### public
+- Devant la caisse d'épargne, 1 arceau sur bollard
+
+#### privé
+- Arceaux à l'Atelier

content/freins/index.md

@@ -0,0 +1,9 @@
+---
+title: Les freins
+---
+
+Selon notre analyse, les principaux freins qui décourage la pratique du vélo du quotidien :
+
+1. Le manque de piste cyclables adapté séparé de la circulation automobile et piéton.
+2. Le manque de stationnements vélo adaptés, dans l'habitat collectif, les commerces, les services, les lieux de travail.
+3. Le manque de culture vélo en général.

layouts/index.html

@@ -1,15 +1,153 @@
 {{ define "main" }}
-    <div class="container">
-		<h1 class="page-title">{{ .Title }}</h1>
-
-        <div class="tmp_logo_container">
-            {{ $image := resources.Get "images/logos/logo.png" }}
-            <img
-                alt="Logo VMEMS représentant un vélo en transition"
-                src="{{ $image.RelPermalink }}"
-            />
-        </div>
-
+    <div class="landing__container">
+        <section class="landing__cover" id="landing-slogan">
+            <div class="container">
+            <div class="landing__cover__content row my-3">
+                <div class="branding col-12 col-lg-3 d-flex justify-content-center">
+                    {{ $image := resources.Get "images/logos/logo.png" }}
+                    <img
+                        alt="Logo VMEMS représentant un vélo en transition"
+                        src="{{ $image.RelPermalink }}"
+                    />
+                </div>
+                <div class="col-12 col-lg-9 d-flex flex-column justify-content-center align-items-center">
+                    <h1 class="text-center">Ensemble, rendons Gaillon-Aubevoye cyclable !</h1>
+                    <h5 class="mt-3">Association Vélo et Mobilités en Eure-Madrie-Seine</h5>
+                </div>
+            </div>
+            </div>
+        </section>
+        <section class="landing__section odd" id="landing-why">
+            <div class="container">
+                <h2>Pourquoi développer le vélo du quotidien ? 🚲</h2>
+                <ul>
+                    <li>Économique 💸</li>
+                    <li>Bon pour la santé ❤️</li>
+                    <li>Pratique et rapide 💨</li>
+                    <li>Écologique 🌳</li>
+                    <li>Convivial ☺️, rend la ville plus agréable</li>
+                </ul>
+            </div>
+        </section>
+        <section class="landing__section" id="landing-faq">
+            <div class="container">
+                <div class="offset-lg-6 col-md-6">
+                    <h2>Halte aux idées reçues !</h2>
+                    <ul>
+                        <li><b>Il ne pleut que 6% du temps !</b> Même en Normandie. Cependant les bons équipements permettent de s'adapter à tout temps.</li>
+                        <li><b>Non, ce n'est pas dangereux !</b> Si le cycliste se sent vulnérable, le risque est pourtant peu élevé.</li>
+                        <li><b>Le vol n'est pas une fatalité !</b> Avec un bon antivol et des parkings adaptés le risque est limité.</li>
+                    </ul>
+                </div>
+            </div>
+        </section>
+        <section class="landing__section odd" id="landing-how">
+            <div class="container">
+            <h2>Quels sont les principaux freins ? 🛑</h2>
+            <p>Selon notre analyse, les principaux freins qui décourage la pratique du vélo du quotidien :</p>
+            <ol>
+                <li>Le manque de piste cyclables adapté séparé de la circulation automobile et piéton.</li>
+                <li>Le manque de stationnements vélo adaptés, dans l'habitat collectif, les commerces, les services, les lieux de travail.</li>
+                <li>Le manque de culture vélo en général.</li>
+            </ol>
+            <p>Tout ces freins ne sont pas une fatalité, l'action citoyenne peuvent les réduires.</ul>
+            </div>
+        </section>
+        <section class="landing__section" id="landing-actions">
+            {{/*
+            What we do
+            */}}
+            <div class="container">
+            <div class="offset-lg-6 col-md-6">
+            <h2>Nos actions citoyennes 🎬</h2>
+            <ul>
+                <li>Montrer et promouvoir la solution vélo auprès du grand public<ul>
+                        <li>Organisation d'évènements publics, sensibilisation</li>
+                    </ul>
+                </li>
+                <li>Faire interface entre les élus et les usagers<ul>
+                        <li>Montrer aux élus le besoin en infrastructure et les avantages du vélos</li>
+                        <li>Être force de propositions, signaler les problèmes et faire des critiques constructives des aménagements cyclables et projets des collectivités</li>
+                    </ul>
+                </li>
+                <li>Porter le besoin des cyclistes auprès d'entreprises privées<ul>
+                        <li>Par exemple, plaidoyer à la mise en place de stationnements dans enceinte privées (centre commerciaux, locaux d'entreprises…)</li>
+                    </ul>
+                </li>
+                <li>Aider les cyclistes, plus particulièrement les novices</li>
+            </ul>
+            </div>
+            </div>
+        </section>
+        <section class="landing__section odd" id="landing-need-help">
+            <div class="container">
+            {{/*
+            How to help us
+            */}}
+            <h2>Nous avons besoin de votre aide ! 🙋</h2>
+            <ul>
+                <li>Pour parler de l'association et des initiatives autour de vous…</li>
+                <li>Pour envoyer des e-mails et lettres de demandes…</li>
+                <li>Pour participer aux réflexions autours des aménagements…</li>
+                <li>Pour communiquer, au public, aux médias…</li>
+                <li>Pour organiser des évènements…</li>
+            </ul>
+            <p class="text-end">
+                <a href="/association/rejoindre" class="btn btn-lg btn-primary">
+                    Nous rejoindre
+                </a>
+            </p>
+            </div>
+        </section>
+        <section class="landing__section" id="landing-last-news">
+            <div class="container">
+            {{/*
+            Show last 3 news
+            */}}
+            <h2>Nos dernières actualités</h2>
+            {{ $news := where .Site.RegularPages "Section" "in" "actualites" }}
+            {{ range $index, $element := $news }}{{ if eq $index 0 }}
+                {{ $featuredImage := (resources.Get (printf "%s" ("cover/cover.jpg" | safeURL))) }}
+                {{ with $element.Params.featured_image }}
+                    {{ $featuredImage = $element.Resources.GetMatch .src }}
+                {{ end }}
+                {{ $featuredImage := $featuredImage.Resize "800x" }}
+                <div class="card col-12 col-md-6 col-lg-4">
+                    <a href="{{ .RelPermalink }}">
+                        {{ $featuredImage := (resources.Get (printf "%s" ("images/cycle_path_sun.jpg" | safeURL))) }}
+                        {{ if .Params.featured_image }}
+                            {{ $featuredImage = .Resources.GetMatch (.Params.featured_image.src | safeURL)  }}
+                        {{ end }}
+                        {{ $featuredImage := $featuredImage.Process "fill 500x350" }}
+                        <img 
+                            class="card-img-top img-fluid"
+                            alt="{{ .Params.featured_image.alt }}" src="{{ $featuredImage.RelPermalink }}"
+                        />
+                    </a>
+                      <div class="card-body">
+                        <h5 class="card-title">
+                        <a href="{{ .RelPermalink }}">{{ .Title }}</a>
+                        </h5>
+                        <p class="card-text">
+                        {{ .Summary }}
+                        </p>
+                        <p class="card-text">
+                            <small class="text-body-secondary">
+                            {{ $date := .Date.Format "2006-01-02"  }}
+                            <time datetime="{{ $date }}">
+                                {{ time.Format "2 January 2006" $date }}
+                            </time>
+                            </small>
+                        </p>
+                        <p class="card-text text-end">
+                            <a href="{{ .RelPermalink }}"><small class="mr-4 text-body-secondary">Lire plus</small></a>
+                        </p>
+                      </div>
+                    </div>
+            {{ end }}
+            {{ end }}
+            </div>
+        </section>
         <div>
         {{ .Content }}
         </div>