Landing page + countdown #11

Merged
mbess merged 11 commits from fb_initial_landing_page into master 2023-07-06 20:36:36 +00:00
40 changed files with 1457 additions and 263 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 27 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 642 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 152 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 178 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.3 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.6 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 222 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 284 KiB

View file

@ -0,0 +1,4 @@
<?xml version="1.0" encoding="utf-8"?>
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M9.62231 6.78278C10.0546 6.43909 10.1265 5.81001 9.78277 5.3777C9.43908 4.94539 8.81001 4.87354 8.37769 5.21724C4.73471 8.11342 4 11.8784 4 16C4 17.6569 5.34315 19 7 19C8.65685 19 10 17.6569 10 16C10 14.3432 8.65685 13 7 13C6.71233 13 6.43412 13.0405 6.17076 13.1161C6.5162 10.5872 7.45738 8.50391 9.62231 6.78278ZM20 16C20 17.6569 18.6569 19 17 19C15.3431 19 14 17.6569 14 16C14 11.8784 14.7347 8.11342 18.3777 5.21724C18.81 4.87354 19.4391 4.94539 19.7828 5.3777C20.1265 5.81001 20.0546 6.43909 19.6223 6.78278C17.4574 8.50391 16.5162 10.5872 16.1708 13.1161C16.4341 13.0405 16.7123 13 17 13C18.6569 13 20 14.3432 20 16Z" />
</svg>

After

Width:  |  Height:  |  Size: 784 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.5 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 296 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 294 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 72 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 12 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 16 KiB

View file

@ -12,3 +12,72 @@
.article { .article {
} }
.prominent-article {
position: relative;
overflow: hidden;
.article__background {
height: 100%;
width: 100%;
position: absolute;
top: 0;
left: 0;
background-size: cover;
z-index: 0;
transition: all 0.2s ease-in-out;
}
.article__background-overlay {
height: 100%;
width: 100%;
position: absolute;
top: 0;
left: 0;
background-color: rgba(1, 1, 1, 0.5);
z-index: 1;
}
.article__content {
position: relative;
z-index: 2;
color: white;
padding: 2rem 0;
.article__title {
color: white;
a {
color: white;
text-decoration: none;
}
}
.article__summary {
}
.article__meta {
margin-bottom: 1rem;
opacity: 0.8;
}
.article__bottom {
display: flex;
justify-content: end;
}
.article__readmore {
border: 1px solid white;
}
}
&:hover {
.article__background {
transform: scale(1.1);
}
}
}
.less-prominent-articles {
display: grid;
grid-template-columns: 1fr 1fr;
}
.right-floating-image {
float: right;
}

View file

@ -4,8 +4,8 @@
background-color: $accent; background-color: $accent;
color: white; color: white;
padding: 1rem 2.5rem; padding: 1rem 2.5rem;
font-weight: lighter;
text-transform: uppercase; text-transform: uppercase;
text-decoration: none;
user-select: none; user-select: none;
min-width: 10rem; min-width: 10rem;
font-size: 1.2rem; font-size: 1.2rem;
@ -24,3 +24,11 @@
} }
} }
.button.button-transparent {
background-color: transparent;
&:hover {
background-color: transparent;
color: white;
}
}

336
assets/sass/carousel.scss Normal file
View file

