diff --git a/assets/images/all_logos/horizontal_text_yellow_on_white_transparent_cropped.svg b/assets/images/all_logos/horizontal_text_yellow_on_white_transparent_cropped.svg new file mode 100644 index 0000000..977fbd2 --- /dev/null +++ b/assets/images/all_logos/horizontal_text_yellow_on_white_transparent_cropped.svg @@ -0,0 +1,96 @@ + + + + + + + + + + + + + + + l’Étoile + de Bethléem + diff --git a/assets/images/all_logos/horizontal_text_yellow_on_white_transparent_md.png b/assets/images/all_logos/horizontal_text_yellow_on_white_transparent_md.png new file mode 100644 index 0000000..86f14d5 Binary files /dev/null and b/assets/images/all_logos/horizontal_text_yellow_on_white_transparent_md.png differ diff --git a/assets/images/all_logos/horizontal_white_transparent_cropped.svg b/assets/images/all_logos/horizontal_white_transparent_cropped.svg new file mode 100644 index 0000000..aa03138 --- /dev/null +++ b/assets/images/all_logos/horizontal_white_transparent_cropped.svg @@ -0,0 +1,102 @@ + + + + + + + + + + + + + + + + + l’Étoile + + de Bethléem + + diff --git a/assets/images/cover_1.jpg b/assets/images/cover_1.jpg new file mode 100644 index 0000000..e3eebd8 Binary files /dev/null and b/assets/images/cover_1.jpg differ diff --git a/assets/images/icons/old_tv_3d.svg b/assets/images/icons/old_tv_3d.svg new file mode 100644 index 0000000..cb6cd7f --- /dev/null +++ b/assets/images/icons/old_tv_3d.svg @@ -0,0 +1,199 @@ + + + + diff --git a/assets/images/icons/press.svg b/assets/images/icons/press.svg new file mode 100644 index 0000000..01c77e1 --- /dev/null +++ b/assets/images/icons/press.svg @@ -0,0 +1,214 @@ + + + + diff --git a/assets/sass/alert.scss b/assets/sass/alert.scss new file mode 100644 index 0000000..ff2b351 --- /dev/null +++ b/assets/sass/alert.scss @@ -0,0 +1,23 @@ +.alert { + border: 2px solid $accent; + background-color: darken($accent, 10%); + color: white; + border-radius: 3px; + padding: 1rem 2rem; + margin: 1rem 0; + + width: 100%; + + .alert-split-content { + display: flex; + justify-content: space-between; + } +} + +@media (max-width: $md-breakpoint) { + .alert { + .alert-split-content { + display: block; + } + } +} diff --git a/assets/sass/article.scss b/assets/sass/article.scss index d8ad60e..d767661 100644 --- a/assets/sass/article.scss +++ b/assets/sass/article.scss @@ -10,59 +10,88 @@ } } -.article { +.article-card { + display: flex; + background-color: rgba(0, 0, 0, 0.2); + margin-bottom: 1rem; + + .article__image { + display: block; + margin-right: 0rem; + overflow: hidden; + height: 210px; + width: 300px; + flex-grow: 0; + flex-shrink: 0; + img { + height: 100%; + width: 100%; + object-fit: cover; + transition: all 1s ease-in-out; + } + + img:hover { + transform: scale(1.2); + } + } + .article__title { + color: white; + margin-bottom: 0.5rem; + margin-top: 1.5rem; + font-size: 1.5rem; + a { + color: white; + text-decoration: none; + } + } + .article__meta { + margin-bottom: 0.2rem; + opacity: 0.8; + } + .article__bottom { + display: flex; + justify-content: end; + } + .article__content { + padding: 0rem 2rem; + padding-bottom: 0.2rem; + } + .article__readmore.link { + padding: 1rem; + } } .prominent-article { position: relative; overflow: hidden; + display: grid; + grid-template-columns: 1fr 1fr; - .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__image { + height: 100% !important; + min-height: 100% !important; + width: 500px; + margin-right: 0rem; } - - .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; + padding: 2rem; + width: 100%; .article__title { - color: white; - a { - color: white; - text-decoration: none; - } - } - .article__summary { + margin-bottom: 1.5rem; } .article__meta { margin-bottom: 1rem; - opacity: 0.8; } - .article__bottom { - display: flex; - justify-content: end; + .article__summary { + padding-bottom: 1rem; } .article__readmore { border: 1px solid white; + } } @@ -81,3 +110,20 @@ .right-floating-image { float: right; } + +@media (max-width: $sm-breakpoint) { + .prominent-article { + .article__title { + margin-top: 1rem; + } + } + .article-card { + display: block; + + .article__image { + width: 100%; + } + } + +} + diff --git a/assets/sass/carousel.scss b/assets/sass/carousel.scss index 96186b7..54c7086 100644 --- a/assets/sass/carousel.scss +++ b/assets/sass/carousel.scss @@ -360,7 +360,7 @@ $height: 30rem; padding-top: 0rem; } .slide-image { - height: 13rem; + height: 16rem; } } } diff --git a/assets/sass/footer.scss b/assets/sass/footer.scss index 5160e20..f7e7fd6 100644 --- a/assets/sass/footer.scss +++ b/assets/sass/footer.scss @@ -6,6 +6,8 @@ body { min-height: 100%; display: flex; flex-direction: column; + + overflow-x: hidden; } .footer-push { diff --git a/assets/sass/general.scss b/assets/sass/general.scss index cc1bd96..cf1efda 100644 --- a/assets/sass/general.scss +++ b/assets/sass/general.scss @@ -82,6 +82,10 @@ a:hover { height: 100%; } +.mr-1 { + margin-right: 1rem; +} + img { max-width: 100%; object-fit: contain; diff --git a/assets/sass/header.scss b/assets/sass/header.scss index 74ec7fc..7ba2d6c 100644 --- a/assets/sass/header.scss +++ b/assets/sass/header.scss @@ -4,6 +4,10 @@ $header-height: 6rem; background: $background; color: white; height: $header-height; + + position: sticky; + top: 0; + z-index: 90; } .site-header__content { @@ -157,7 +161,7 @@ $header-height: 6rem; width: 100%; opacity: 1; // transition: opacity 0.8s ease-in-out; - animation: navin 1s ease-in-out; + animation: navin .5s ease-in-out; } /* */ diff --git a/assets/sass/landing.scss b/assets/sass/landing.scss index 05c2d0c..526a185 100644 --- a/assets/sass/landing.scss +++ b/assets/sass/landing.scss @@ -38,8 +38,6 @@ justify-content: flex-end; } - - .cover__overlay { position: absolute; width: 100%; @@ -49,6 +47,65 @@ background-color: rgba(14, 14, 14, 0.2); } +.dark-section { + background-color: #025E73; + color: white; + box-shadow: inset 0px 0px 20px 10px rgba(0,0,0,0.2); + + h2 { + color: white; + } +} + +.trailer-section { + @extend .dark-section; + + .video { + z-index: 3; + position: relative; + } +} + +.landing-section { + @extend .dark-section; + position: relative; + .side-icon { + position: absolute; + + z-index: 1; + left: 20px; + bottom: -100px; + opacity: 0.4; + svg { + width: 300px; + } + } + + .section-title { + padding-top: 2rem; + } +} + +.news-section { + + .side-icon { + left: -50px; + bottom: -75px; + svg { + width: 500px; + opacity: 0.3; + } + } + .separator { + width: 100%; + border: 1px solid rgba(255, 255, 255, 0.2); + margin: 1rem 0; + } + .article-cards { + margin-bottom: 1rem; + } +} + @keyframes cover_title_in { 0% { left: -10rem; @@ -100,7 +157,7 @@ @media (min-width: $lg-breakpoint) { .cover__back { background-position-x: center; - background-position-y: -1.5rem; + // background-position-y: -1.5rem; } } @@ -287,5 +344,9 @@ @media (max-width: $md-breakpoint) { .history-container { } + + .side-icon { + display: none; + } } diff --git a/assets/sass/main.scss b/assets/sass/main.scss index a8a5387..ebb8898 100644 --- a/assets/sass/main.scss +++ b/assets/sass/main.scss @@ -43,4 +43,5 @@ $hidden: #2C3E50; @import 'tags.scss'; @import 'card.scss'; @import 'sliding_gallery.scss'; +@import 'alert.scss'; diff --git a/content/actualites/fake-1/crypte_500ans.jpg b/content/actualites/fake-1/crypte_500ans.jpg new file mode 100644 index 0000000..b1e0093 Binary files /dev/null and b/content/actualites/fake-1/crypte_500ans.jpg differ diff --git a/content/actualites/fake-1/index.md b/content/actualites/fake-1/index.md index e093848..a0474ef 100644 --- a/content/actualites/fake-1/index.md +++ b/content/actualites/fake-1/index.md @@ -1,6 +1,8 @@ --- title: Annonce des visites de la chapelle date: 2023-02-21 +featured_image: + src: crypte_500ans.jpg --- 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.🙏 diff --git a/content/actualites/fake-2/index.md b/content/actualites/fake-2/index.md index 6267824..ccaa804 100644 --- a/content/actualites/fake-2/index.md +++ b/content/actualites/fake-2/index.md @@ -1,6 +1,8 @@ --- title: Partenariat entre X et Y pour faire Z date: 2023-06-15 +featured_image: + src: lumiere_bethleem.jpg --- 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.🙏 diff --git a/content/actualites/fake-2/lumiere_bethleem.jpg b/content/actualites/fake-2/lumiere_bethleem.jpg new file mode 100644 index 0000000..24989af Binary files /dev/null and b/content/actualites/fake-2/lumiere_bethleem.jpg differ diff --git a/content/histoires/_index.md b/content/histoires/_index.md index 0872b46..f7d32c8 100644 --- a/content/histoires/_index.md +++ b/content/histoires/_index.md @@ -6,3 +6,15 @@ Raconte nous une histoire... Ici vous trouverez des billets/chroniques parlant de l'histoire de la chapelle et de son environnement. +## Historique détaillé de la chapelle + +- 1550 : [Charles Ier de Bourbon](https://fr.wikipedia.org/wiki/Charles_Ier_de_Bourbon_(archev%C3%AAque_de_Rouen)) est nommé archévèque de Rouen +- 1563 : [La Chartreuse d'Aubevoye](https://fr.wikipedia.org/wiki/Chartreuse_d'Aubevoye) est fondé. + +Le Cardinal Bourbon envoya par 2 fois son architecte Pierre Marchant + +- 1576 : début de la construction de la chapelle et de sa crypte. +- 1582 : la chapelle et ses dépendances sont données aux chartreux qui en font une dépendances, des moines viennent hermiter et vivre à coté de la chapelle + + + diff --git a/content/images/12/index.md b/content/images/12/index.md index d59e93c..503c10b 100644 --- a/content/images/12/index.md +++ b/content/images/12/index.md @@ -6,5 +6,6 @@ imtags: - crypte - entrée-crypte inception: 1896 +author: M. Raveton --- diff --git a/layouts/index.html b/layouts/index.html index ae24a5b..4944d3c 100644 --- a/layouts/index.html +++ b/layouts/index.html @@ -1,10 +1,14 @@ {{ define "main" }}
-
- + {{ $cover := (resources.Get (printf "%s" ("images/cover_1.jpg" | safeURL))) }} + {{ with $cover }} +
+ + + +
+ {{ end }}
@@ -19,22 +23,50 @@
-

Campagne d'adhésion 2024, nous avons besoin de vous !

- Adhérer ! +
+
+

Campagne d'adhésion 2024, nous avons besoin de vous !

+ Adhérer +
+
- {{/* .Content */}} - {{/* - {{ $paginator := .Paginate (where .Site.RegularPages "Type" "in" .Site.Params.mainSections) }} - {{ range $paginator.Pages }} - {{ .Render "summary" }} - {{ end }} - {{ partial "pagination.html" . }} - */}} +
+
+
+

Regardez la vidéo de présentation

+
+ {{ partial "helpers/svg" (dict "path" "icons/old_tv_3d") }} +
+ +
+ + Sur youtube + + + Sur Peertube + +
+
+
+
{{ $slides_count := 6 }}
@@ -337,51 +369,6 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- 1970 -
-
-
- 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. -
-
-
-
-
-
-
-
- 1970 -
-
-
- 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. -
-
-
-
-
-
-
@@ -404,71 +391,95 @@
-
-
- {{ $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" }} -
-
-
-
-
-
-
- Dernières nouvelles... -
-

- {{ .Title }} -

-
- Le {{ .Date.Format "Monday 2 January 2006" }} -
-
- {{ .Summary }} -
-
- - Lire plus - -
-
-
- {{ end }} - {{ end }} - - - - - - - - - - - - +
+
+ {{ partial "helpers/svg" (dict "path" "icons/press") }} +
-
- Others articles... + +
+

+ Les dernières nouvelles… +

+
+ {{ $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" }} +
+ + {{ with $featuredImage }} + + {{ end }} + +
+

+ {{ .Title }} +

+
+ Le {{ time.Format "Monday 2 January 2006" .Date }} +
+
+ {{ .Summary | truncate 250 }} +
+
+ + Lire plus + +
+
+
+ {{ end }}{{ end }}
+
+ +
+ {{ range $index, $element := $news }}{{ if (and (gt $index 0) (lt $index 3)) }} + {{ $featuredImage := (resources.Get (printf "%s" ("cover/cover.jpg" | safeURL))) }} + {{ with $element.Params.featured_image }} + {{ $featuredImage = $element.Resources.GetMatch .src }} + {{ end }} + {{ $featuredImage := $featuredImage.Resize "fit 700x" }} +
+ + {{ with $featuredImage }} + + {{ end }} + +
+

+ {{ .Title }} +

+
+ Le {{ time.Format "Monday 2 January 2006" .Date }} +
+
+ {{ .Summary | truncate 100 }} +
+
+ + Lire plus + +
+
+
+ {{ end }}{{ end }} +
+
diff --git a/layouts/partials/header.html b/layouts/partials/header.html index ef87dce..bc9aaae 100644 --- a/layouts/partials/header.html +++ b/layouts/partials/header.html @@ -2,9 +2,6 @@
{{ partial "helpers/svg" (dict "path" "all_logos/horizontal_white_transparent" "class" "site-header__logo") }} - - -