From 735afc12ff99a0a8723ee31cc155725bbeb86bb0 Mon Sep 17 00:00:00 2001 From: Matthieu Bessat Date: Fri, 23 Jun 2023 23:19:30 +0200 Subject: [PATCH] feat(landing): add partners carousel --- assets/images/partners/amse.svg | 1 + assets/images/partners/credit.svg | 1 + assets/images/partners/tespascap.svg | 1 + assets/sass/carousel.scss | 16 ++++---- assets/sass/landing.scss | 53 ++++++++++++++++++++++++ data/partners.yaml | 36 +++++++++++++++++ layouts/landing-matthieu/list.html | 60 +++++++++++++++++++++++++++- layouts/shortcodes/fullmod.html | 2 + 8 files changed, 160 insertions(+), 10 deletions(-) create mode 100644 assets/images/partners/amse.svg create mode 100644 assets/images/partners/credit.svg create mode 100644 assets/images/partners/tespascap.svg create mode 100644 data/partners.yaml create mode 100644 layouts/shortcodes/fullmod.html diff --git a/assets/images/partners/amse.svg b/assets/images/partners/amse.svg new file mode 100644 index 0000000..91aa25f --- /dev/null +++ b/assets/images/partners/amse.svg @@ -0,0 +1 @@ +logo_AMSE \ No newline at end of file diff --git a/assets/images/partners/credit.svg b/assets/images/partners/credit.svg new file mode 100644 index 0000000..12ea72b --- /dev/null +++ b/assets/images/partners/credit.svg @@ -0,0 +1 @@ +logo_credit_mutuel \ No newline at end of file diff --git a/assets/images/partners/tespascap.svg b/assets/images/partners/tespascap.svg new file mode 100644 index 0000000..0b26e5e --- /dev/null +++ b/assets/images/partners/tespascap.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/assets/sass/carousel.scss b/assets/sass/carousel.scss index 327f4fa..1c35214 100644 --- a/assets/sass/carousel.scss +++ b/assets/sass/carousel.scss @@ -103,16 +103,14 @@ $height: 30rem; position: relative; flex: 0 0 100%; width: 100%; - background-color: #f99; counter-increment: item; } -.carousel__slide:nth-child(even) { - background-color: #99f; -} +// .carousel__slide:nth-child(even) { +// background-color: #99f; +// } .carousel__slide:before { - content: counter(item); position: absolute; top: 50%; left: 50%; @@ -157,10 +155,9 @@ $height: 30rem; .carousel__navigation { position: absolute; right: 0; - bottom: 0; + bottom: 1rem; left: 0; text-align: center; - padding-bottom: 1rem; } .carousel__navigation-list, @@ -173,7 +170,7 @@ $height: 30rem; display: inline-block; width: 1.5rem; height: 1.5rem; - background-color: #333; + background-color: rgba(51, 51, 51, 0.7); background-clip: content-box; border: 0.25rem solid transparent; border-radius: 50%; @@ -236,6 +233,7 @@ $height: 30rem; .carousel__navigation-item.enabled { .carousel__navigation-button { opacity: 0.5; - background-color: white; + background-color: #eeeeee; + box-shadow: inset 0 0 2px black; } } diff --git a/assets/sass/landing.scss b/assets/sass/landing.scss index 54d90dc..164f320 100644 --- a/assets/sass/landing.scss +++ b/assets/sass/landing.scss @@ -167,3 +167,56 @@ } } + +.partner-comment__container { + height: 100%; + display: flex; + justify-content: center; + align-items: center; + + background: rgba(1, 1, 1, 0.05); + + .partner-comment { + padding-bottom: 1rem; + display: flex; + flex-direction: column; + align-items: center; + } + .partner-comment__quote { + width: 75%; + text-align: center; + margin: 3rem auto 0 auto; + position: relative; + display: block; + font-style: italic; + font-weight: 300; + &::before, &::after { + font-size: 8rem; + color: rgba(0, 0, 0, 0.2); + position: absolute; + } + &::before { + content: "“"; + top: -6rem; + } + &::after { + content: "”"; + right: -1rem; + bottom: -9rem; + } + } + .partner-comment__author { + margin-top: 1rem; + display: flex; + flex-direction: column; + align-items: center; + } + .partner-comment__author-picture { + width: 9rem; + aspect-ratio: 1; + // border-radius: 50%; + } + .partner-comment__author-name { + margin-top: .5rem; + } +} diff --git a/data/partners.yaml b/data/partners.yaml new file mode 100644 index 0000000..bc5ce9a --- /dev/null +++ b/data/partners.yaml @@ -0,0 +1,36 @@ +people: + - name: Jessica + org: + name: T'es pas cap + intro: de + website: + image: tespascap.svg + quote: | + Soutenons l'association qui sauvegarde la chapelle de Bethléem à Aubevoye, témoignage précieux de notre histoire. + + - name: Stéphane + org: + name: Brasserie Les Cottereaux + intro: de la + website: https://www.agglo-seine-eure.fr/equipements/brasserie-les-cottereaux/ + image: BLC_logo_color.png + quote: | + C'est tout naturellement que nous avons lancé le partenariat avec L'étoile de Bethléem dont la vocation est de rénover une pepite de notre patrimoine historique. + + - name: null + org: + name: Crédit Mutuel de Normandie + intro: du + image: credit.svg + quote: | + Partenaire privilégié des associations comme l'Étoile de Bethléem, le crédit mutuel vous accompagne dans tous vos projets. + + - name: Phillipe + org: + name: AMSE + intro: de l' + website: https://www.amse.asso.fr/ + image: amse.svg + quote: | + Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. + diff --git a/layouts/landing-matthieu/list.html b/layouts/landing-matthieu/list.html index df325a1..4d8cc10 100644 --- a/layouts/landing-matthieu/list.html +++ b/layouts/landing-matthieu/list.html @@ -7,7 +7,7 @@
-

Relevons notre Bethléem Normand

+

Relevons notre Bethléem Normand !

@@ -227,6 +227,7 @@ + {{ $slides_count := 6 }}
@@ -256,6 +257,63 @@
+ + + + + + + + + + {{ $slides_count := len $.Site.Data.partners.people }} +
+
+

Ils nous soutiennent

+
+
+
    + {{ range $index, $comment := $.Site.Data.partners.people }} +
  1. +
    +
    + {{ $image := resources.Get (printf "images/partners/%s" $comment.image) }} + + Photo d'un de nos soutiens + +

    + {{ $comment.quote }} +

    +
    +
    + {{ with $comment.name }}{{ . }}{{ end }} {{ with $comment.org.intro }}{{ . }}{{ end }} {{ $comment.org.name }} +
    +
    +
    +
    +
    + Diapositive précédente + Diapositive suivante +
    +
    2. + {{ end }} +
+ +
+
diff --git a/layouts/shortcodes/fullmod.html b/layouts/shortcodes/fullmod.html new file mode 100644 index 0000000..062988d --- /dev/null +++ b/layouts/shortcodes/fullmod.html @@ -0,0 +1,2 @@ +{{ $c := mod (.Get 0) (.Get 1) }} +{{ if lt $c 0 }}{{ add (.Get 1) $c }}{{ else }}{{ $c }}{{ end }}