@ -0,0 +1,336 @@
// FROM https://css-tricks.com/css-only-carousel/
@keyframes tonext {
75% {
left: 0;
}
95% {
left: 100%;
}
98% {
left: 100%;
}
99% {
left: 0;
}
}
@keyframes tostart {
75% {
left: 0;
}
95% {
left: -300%;
}
98% {
left: -300%;
}
99% {
left: 0;
}
}
@keyframes snap {
96% {
scroll-snap-align: center;
}
97% {
scroll-snap-align: none;
}
99% {
scroll-snap-align: none;
}
100% {
scroll-snap-align: center;
}
}
* {
box-sizing: border-box;
scrollbar-color: transparent transparent; /* thumb and track color */
scrollbar-width: 0px;
}
*::-webkit-scrollbar {
width: 0;
}
*::-webkit-scrollbar-track {
background: transparent;
}
*::-webkit-scrollbar-thumb {
background: transparent;
border: none;
}
* {
-ms-overflow-style: none;
}
$height: 30rem;
.carousel {
ol, li {
list-style: none;
margin: 0;
padding: 0;
}
position: relative;
filter: drop-shadow(0 0 10px #0003);
perspective: 100px;
// define the height of the whole carousel
height: $height;
}
.carousel__viewport {
position: absolute;
z-index: 2;
top: 0;
right: 0;
bottom: 0;
left: 0;
display: flex;
overflow-x: scroll;
counter-reset: item;
scroll-behavior: smooth;
scroll-snap-type: x mandatory;
}
.carousel__slide {
position: relative;
flex: 0 0 100%;
width: 100%;
counter-increment: item;
}
.slide-content {
position: absolute;
width: 100%;
.slide-image {
padding: 0;
margin: 0;
figcaption {
font-size: .9rem;
opacity: 0.9;
text-align: center;
}
}
}
.slide-inner {
}
// .carousel__slide:nth-child(even) {
// background-color: #99f;
// }
.carousel__slide:before {
position: absolute;
top: 50%;
left: 50%;
transform: translate3d(-50%,-40%,70px);
color: #fff;
font-size: 2em;
}
.carousel__snapper {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
scroll-snap-align: center;
z-index: 1;
}
// @media (hover: hover) {
// .carousel__snapper {
// animation-name: tonext, snap;
// animation-timing-function: ease;
// animation-duration: 4s;
// animation-iteration-count: infinite;
// }
// .carousel__slide:last-child .carousel__snapper {
// animation-name: tostart, snap;
// }
// }
@media (prefers-reduced-motion: reduce) {
.carousel__snapper {
animation-name: none;
}
}
.carousel:hover .carousel__snapper,
.carousel:focus-within .carousel__snapper {
animation-name: none;
}
.carousel__navigation {
position: absolute;
z-index: 2;
right: 0;
bottom: 1rem;
left: 0;
text-align: center;
}
.carousel__navigation-list,
.carousel__navigation-item {
display: flex;
justify-content: center;
}
.carousel__navigation-button {
display: inline-block;
width: 1.5rem;
height: 1.5rem;
background-clip: content-box;
background-color: #eeeeee;
box-shadow: inset 0 0 2px black;
border: 0.25rem solid transparent;
border-radius: 50%;
font-size: 0;
transition: transform 0.1s;
}
.carousel::before,
.carousel::after,
.carousel__prev,
.carousel__next {
position: absolute;
top: 0;
width: 4rem;
height: 4rem;
transform: translateY($height/2 - 2rem);
border-radius: 50%;
font-size: 0;
outline: 0;
z-index: 4;
}
.carousel::before,
.carousel__prev {
left: -0.5rem;
}
.carousel::after,
.carousel__next {
right: -0.5rem;
}
// the big circle navigation button left and right
.carousel::before,
.carousel::after {
content: '';
z-index: 1;
background-color: transparent;
opacity: 0.65;
background-size: 1.5rem 1.5rem;
background-repeat: no-repeat;
background-position: center center;
font-size: 2.5rem;
line-height: 4rem;
text-align: center;
pointer-events: none;
}
.carousel::before:hover, .carousel::after:hover {
opacity: 1 !important;
}
.carousel::before {
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cpolygon points='0,50 80,100 80,0' /%3E%3C/svg%3E");
}
.carousel::after {
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cpolygon points='100,50 20,100 20,0' /%3E%3C/svg%3E");
}
.carousel__navigation-item {
display: flex;
align-items: center;
}
.carousel__navigation-item.enabled {
.carousel__navigation-button {
opacity: 0.5;
background-color: lighten($accent, 0%);
}
}
@media (max-width: $md-breakpoint) {
$md-height: 45rem;
.carousel {
height: $md-height !important;
}
.carousel::before,
.carousel::after,
.carousel__prev,
.carousel__next {
transform: translateY($md-height/2 - 2rem) !important;
}
.carousel::next {
}
}
// layout definitions inside the slides
.layout-grid-image {
display: grid;
grid-column-gap: 2rem;
.image-container {
display: flex;
align-items: center;
}
}
.double-image-container {
display: flex;
}
.layout-grid-image.third {
grid-template-columns: 3fr 1fr;
}
.layout-grid-image.half {
grid-template-columns: 1fr 1fr;
}
@media (max-width: $md-breakpoint) {
.carousel {
.layout-grid-image.half {
display: block;
}
.layout-grid-image.third {
display: block;
}
.image-container {
display: flex;
justify-content: center;
}
.slide-image {
height: 19rem;
img {
width: auto;
height: 100%;
}
}
}
}

205
assets/sass/countdown.scss Normal file
View file

@ -0,0 +1,205 @@
.countdown-page {
background-color: $background;
color: white;
height: 100vh;
overflow: hidden;
}
.countdown-page__content__container {
display: flex;
justify-content: center;
height: 100%;
}
.countdown-page__content {
margin-top: -5rem;
display: flex;
align-items: center;
}
.accent-band {
background-color: $accent;
height: 1.5vh;
width: 100%;
}
.launch-logo-back {
margin-top: -1.8rem;
opacity: 0.05;
position: absolute;
top: 0rem;
left: 0;
height: 100vh;
width: 100%;
display: flex;
justify-content: center;
align-items: center;
svg {
height: 80vh;
}
}
.launch-logo-aligner {
margin-top: -10rem;
height: 100%;
display: grid;
grid-template-columns: 1fr 8fr;
}
.launch-logo-large {
display: flex;
flex-direction: column;
justify-content: center;
margin-left: 4rem;
svg {
height: 10rem;
}
}
.launch-logo {
svg {
width: 10rem;
height: auto;
}
}
.launch-introduction {
margin-top: 3rem;
margin-bottom: 2rem;
letter-spacing: .33rem;
text-transform: uppercase;
font-size: .8rem;
text-align: center;
}
.countdown__container {
.countdown__content {
flex-shrink: 1;
display: flex;
}
.timer__value {
font-size: 5.4rem;
}
.timer__label {
font-size: 1rem;
text-align: center;
}
.timer__separator {
margin: 0 1rem;
display: flex;
flex-direction: column;
justify-content: center;
.timer__value {
opacity: 0.5;
margin-top: -.4rem;
font-weight: 300;
}
.timer__label {
opacity: 0;
}
}
.timer__value {
display: flex;
justify-content: center;
align-items: center;
}
}
@media (max-width: $md-breakpoint) {
.launch-logo-back {
top: 0;
margin-top: 0;
}
.countdown-page__content {
// margin-top: -10rem;
}
.countdown__container {
.timer__value {
font-size: 3rem;
}
.timer__separator {
margin: 0 .8rem;
.timer__value {
font-size: 2rem;
}
}
.timer__label {
font-size: .8rem;
}
}
.countdown__content {
justify-content: center;
}
}
.countdown-footer {
position: absolute;
bottom: 0;
left: 0;
z-index: 2;
width: 100%;
background-color: rgba(1, 1, 1, .5);
color: white;
// background-color: $tertiary;
.page-container {
display: flex;
justify-content: space-between;
}
padding: .5rem 0;
.countdown-footer__logo {
padding: .3rem 0;
svg {
width: auto;
height: 5rem;
}
}
}
.socials {
display: flex;
align-items: center;
.social-icon {
width: 1.4rem;
color: white;
display: flex;
justify-content: center;
align-items: center;
}
.social-item {
display: flex;
justify-content: center;
align-items: center;
}
.social-text {
margin-right: .8rem;
}
a {
color: white;
opacity: 0.8;
}
svg {
fill: white;
opacity: 0.8;
}
}
@media (max-width: $md-breakpoint) {
.socials {
.social-text {
display: none;
}
}
}

View file

@ -1,15 +1,16 @@
@import url('https://fonts.googleapis.com/css2?family=Bona+Nova:wght@400;700&family=Roboto&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Bona+Nova:wght@400;700&family=Roboto:wght:300;400;500&display=swap');
.serif-font { .serif-font {
font-family: 'Bona Nova', serif; font-family: 'Bona Nova', serif;
} }
body { body {
// font-family: 'Trebuchet MS', Tahoma,sans-serif; // font-family: 'Trebuchet MS', Tahoma,sans-serif;
// font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif; // font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
// font-family: "Open Sans","Segoe UI",HelveticaNeue-Light,"Helvetica Neue Light","Helvetica Neue",Helvetica,Arial,sans-serif; // font-family: "Open Sans","Segoe UI",HelveticaNeue-Light,"Helvetica Neue Light","Helvetica Neue",Helvetica,Arial,sans-serif;
font-family: 'Roboto', sans-serif; font-family: 'Roboto', sans-serif;
font-weight: 300; font-weight: 400;
margin: 0; margin: 0;
font-size: 17px; font-size: 17px;
line-height: 1.6; line-height: 1.6;
@ -45,45 +46,50 @@ a:hover {
.secondary-bg { .secondary-bg {
h2 { h2 {
color: white; color: white;
} }
a { a {
color: white; color: white;
} }
color: white; color: white;
.button { .button {
background-color: $background-secondary; background-color: $background-secondary;
color: white; color: white;
&:hover { &:hover {
background-color: lighten($background-secondary, 14%); background-color: lighten($background-secondary, 14%);
} }
} }
background-color: darken($background-secondary, 15%); background-color: darken($background-secondary, 15%);
} }
.separation-section { .separation-section {
margin-top: 3rem; margin-top: 3rem;
padding: 1.2rem 0; padding: 1.2rem 0;
} }
.w-100 { .w-100 {
width: 100px; width: 100px;
} }
.w-200 { .w-200 {
width: 200px; width: 200px;
} }
img { .h-100 {
max-width: 100%; height: 100%;
} }
img {
max-width: 100%;
}
.grid {
display: grid;
}
.grid-2 {
grid-template-columns: 1fr 1fr;
}
.grid {
display: grid;
}
.grid-2 {
grid-template-columns: 1fr 1fr;
}

View file

@ -1,18 +1,31 @@
.cover__container { .cover__container {
margin-top: 1px;
position: relative; position: relative;
min-height: 40rem; min-height: 50rem;
} }
.cover__back { .cover__back {
position: absolute; position: absolute;
height: 100%; height: 100%;
width: 100%; width: 100%;
overflow: hidden;
background-size: cover; background-size: cover;
background-repeat: no-repeat; background-repeat: no-repeat;
background-position-x: center; background-position-x: center;
background-position-y: center; background-position-y: center;
z-index: 1; z-index: 1;
// to center the video
text-align: center;
display: flex;
justify-content: center;
video {
width: 100%;
height: 100%;
background-color: gray;
object-fit: cover;
position: relative;
}
} }
.cover__content { .cover__content {
@ -79,6 +92,11 @@
@import 'landing/timeline.scss'; @import 'landing/timeline.scss';
@media (max-width: $lg-breakpoint) {
.cover__back {
}
}
@media (min-width: $lg-breakpoint) { @media (min-width: $lg-breakpoint) {
.cover__back { .cover__back {
background-position-x: center; background-position-x: center;
@ -108,14 +126,13 @@
@keyframes compare-anim { @keyframes compare-anim {
0% { 0% {
clip-path: inset(100% 100% 100% 0%);
} }
100% { 100% {
clip-path: inset(100% 100% 100% 100%);
} }
} }
.compare-items-dynamic { .compare-items-dynamic {
.compare-duet { .compare-duet {
border-radius: 4px;
overflow: hidden; overflow: hidden;
position: relative; position: relative;
@ -126,12 +143,16 @@
overflow: hidden; overflow: hidden;
clip-path: inset(100% 100% 100% 0%); clip-path: inset(100% 100% 100% 0%);
} }
.compare-hidden {
clip-path: inset(100% 100% 100% 0%);
transition: clip-path 2s cubic-bezier(.86,0,.07,1);
animation-fill-mode: forwards;
}
} }
.compare-duet:hover { .compare-duet:hover {
.compare-hidden { .compare-hidden {
animation: compare-anim 2s cubic-bezier(.86,0,.07,1); clip-path: inset(100% 100% 100% 100%);
animation-fill-mode: forwards;
} }
} }
} }
@ -159,8 +180,107 @@
} }
.landing-main { .landing-main {
section:first-of-type {
border-top: 1px solid rgba(1, 1, 1, 0.2);
}
section { section {
border-bottom: 1px solid rgba(1, 1, 1, 0.2); border-bottom: 1px solid rgba(1, 1, 1, 0.2);
} }
} }
.partners-container .carousel {
border-top: 1px solid #eee;
}
.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-container {
display: flex;
width: 80%;
margin: 0 auto;
p {
text-align: center;
margin: 2.5rem auto;
position: relative;
display: block;
font-style: italic;
font-weight: 300;
}
.quote-decoration {
display: flex;
flex-direction: column;
svg {
fill: rgba(0, 0, 0, 0.2);
width: 3rem;
height: 3rem;
}
}
.quote-before {
justify-content: flex-start;
}
.quote-after {
justify-content: flex-end;
svg {
transform: rotate(180deg)
}
}
}
.partner-comment__author {
margin-top: .5rem;
display: flex;
flex-direction: column;
align-items: center;
}
.partner-comment__author-picture {
width: 10rem;
aspect-ratio: 1;
// border-radius: 50%;
}
.partner-comment__author-name {
margin-top: .5rem;
}
.partner-comment__author-link:hover {
opacity: 0.6;
}
}
.history-component__content {
}
.history-container {
.double-horizontal-image-container {
display: grid;
grid-template-columns: 1fr 1fr;
img {
width: 100%;
height: 17rem;
object-fit: cover;
}
}
}
@media (max-width: $md-breakpoint) {
.history-container {
}
}

View file

@ -14,6 +14,7 @@ $background-secondary: #BFB78F;
$secondary: #011F26; $secondary: #011F26;
$tertiary: #A5A692; $tertiary: #A5A692;
$accent: #F2A71B; $accent: #F2A71B;
$accent-dark: #A56F09;
.pagination-nav { .pagination-nav {
margin-top: 1em; margin-top: 1em;
@ -32,6 +33,8 @@ $accent: #F2A71B;
@import 'single_image.scss'; @import 'single_image.scss';
@import 'footer.scss'; @import 'footer.scss';
@import 'sections.scss'; @import 'sections.scss';
@import 'carousel.scss';
@import 'countdown.scss';
// components // components
@import 'tags.scss'; @import 'tags.scss';

View file

@ -2,6 +2,12 @@
width: 80%; width: 80%;
margin: 0 auto; margin: 0 auto;
} }
.page-container-large {
width: 75%;
margin: 0 auto;
}
.page-full { .page-full {
padding: 0 2rem; padding: 0 2rem;
} }

View file

@ -0,0 +1,43 @@
function isElementInViewport (el) {
var rect = el.getBoundingClientRect();
return (
rect.top >= 0 &&
rect.left >= 0 &&
rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) && /* or $(window).height() */
rect.right <= (window.innerWidth || document.documentElement.clientWidth) /* or $(window).width() */
);
}
//
// little addon to enhance the carousel
Array.from(document.getElementsByClassName("carousel")).forEach((carousel) => {
let viewport = carousel.getElementsByClassName("carousel__viewport")[0];
let slides = carousel.getElementsByClassName("carousel__slide");
let nav_items = Array.from(carousel.getElementsByClassName("carousel__navigation-item"))
let last_scroll_pos = null;
viewport.onscroll = (_event) => {
let position = slides.length * viewport.scrollLeft / viewport.scrollWidth;
let direction = last_scroll_pos == null || last_scroll_pos < viewport.scrollLeft;
last_scroll_pos = viewport.scrollLeft;
nav_items.forEach((item, index) => {
if (
(direction && position > index-1 && position <= index) ||
(!direction && position >= index && position < index+1)
) {
if (!item.classList.contains("enabled")) {
item.classList.add("enabled")
}
return
}
if (item.classList.contains("enabled")) {
item.classList.remove("enabled")
}
})
}
})

View file

@ -13,6 +13,9 @@ changefreq = 'weekly'
[params] [params]
dateFmt = "02.01.2006 15:04" dateFmt = "02.01.2006 15:04"
[params.socials]
facebook = "https://www.facebook.com/groups/bethleemaubevoye"
twitter = "https://www.helloasso.com/associations/l-etoile-de-bethleem-association-des-amis-de-la-chapelle-de-bethleem-d-aubevoye/"
[params.defaultImage] [params.defaultImage]
local = true local = true
@ -28,3 +31,4 @@ imtag = 'imtags'
[markup.goldmark.renderer] [markup.goldmark.renderer]
unsafe = true unsafe = true

View file

@ -0,0 +1,40 @@
---
title: Annonce des visites de la chapelle
date: 2023-02-21
---
Depuis la création du groupe Facebook dédié à la Chapelle de Bethléem, vous n'avez cessé d'être de plus en plus nombreux à témoigner votre intérêt.🙏
Cet intérêt s'est traduit par le souhait croissant de constituer une association de sauvegarde et de valorisation du site.
Nous avions à cet égard sondé vos intentions au printemps.
## ⭐ Le moment est venu de prendre rendez-vous.
Nous vous convions donc le samedi 24 septembre 2022 à 14 h 30, en la salle fête de Saint-Aubin sur Gaillon.
Nous vous y présenterons le projet d'association, auquel vous pourrez vous joindre comme membres fondateurs.
<!-- Nous vous remercions de bien vouloir nous indiquer par cet évènement si vous souhaitez assister à cette réunion de lancement. -->
## Le Projet d'association
Cette association culturelle et patrimoniale aura à cœur de préserver, promouvoir et valoriser sous tous ses aspects un patrimoine unique.
À cet égard, il sera notamment demandé aux membres fondateurs d'approuver les statuts de LEtoile de Bethléem - Association des Amis de la Chapelle de Bethléem dAubevoye, dont le projet d'article 2 propose l'objet social comme suit :
> LAssociation a pour objet de :
> - Contribuer à la sauvegarde et à la restauration de la Chapelle de Bethléem sise à Aubevoye, dans la commune administrative du Val dHazey (Eure) en Normandie ;
> - Promouvoir ce monument, particulièrement sa crypte unique, en approfondissant sa connaissance, en défendant son image et en assurant sa communication ;
> - Valoriser le site par des actions concourant à lentretien, à la promotion et à l'animation de ce patrimoine historique, culturel, religieux et naturel et de tout ce qui le constitue, qu'elle entend mieux faire connaître, apprécier et protéger.
>
> A cet égard, lAssociation reconnaît et sattache à préserver le caractère chrétien du monument, légué par son histoire, depuis sa fondation par le Cardinal Charles 1er de Bourbon.
## 👉 L'ordre du jour
- Présentation du projet,
- Adoption des statuts,
- Constitution des instances,
- Détermination du montant de la cotisation.
La chapelle compte sur vous ⛪

View file

@ -0,0 +1,40 @@
---
title: Partenariat entre X et Y pour faire Z
date: 2023-06-15
---
Depuis la création du groupe Facebook dédié à la Chapelle de Bethléem, vous n'avez cessé d'être de plus en plus nombreux à témoigner votre intérêt.🙏
Cet intérêt s'est traduit par le souhait croissant de constituer une association de sauvegarde et de valorisation du site.
Nous avions à cet égard sondé vos intentions au printemps.
## ⭐ Le moment est venu de prendre rendez-vous.
Nous vous convions donc le samedi 24 septembre 2022 à 14 h 30, en la salle fête de Saint-Aubin sur Gaillon.
Nous vous y présenterons le projet d'association, auquel vous pourrez vous joindre comme membres fondateurs.
<!-- Nous vous remercions de bien vouloir nous indiquer par cet évènement si vous souhaitez assister à cette réunion de lancement. -->
## Le Projet d'association
Cette association culturelle et patrimoniale aura à cœur de préserver, promouvoir et valoriser sous tous ses aspects un patrimoine unique.
À cet égard, il sera notamment demandé aux membres fondateurs d'approuver les statuts de LEtoile de Bethléem - Association des Amis de la Chapelle de Bethléem dAubevoye, dont le projet d'article 2 propose l'objet social comme suit :
> LAssociation a pour objet de :
> - Contribuer à la sauvegarde et à la restauration de la Chapelle de Bethléem sise à Aubevoye, dans la commune administrative du Val dHazey (Eure) en Normandie ;
> - Promouvoir ce monument, particulièrement sa crypte unique, en approfondissant sa connaissance, en défendant son image et en assurant sa communication ;
> - Valoriser le site par des actions concourant à lentretien, à la promotion et à l'animation de ce patrimoine historique, culturel, religieux et naturel et de tout ce qui le constitue, qu'elle entend mieux faire connaître, apprécier et protéger.
>
> A cet égard, lAssociation reconnaît et sattache à préserver le caractère chrétien du monument, légué par son histoire, depuis sa fondation par le Cardinal Charles 1er de Bourbon.
## 👉 L'ordre du jour
- Présentation du projet,
- Adoption des statuts,
- Constitution des instances,
- Détermination du montant de la cotisation.
La chapelle compte sur vous ⛪

View file

@ -0,0 +1,4 @@
---
with_header: false
with_footer: false
---

View file

@ -1 +0,0 @@
hello world

View file

36
data/partners.yaml Normal file
View file

@ -0,0 +1,36 @@
people:
- name: Jessica
org:
name: T'es pas cap
intro: de
website: https://tes-pas-cap-a-gaillon.fr/
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: |
Soucieux de sauvegarder le patrimoine de la région Gaillon Le Val d'Hazey, nous souhaitons bonne réussite à cette association qui œuvre pour la remise en état du site de Bethléem.

View file

@ -7,9 +7,13 @@
</head> </head>
<body> <body>
<div class="footer-push"> <div class="footer-push">
{{ partial "header" . }} {{ if or (not (isset .Params "with_header")) .Params.with_header }}
{{ block "main" . }}{{ end }} {{ partial "header" . }}
{{ end }}
{{ block "main" . }}{{ end }}
</div> </div>
{{ partial "footer" . }} {{ if or (not (isset .Params "with_footer")) .Params.with_footer }}
{{ partial "footer" . }}
{{ end }}
</body> </body>
</html> </html>

View file

@ -0,0 +1,93 @@
{{ define "main" }}
<div class="countdown-page">
<div class="accent-band">
</div>
<div class="launch-logo-back">
{{ partial "helpers/svg" (dict "path" "all_logos/square_notext_white_transparent") }}
</div>
<div class="h-100">
<div class="countdown-page__content__container">
<div class="countdown-page__content">
<div class="countdown__container">
<div class="launch-introduction">
<div>Lancement de la campagne d'adhésion dans...</div>
</div>
<div class="countdown__content">
<div class="timer__element days">
<div class="timer__value" id="days"></div>
<div class="timer__label">jours</div>
</div>
<div class="timer__element timer__separator">
<div class="timer__value">:</div>
<div class="timer__label">0</div>
</div>
<div class="timer__element hours">
<div class="timer__value" id="hours"></div>
<div class="timer__label">heures</div>
</div>
<div class="timer__element timer__separator">
<div class="timer__value">:</div>
<div class="timer__label">0</div>
</div>
<div class="timer__element minutes">
<div class="timer__value" id="minutes"></div>
<div class="timer__label">minutes</div>
</div>
<div class="timer__element timer__separator">
<div class="timer__value">:</div>
<div class="timer__label">0</div>
</div>
<div class="timer__element seconds">
<div class="timer__value" id="seconds"></div>
<div class="timer__label">secondes</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="countdown-footer">
<div class="page-container">
<div class="countdown-footer__logo">
{{ partial "helpers/svg" (dict "path" "all_logos/horizontal_white_transparent") }}
</div>
<div class="socials">
<a href="{{ .Site.Params.socials.facebook }}" class="social-item" aria-label="Groupe facebook">
<div class="social-text">
Retrouvez nous sur facebook
</div>
<div class="social-icon">
{{ partial "helpers/svg" (dict "path" "icons/facebook" "class" "site-footer-socials__logo") }}
</div>
</a>
</div>
</div>
</div>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/luxon/3.3.0/luxon.min.js" integrity="sha512-KKbQg5o92MwtJKR9sfm/HkREzfyzNMiKPIQ7i7SZOxwEdiNCm4Svayn2DBq7MKEdrqPJUOSIpy1v6PpFlCQ0YA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script>
const components = ['days', 'hours', 'minutes', 'seconds']
function render() {
let duration = luxon.DateTime.now().diff(luxon.DateTime.utc(2023, 7, 14, 10, 0, 0), components)
console.log(duration.values)
components.forEach(key => {
document.getElementById(key).innerText = (-duration.values[key]).toString().split(".")[0].padStart(2, "0")
// test with random values
// document.getElementById(key).innerText = (Math.floor(Math.random() * 99)).toString().split(".")[0].padStart(2, "0")
})
}
render()
setInterval(() => {
render()
}, 1000)
</script>
{{ end }}

View file

@ -1,16 +1,16 @@
{{ define "main" }} {{ define "main" }}
<div class="cover__container"> <div class="cover__container">
<div class="cover__back" style="background-image: url('https://share.lefuturiste.fr/u/2478737d-7e5e-42cd-8764-d0136ef83546/cover_v2_01.jpg')"> <div class="cover__back" style="background-image: url('https://share.lefuturiste.fr/u/2478737d-7e5e-42cd-8764-d0136ef83546/cover_v2_01.jpg')">
<video playsinline autoplay muted loop>
<source src="https://static.etoiledebethleem.fr/videos/cover_trailer.webm" type="video/webm">
</video>
</div> </div>
<div class="cover__overlay"> <div class="cover__overlay">
</div> </div>
<div class="cover__content"> <div class="cover__content">
<div class="cover__title-container"> <div class="cover__title-container">
<div class="page-container"> <div class="page-container">
<h1 class="cover__title"> <h1 class="cover__title">Relevons notre Bethléem Normand !</h1>
Sauvons la chapelle
de Bethléem !
</h1>
</div> </div>
</div> </div>
</div> </div>
@ -18,7 +18,7 @@
<div class="accent-separator"> <div class="accent-separator">
</div> </div>
<div class="page-container" style="margin-top: 2rem"> <div class="page-container" style="padding: 2rem 0">
<a class="button">Adhérer !</a> <a class="button">Adhérer !</a>
</div> </div>
@ -35,52 +35,230 @@
{{ partial "pagination.html" . }} {{ partial "pagination.html" . }}
*/}} */}}
<section class="history-section"> {{ $slides_count := 4 }}
<div class="page-container history-summary"> <section class="history-container">
<div class="history-summary__text"> <div class="page-container">
<h2>Bref historique</h2> <h2>Une histoire mouvementée...</h2>
<p> </div>
Aubevoye possède un souvenir de Terre Sainte unique en France et en Europe. Une reproduction exacte de le grotte de la nativité de Bethléem dans laquelle le Sauveur vint au monde. <div class="carousel" aria-label="Histoire de la chapelle">
Ce monument est dû à la magnificence et à la piété du Cardinal de Bourbon, Charles Ier de Bourbon, oncle paternel de Henri IV, qui fut pendant quelques temps proclamé roi de France par les Ligueurs sous le nom de Charles X. <ol class="carousel__viewport">
Archevêque de Rouen de 1550 à 1590, l'éminent prélat qui avait déjà fondé, en 1563, près de son château de Gaillon, la chartreuse de Notre-Dame de Bonne-Esperance (Bourbon-lès-Gaillon), voulut avoir également à portée de sa résidence princière le berceau du Roi des rois.
A cet effet, il envoya deux fois son architecte en Palestine pour lever les plans nécessaires et en 1582, l'édifice était achevé. Le pieux cardinal, qui le désigne lui-même dans ses actes sous le nom de Bethléem, en fit don aux Chartreux avec les terres qui l'environnaient. <!-- Bourbon chateau, une crypte particulière, Les chartreux, Mignot et Villain -->
Aujourd'hui, malheureusement, la chapelle tombe en ruines. Elle est régulièrement dégradée, pillée, vandalisée.
</p> <li id="history__slide0" tabindex="0" class="carousel__slide">
</div> <div class="slide-content history-component__container">
<div class="history-summary__image"> <div class="page-container slide-inner history-component__content">
{{ $image := resources.Get "images/cardinal_charles_de_bourbon.jpg" }} <div class="layout-grid-image third">
<img src="{{ $image.RelPermalink }}" /> <div>
</div> <h3>Charles de Bourbon, un esprit fondateur</h3>
<p>
Il est le fondateur de la chapelle..
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</p>
</div>
<div class="image-container">
{{ $image := resources.Get "images/cardinal_charles_de_bourbon.jpg" }}
<figure class="slide-image image-with-caption">
<img
alt="Portrait de Charles de Bourbon"
src="{{ $image.RelPermalink }}"
/>
<figcaption>Portrait de Charles de Bourbon</figcaption>
</figure>
</div>
</div>
</div>
</div>
<div class="carousel__snapper">
<a href="#history__slide3"
class="carousel__prev">Diapositive précédente</a>
<a href="#history__slide1"
class="carousel__next">Diapositive suivante</a>
</div>
</li>
<li id="history__slide1" tabindex="0" class="carousel__slide">
<div class="slide-content history-component__container">
<div class="page-container slide-inner history-component__content">
<div>
<h3>Une crypte particulière</h3>
<p>
La crypte de la chapelle est un lieu unique : c'est une copie presque parfaite de la crypte de la nativité en Judée.
<!-- Le cardinal ayant envoyé deux fois son architecte en palestine pour faire les relevés, la crypte a Aubevoye est remarquablement similaire à sa jumelle de bethléem -->
</p>
<!-- image: porte d'entré crypte ancienne, je pense faire une double
aussi: petit ange -->
</div>
<div class="image-container double-horizontal-image-container">
<figure class="slide-image image-with-caption">
{{ $image := resources.Get "images/crypte_entree_1.jpg" }}
{{ $caption := "L'entrée de la crypte" }}
<img
alt="{{ $caption }}"
src="{{ $image.RelPermalink }}"
/>
<figcaption>{{ $caption }}</figcaption>
</figure>
<figure class="slide-image image-with-caption">
{{ $image := resources.Get "images/crypte_anges_1.jpg" }}
{{ $caption := "Les anges de la crypte" }}
<img
alt="{{ $caption }}"
src="{{ $image.RelPermalink }}"
/>
<figcaption>{{ $caption }}</figcaption>
</figure>
</div>
</div>
</div>
<div class="carousel__snapper">
<a href="#history__slide0"
class="carousel__prev">Diapositive précédente</a>
<a href="#history__slide2"
class="carousel__next">Diapositive suivante</a>
</div>
</li>
<li id="history__slide2" tabindex="0" class="carousel__slide">
<div class="slide-content history-component__container">
<div class="page-container slide-inner history-component__content">
<div class="layout-grid-image half">
<div>
<h3>Les Chartreux</h3>
<p>
Le cardinal fit don de la chapelle et de sa crypte aux Chartreux d'Aubevoye. Chaque Noël ils se rendèrent en procession à la lueure des torches pour célébrer la messe de minuit dans la crypte sacrée. Ils demandèrent au Cardinal de créer un détachement de la chartreuse à la chapelle.
</p>
<p>
Ils s'occupairent alors du domaine, des vignerons sur les cotaux et de la maintenance de la chapelle jusqu'à la révolution 1791 où ils furent chassés.
</p>
</div>
<div class="image-container">
{{ $image := resources.Get "images/la_chartreuse_1.jpg" }}
<figure class="slide-image image-with-caption">
<img
alt="Église de la chartreuse Bourbons-lez-Gaillon"
src="{{ $image.RelPermalink }}"
/>
<figcaption>Église de la chartreuse Bourbons-lez-Gaillon</figcaption>
</figure>
</div>
</div>
</div>
</div>
<div class="carousel__snapper">
<a href="#history__slide1"
class="carousel__prev">Diapositive précédente</a>
<a href="#history__slide3"
class="carousel__next">Diapositive suivante</a>
</div>
</li>
<li id="history__slide3" tabindex="0" class="carousel__slide">
<div class="slide-content history-component__container">
<div class="page-container slide-inner history-component__content">
<div class="layout-grid-image half">
<div>
<h3>Restauration Mignot et Villain</h3>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
<p>
</div>
<div class="image-container">
{{ $image := resources.Get "images/chapelle_carte_postale_1.jpg" }}
<figure class="slide-image image-with-caption">
<img
alt="Portrait de Charles de Bourbon"
src="{{ $image.RelPermalink }}"
/>
<figcaption>La chapelle en 1912</figcaption>
</figure>
</div>
</div>
</div>
</div>
<div class="carousel__snapper">
<a href="#history__slide2"
class="carousel__prev">Diapositive précédente</a>
<a href="#history__slide0"
class="carousel__next">Diapositive suivante</a>
</div>
</li>
</ol>
<aside class="carousel__navigation">
<ol class="carousel__navigation-list">
{{ range $index, $s := seq $slides_count }}
<li class="carousel__navigation-item {{ if eq $index 0 }}enabled{{- end -}}">
<a href="#history__slide{{ $index }}"
class="carousel__navigation-button">{{ $index }}ème diapositive</a>
</li>
{{ end }}
</ol>
</aside>
</div> </div>
</section> </section>
<section class="images-section">
<h2 class="page-container">Images</h2> <!-- <section class="history-section"> -->
</section> <!-- <div class="page-container history-summary"> -->
<!-- <div class="history-summary__text"> -->
<!-- <h2>Bref historique</h2> -->
<!-- <p> -->
<!-- Aubevoye possède un souvenir de Terre Sainte unique en France et en Europe. Une reproduction exacte de le grotte de la nativité de Bethléem dans laquelle le Sauveur vint au monde. -->
<!-- Ce monument est dû à la magnificence et à la piété du Cardinal de Bourbon, Charles Ier de Bourbon, oncle paternel de Henri IV, qui fut pendant quelques temps proclamé roi de France par les Ligueurs sous le nom de Charles X. -->
<!-- Archevêque de Rouen de 1550 à 1590, l'éminent prélat qui avait déjà fondé, en 1563, près de son château de Gaillon, la chartreuse de Notre-Dame de Bonne-Esperance (Bourbon-lès-Gaillon), voulut avoir également à portée de sa résidence princière le berceau du Roi des rois. -->
<!-- A cet effet, il envoya deux fois son architecte en Palestine pour lever les plans nécessaires et en 1582, l'édifice était achevé. Le pieux cardinal, qui le désigne lui-même dans ses actes sous le nom de Bethléem, en fit don aux Chartreux avec les terres qui l'environnaient. -->
<!-- Aujourd'hui, malheureusement, la chapelle tombe en ruines. Elle est régulièrement dégradée, pillée, vandalisée. -->
<!-- </p> -->
<!-- </div> -->
<!-- <div class="history-summary__image"> -->
<!-- {{ $image := resources.Get "images/cardinal_charles_de_bourbon.jpg" }} -->
<!-- <img src="{{ $image.RelPermalink }}" /> -->
<!-- </div> -->
<!-- </div> -->
<!-- </section> -->
<!-- <section class="images-section"> -->
<!-- <h2 class="page-container">Images</h2> -->
<!-- </section> -->
<section class="compare-section"> <section class="compare-section">
<div class="page-container"> <div class="page-container">
<h2>Un petit bout de palestine en Normandie...</h2> <h2>Un petit bout de palestine en Normandie...</h2>
<div class="compare-items"> <div class="compare-items compare-items-dynamic">
<div class="compare-item"> <div class="compare-item compare-east">
<figure> <figure>
{{ $image := resources.Get "images/crypte_comparaison_01_aubevoye.jpg" }} <div class="compare-duet">
<img class="compare-aubevoye" src="{{ $image.RelPermalink }}" /> <div class="compare-hidden">
{{ $image := resources.Get "images/crypte_comparaison_01_judee.jpg" }}
<img class="" src="{{ $image.RelPermalink }}" />
</div>
{{ $image := resources.Get "images/crypte_comparaison_01_judee.jpg" }} <div class="compare-shown">
<img class="compare-judee" src="{{ $image.RelPermalink }}" /> {{ $image := resources.Get "images/crypte_comparaison_01_aubevoye.jpg" }}
<img class="" src="{{ $image.RelPermalink }}" />
</div>
</div>
<figcaption>Comparaison crypte vers l'est</figcaption> <figcaption>Comparaison de la crypte vers l'est</figcaption>
</figure> </figure>
</div> </div>
<div class="compare-item"> <div class="compare-item compare-west">
<figure> <figure>
{{ $image := resources.Get "images/crypte_comparaison_02_aubevoye.jpg" }} <div class="compare-duet">
<img class="compare-aubevoye" src="{{ $image.RelPermalink }}" /> <div class="compare-hidden">
{{ $image := resources.Get "images/crypte_comparaison_02_judee.jpg" }}
<img class="" src="{{ $image.RelPermalink }}" />
</div>
{{ $image := resources.Get "images/crypte_comparaison_02_judee.jpg" }} <div class="compare-shown">
<img class="compare-judee" src="{{ $image.RelPermalink }}" /> {{ $image := resources.Get "images/crypte_comparaison_02_aubevoye.jpg" }}
<figcaption>Comparaison crypte vers l'ouest</figcaption> <img class="" src="{{ $image.RelPermalink }}" />
</div>
</div>
<figcaption>Comparaison de la crypte vers l'ouest</figcaption>
</figure> </figure>
</figure> </figure>
</div> </div>
@ -135,13 +313,146 @@
<section class="organization-section"> <section class="organization-section">
<div class="page-container"> <div class="page-container">
<h2>L'Étoile de Bethléem</h2> <!-- <div class="organization__image"> -->
<p> <!-- <!-1- {{ $image := resources.Get "images/assemblee_constitutive_ensemble.jpg" }} -1-> -->
Formé en septembre 2022, suite aux efforts des propriétaires et des passionées de ce monument. Elle a pour but de contribuer à la sauvegarde et à la restauration de la Chapelle de Bethléem dAubevoye et de promouvoir ce monument ainsi que mieux le connaitre et lanimer. <!-- <img src="https://picsum.photos/300/300" alt="Assemblée générale constitutive" /> -->
</p> <!-- </div> -->
<p> <div class="organization__explain">
Lassociation “LÉtoile de Bethléem - Association des amis de la chapelle de bethléem dAubevoye” est immatriculé au près de la préfecture de lEure sous le numéro RNA W271006556. <h2>L'association : L'Étoile de Bethléem</h2>
</p> <p>
Formé en septembre 2022, suite aux efforts des propriétaires et des passionées de ce monument. Elle a pour but de contribuer à la sauvegarde et à la restauration de la Chapelle de Bethléem dAubevoye et de promouvoir ce monument ainsi que mieux le connaitre et lanimer.
</p>
<p>
Lassociation “LÉtoile de Bethléem - Association des amis de la chapelle de bethléem dAubevoye” est immatriculé au près de la préfecture de lEure sous le numéro RNA W271006556.
</p>
</div>
</div>
</section>
<section class="news-section">
<div class="news-presentation">
{{ $pages := where .Site.RegularPages "Type" "in" "actualites" }}
{{ $pag := .Paginate ($pages) }}
{{ range $index, $element := $pag.Pages }}
{{ if eq $index 0 }}
{{ $featuredImage := (resources.Get (printf "%s" ("cover/cover.jpg" | safeURL))) }}
{{ with .Params.featured_image }}
{{ $featuredImage = .Resources.GetMatch (.src | safeURL) }}
{{ end }}
{{ $featuredImage := $featuredImage.Resize "450x" }}
<div
class="prominent-article article-card"
>
<div
class="article__background"
style="background-image: url('{{ $featuredImage.RelPermalink }}')"
>
</div>
<div
class="article__background-overlay"
>
</div>
<div class="article__content page-container">
<div class="article__pre">
Dernières nouvelles...
</div>
<h2 class="article__title">
<a href="{{ .RelPermalink }}">{{ .Title }}</a>
</h2>
<div class="article__meta">
Le {{ .Date.Format "Monday 2 January 2006" }}
</div>
<div class="article__summary">
{{ .Summary }}
</div>
<div class="article__bottom">
<a
href="{{ .RelPermalink }}"
class="article__readmore button button-transparent"
>
Lire plus
</a>
</div>
</div>
</div>
{{ end }}
{{ end }}
<!-- <div class="prominent-article"> -->
<!-- <div class="prominent-article__image"> -->
<!-- </div> -->
<!-- <div class="prominent-article__content"> -->
<!-- <div class="prominent-article__title"> -->
<!-- </div> -->
<!-- <div class="prominent-article__summary"> -->
<!-- </div> -->
<!-- <div class="prominent-article__meta"> -->
<!-- </div> -->
<!-- </div> -->
<!-- </div> -->
<div class="page-container">
Others articles...
</div>
</div>
</section>
{{ $slides_count := len $.Site.Data.partners.people }}
<section class="partners-container">
<div class="page-container">
<h2>Ils nous soutiennent !</h2>
</div>
<div class="carousel" aria-label="Partners">
<ol class="carousel__viewport">
{{ range $index, $comment := $.Site.Data.partners.people }}
<li id="partners__slide{{ $index }}"
tabindex="0"
class="carousel__slide">
<div class="slide-content partner-comment__container">
<div class="slide-inner partner-comment">
{{ $image := resources.Get (printf "images/partners/%s" $comment.image) }}
<a class="partner-comment__author-link" href="{{ $comment.org.website }}">
<img class="partner-comment__author-picture" alt="Photo d'un de nos soutiens" src="{{ $image.RelPermalink }}" />
</a>
<div class="partner-comment__quote-container">
<div class="quote-decoration quote-before">
{{ partial "helpers/svg" (dict "path" "icons/quote") }}
</div>
<p>
{{ $comment.quote }}
</p>
<div class="quote-decoration quote-after">
{{ partial "helpers/svg" (dict "path" "icons/quote") }}
</div>
</div>
<div class="partner-comment__author">
<div class="partner-comment__author-name">
{{ with $comment.name }}{{ . }}{{ end }} {{ with $comment.org.intro }}{{ . }}{{ end }} {{ $comment.org.name }}
</div>
</div>
</div>
</div>
<div class="carousel__snapper">
<a href="#partners__slide{{ partial "fullmod" (slice (sub $index 1) $slides_count) }}"
class="carousel__prev">Diapositive précédente</a>
<a href="#partners__slide{{ partial "fullmod" (slice (add $index 1) $slides_count) }}"
class="carousel__next">Diapositive suivante</a>
</div>
</li>
{{ end }}
</ol>
<aside class="carousel__navigation">
<ol class="carousel__navigation-list">
{{ range $index, $s := seq $slides_count }}
<li class="carousel__navigation-item {{ if eq $index 0 }}enabled{{- end -}}">
<a href="#partners__slide{{ $index }}"
class="carousel__navigation-button">{{ $index }}ème diapositive</a>
</li>
{{ end }}
</ol>
</aside>
</div> </div>
</section> </section>
</main> </main>
@ -154,4 +465,9 @@
</div> </div>
<div class="page-container"> <div class="page-container">
</div> </div>
{{ $js := resources.Get "scripts/carousel.js" | js.Build (dict "params" (dict "api" "https://example.org/api")) }}
<script defer src="{{ $js.Permalink }}"></script>
{{ end }} {{ end }}

