Euclide/website_corr
1
0
Fork 0
forked from etoiledebethleem/website
Code Pull requests Activity

feat(shortcodes): external card link (youtube)

Browse source
This commit is contained in:
Matthieu Bessat 2024-05-18 15:06:08 +02:00
parent 89e6e5f8db
commit 975203a718
6 changed files with 82 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

45
assets/sass/card.scss
View file

@ -1,6 +1,49 @@
.card {
padding: 1rem;
padding: 0.5rem;
border: 1px solid gray;
border-radius: 2px;
background-color: #ecf0f1;
display: flex;
gap: 2rem;
.card-image {
display: block;
margin-right: 0rem;
overflow: hidden;
height: 100%;
width: 300px;
flex-grow: 0;
flex-shrink: 0;
}
.card-action {
text-decoration: underline;
}
color: black;
text-decoration: none;
}
@media (max-width: $sm-breakpoint) {
.card-link {
gap: 1rem;
}
}
@media (max-width: $md-breakpoint) {
.card-link {
.card-image {
width: 200px;
height: 100%;
}
}
}
@media (max-width: $xs-breakpoint) {
.card-link {
.card-image {
width: 100% !important;
}
}
}

2
assets/sass/figures.scss
View file

@ -1,5 +1,6 @@
.fig-img {
display: inline-block;
text-align: center;
figcaption {
font-size: .9rem;
color: $hidden;
@ -20,6 +21,7 @@
justify-content: center;
flex-wrap: wrap;
gap: 2rem;
padding-top: 1rem;
margin-bottom: 1rem;
figure {

7
assets/sass/main.scss
View file

@ -46,3 +46,10 @@ $hidden: #2C3E50;
@import 'sliding_gallery.scss';
@import 'alert.scss';
.small-icon {
width: 20px;
height: 20px;
}
.youtube-icon {
fill: #FF0202;
}

2
content/actualites/2024-01-10_flechage-panneaux/index.md
View file

@ -18,8 +18,6 @@ Maintenant la Chapelle n’aura plus de secret pour personne ! 💫
🔎 Nous sommes à la recherche d’une personne au talent de pyrograveur pour remplacer les affiches plastifiées par une pyrogravure comme sur la photo. Merci de vous rapprocher de nous si vous êtes candidat.
<br>
{{<figures-grid>}}
{{<fig-img
src="modele_panneau.jpg"

20
content/geocaching/2023/vierge-noire/index.md
View file

@ -16,15 +16,21 @@ title: La Vierge noire
>}}
</div>
<div class="highlighted">
Bravo ! Vous venez de découvrir la Vierge noire, Notre Dame d'Aubevoye.
</div>
## Bravo ! Vous venez de découvrir la Vierge noire, Notre Dame d'Aubevoye.
Offerte en 1864 à la commune par François Frédéric Alaboissette, un notable, bienfaiteur et érudit local, cette sculpture métallique du XVIIeme siècle posée sur un socle de briques maçonnées fut inaugurée à l'occasion d'une grande cérémonie le 8 septembre 1866.
Un pèlerinage annuel du dimanche le plus proche du 8 septembre, date de la fête de la Nativité de Marie, a perduré jusqu'au début de la seconde moitié du XXème siècle comme en atteste l'ex-voto déposé à ses pieds en 1949 par les habitants d'Aubevoye, après la deuxième guerre mondiale.
Offerte en 1864 à la commune par François Frédéric Alaboissette, un notable, bienfaiteur et érudit local, cette sculpture métallique du XVIIeme siècle posée sur un socle de briques maçonnées fut inaugurée à l'occasion d'une grande cérémonie le 8 septembre 1866.
Cette statue est elle effectivement une Vierge noire ?
En général, les Vierges noires sont des statues médiévales, sculptées entre le XIème et le XVème siècle, pas nécessairement de couleur noire à l'origine, mais qui s'assombrissent au fil du temps, par vieillissement de la matière, oxydation du métal ou effet de la combustion des cierges votifs. Il en est aussi à qui sont prêtées des origines paléochrétiennes, celtes, romaines, voire égyptiennes. La tentation pourrait être grande de relier cette statue à une telle tradition. Aubevoye appartenait après tout à l'ancien Pagus de la Madrie (étymologiquement "Domaine de la Mère"), antérieurement à la création du Duché de Normandie. Toutefois, sa facture paraît trop récente pour s'y rattacher
Un pèlerinage annuel du dimanche le plus proche du 8 septembre, date de la fête de la Nativité de Marie, a perduré jusqu'au début de la seconde moitié du XXème siècle comme en atteste l'ex-voto, une offrande déposée à ses pieds en 1949 par les habitants d'Aubevoye, après la deuxième guerre mondiale.
## Cette statue est elle effectivement une Vierge noire ?
En général, les Vierges noires sont des statues médiévales, sculptées entre le XIème et le XVème siècle, pas nécessairement de couleur noire à l'origine, mais qui s'assombrissent au fil du temps, par vieillissement de la matière, oxydation du métal ou effet de la combustion des cierges votifs. Il en est aussi à qui sont prêtées des origines paléochrétiennes, celtes, romaines, voire égyptiennes. La tentation pourrait être grande de relier cette statue à une telle tradition. Aubevoye appartenait après tout à l'ancien Pagus de la Madrie (étymologiquement "Domaine de la Mère"), antérieurement à la création du Duché de Normandie. Toutefois, sa facture paraît trop récente pour s'y rattacher.
{{< youtube-card
id="jLobXIttLhs"
title="Vidéo : La Vierge Noire à Aubevoye"
description="Montage vidéo montrant un historique de cartes postales ainsi que la récente rénovation de la statue de la Vierge noire d'Aubevoye"
>}}
</div>

16
layouts/shortcodes/youtube-card.html Normal file
View file

@ -0,0 +1,16 @@
<!-- Youtube card -->
{{ $videoUrl := printf "https://youtube.com/watch?v=%s" (.Get "id") }}
{{ $thumbnailUrl := printf "https://img.youtube.com/vi/%s/0.jpg" (.Get "id") }}
<a href="{{ $videoUrl }}" class="card card-link card-youtube" title="Voir la vidéo &quot;{{ .Get "title" }}&quot; sur YouTube">
<img class="card-image" src="{{ $thumbnailUrl }}" alt="Miniature youtube" />
<div class="card-content">
<h3>{{ .Get "title" }}</h3>
<p>{{ .Get "description" }}</p>
<p class="card-action">
{{ partial "helpers/svg" (dict "path" "icons/youtube" "class" "small-icon youtube-icon") }}
Voir la vidéo sur YouTube {{ partial "helpers/svg" (dict "path" "icons/external" "class" "icon_inline") }}
</p>
</div>
</a>