etoiledebethleem/website
4
1
Fork 0
Code Issues 5 Pull requests 1 Projects 1 Releases Packages Activity Actions

Landing page + countdown #11

Merged
mbess merged 11 commits from fb_initial_landing_page into master 2023-07-06 20:36:36 +00:00
Conversation 2 Commits 11 Files changed 40 +41 -24
3 changed files with 41 additions and 24 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files
Showing only changes of commit ab7f67d4ba - Show all commits

38
assets/sass/landing.scss
View file

@ -1,18 +1,31 @@
.cover__container {
margin-top: 1px;
position: relative;
min-height: 40rem;
min-height: 50rem;
}
.cover__back {
position: absolute;
height: 100%;
width: 100%;
overflow: hidden;
background-size: cover;
background-repeat: no-repeat;
background-position-x: center;
background-position-y: center;
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 {
@ -79,6 +92,11 @@
@import 'landing/timeline.scss';
@media (max-width: $lg-breakpoint) {
.cover__back {
}
}
@media (min-width: $lg-breakpoint) {
.cover__back {
background-position-x: center;
@ -263,22 +281,6 @@
@media (max-width: $md-breakpoint) {
.history-container {
.layout-grid-image.third {
display: block;
}
.image-container {
display: flex;
justify-content: center;
}
.slide-image {
height: 19rem;
img {
width: auto;
height: 100%;
}
}
}
}

15
layouts/index.html
View file

@ -1,6 +1,9 @@
{{ 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')">
<video playsinline autoplay muted loop>
<source src="https://static.etoiledebethleem.fr/videos/cover_trailer.webm" type="video/webm">
</video>
</div>
<div class="cover__overlay">
</div>
@ -15,7 +18,7 @@
<div class="accent-separator">
</div>
<div class="page-container" style="margin-top: 2rem">
<div class="page-container" style="padding: 2rem 0">
<a class="button">Adhérer !</a>
</div>
@ -310,10 +313,10 @@
<section class="organization-section">
<div class="page-container">
<div class="organization__image">
<!-- {{ $image := resources.Get "images/assemblee_constitutive_ensemble.jpg" }} -->
<img src="https://picsum.photos/300/300" alt="Assemblée générale constitutive" />
</div>
<!-- <div class="organization__image"> -->
<!-- <!-1- {{ $image := resources.Get "images/assemblee_constitutive_ensemble.jpg" }} -1-> -->
<!-- <img src="https://picsum.photos/300/300" alt="Assemblée générale constitutive" /> -->
<!-- </div> -->
<div class="organization__explain">
<h2>L'association : L'Étoile de Bethléem</h2>
<p>
@ -388,8 +391,10 @@
<!-- </div> -->
<!-- </div> -->
<div class="page-container">
Others articles...
</div>
</div>
</section>

10
layouts/partials/header.html
View file

@ -7,12 +7,22 @@
<!-- src="{{ $image.RelPermalink }}" /> -->
</a>
<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">
<li><a href="/actualites">Actualités</a></li>
<li><a href="/association">L'association</a></li>
<li><a href="/histoires">Histoire</a></li>
<li><a href="/images">Galerie</a></li>
</ul>
{{ end }}
</nav>
<div class="burger-menu">
<div class="burger-button-container">