View file

@ -1,170 +0,0 @@
{{ define "main" }}
<div class="cover__container">
<div class="cover__back" style="background-image: url('https://share.lefuturiste.fr/u/2478737d-7e5e-42cd-8764-d0136ef83546/cover_v2_01.jpg')">
</div>
<div class="cover__overlay">
</div>
<div class="cover__content">
<div class="cover__title-container">
<div class="page-container">
<h1 class="cover__title">
Sauvons la chapelle
de Bethléem !
</h1>
</div>
</div>
</div>
</div>
<div class="accent-separator">
</div>
<div class="page-container" style="margin-top: 2rem">
<a class="button">Adhérer !</a>
</div>
<main class="landing-main">
<!-- <div style="display: flex; justify-content: center; font-size: 1.3em; border: 1px dashed gray; padding: 1rem;"> -->
<!-- 🚧 Site en construction... 🚧 -->
<!-- </div> -->
{{/* .Content */}}
{{/*
{{ $paginator := .Paginate (where .Site.RegularPages "Type" "in" .Site.Params.mainSections) }}
{{ range $paginator.Pages }}
{{ .Render "summary" }}
{{ end }}
{{ partial "pagination.html" . }}
*/}}
<section class="history-section">
<div class="page-container history-summary">
<div class="history-summary__text">
<h2>Bref historique</h2>
<p>
Aubevoye possède un souvenir de Terre Sainte unique en France et en Europe. Une reproduction exacte de le grotte de la nativité de Bethléem dans laquelle le Sauveur vint au monde.
Ce monument est dû à la magnificence et à la piété du Cardinal de Bourbon, Charles Ier de Bourbon, oncle paternel de Henri IV, qui fut pendant quelques temps proclamé roi de France par les Ligueurs sous le nom de Charles X.
Archevêque de Rouen de 1550 à 1590, l'éminent prélat qui avait déjà fondé, en 1563, près de son château de Gaillon, la chartreuse de Notre-Dame de Bonne-Esperance (Bourbon-lès-Gaillon), voulut avoir également à portée de sa résidence princière le berceau du Roi des rois.
A cet effet, il envoya deux fois son architecte en Palestine pour lever les plans nécessaires et en 1582, l'édifice était achevé. Le pieux cardinal, qui le désigne lui-même dans ses actes sous le nom de Bethléem, en fit don aux Chartreux avec les terres qui l'environnaient.
Aujourd'hui, malheureusement, la chapelle tombe en ruines. Elle est régulièrement dégradée, pillée, vandalisée.
</p>
</div>
<div class="history-summary__image">
{{ $image := resources.Get "images/cardinal_charles_de_bourbon.jpg" }}
<img src="{{ $image.RelPermalink }}" />
</div>
</div>
</section>
<section class="images-section">
<h2 class="page-container">Images</h2>
</section>
<section class="compare-section">
<div class="page-container">
<h2>Un petit bout de palestine en Normandie...</h2>
<div class="compare-items compare-items-dynamic">
<div class="compare-item compare-east">
<figure>
<div class="compare-duet">
<div class="compare-hidden">
{{ $image := resources.Get "images/crypte_comparaison_01_judee.jpg" }}
<img class="" src="{{ $image.RelPermalink }}" />
</div>
<div class="compare-shown">
{{ $image := resources.Get "images/crypte_comparaison_01_aubevoye.jpg" }}
<img class="" src="{{ $image.RelPermalink }}" />
</div>
</div>
<figcaption>Comparaison crypte vers l'est</figcaption>
</figure>
</div>
<div class="compare-item compare-west">
<figure>
<div class="compare-duet">
<div class="compare-hidden">
{{ $image := resources.Get "images/crypte_comparaison_02_judee.jpg" }}
<img class="" src="{{ $image.RelPermalink }}" />
</div>
<div class="compare-shown">
{{ $image := resources.Get "images/crypte_comparaison_02_aubevoye.jpg" }}
<img class="" src="{{ $image.RelPermalink }}" />
</div>
</div>
<figcaption>Comparaison crypte vers l'ouest</figcaption>
</figure>
</figure>
</div>
</div>
</div>
</section>
<section class="timeline-section">
<div class="page-container history-section timeline-container">
<div class="timeline">
<div class="timeline-item timeline-back-decoration">
<div class="timeline-item__inner">
<div class="timeline-item__dot-container">
<div class="timeline-trace"></div>
</div>
<div class="timeline-item__summary">
</div>
</div>
<div></div>
</div>
<div class="timeline-list">
<div class="timeline-item">
<div class="timeline-item__inner">
<div class="timeline-item__dot-container">
<div class="timeline-item__dot"></div>
</div>
<div class="timeline-item__summary">
1970
</div>
</div>
<div class="timeline-item__content card">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
</div>
</div>
<div class="timeline-item">
<div class="timeline-item__inner">
<div class="timeline-item__dot-container">
<div class="timeline-item__dot"></div>
</div>
<div class="timeline-item__summary">
1970
</div>
</div>
<div class="timeline-item__content card">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
</div>
</div>
</div>
</div>
</div>
</section>
<section class="organization-section">
<div class="page-container">
<h2>L'Étoile de Bethléem</h2>
<p>
Formé en septembre 2022, suite aux efforts des propriétaires et des passionées de ce monument. Elle a pour but de contribuer à la sauvegarde et à la restauration de la Chapelle de Bethléem dAubevoye et de promouvoir ce monument ainsi que mieux le connaitre et lanimer.
</p>
<p>
Lassociation “LÉtoile de Bethléem - Association des amis de la chapelle de bethléem dAubevoye” est immatriculé au près de la préfecture de lEure sous le numéro RNA W271006556.
</p>
</div>
</section>
</main>
<div class="separation-section secondary-bg">
<div class="page-container">
<h2>Rejoignez nous dans notre aventure !</h2>
<a class="button">Adhérer !</a>
</div>
</div>
<div class="page-container">
</div>
{{ end }}

View file

@ -0,0 +1,4 @@
{{- $a := index . 0 -}}
{{- $b := index . 1 -}}
{{- $c := mod $a $b -}}
{{- if lt $c 0 -}}{{- add $c $b -}}{{- else -}}{{- $c -}}{{- end -}}

View file

@ -7,12 +7,22 @@
<!-- src="{{ $image.RelPermalink }}" /> --> <!-- src="{{ $image.RelPermalink }}" /> -->
</a> </a>
<nav class="site-header__nav desktop-nav"> <nav class="site-header__nav desktop-nav">
{{ if eq .File.Dir "/" }}
<ul class="inline-menu-list">
<li><a href="#association">L'association</a></li>
<li><a href="#histoires">Histoire</a></li>
<li><a href="#images">Galerie</a></li>
<li><a href="#actualites">Actualités</a></li>
</ul>
{{ end }}
{{ if not (eq .File.Dir "/") }}
<ul class="inline-menu-list"> <ul class="inline-menu-list">
<li><a href="/actualites">Actualités</a></li> <li><a href="/actualites">Actualités</a></li>
<li><a href="/association">L'association</a></li> <li><a href="/association">L'association</a></li>
<li><a href="/histoires">Histoire</a></li> <li><a href="/histoires">Histoire</a></li>
<li><a href="/images">Galerie</a></li> <li><a href="/images">Galerie</a></li>
</ul> </ul>
{{ end }}
</nav> </nav>
<div class="burger-menu"> <div class="burger-menu">
<div class="burger-button-container"> <div class="burger-button-container">

View file

@ -0,0 +1,9 @@
{{ define "main" }}
<h1>Sandbox 1</h1>
<pre>
{{ mod -1 2 }}
{{ partial "fullmod" (slice -1 5) }}
</pre>
{{ end }}

View file

@ -0,0 +1,2 @@
{{ $c := mod (.Get 0) (.Get 1) }}
{{ if lt $c 0 }}{{ add (.Get 1) $c }}{{ else }}{{ $c }}{{ end }}