fix(Landing): cover title background
This commit is contained in:
parent
81a5802dbf
commit
bf987e19ad
3 changed files with 15 additions and 14 deletions
|
@ -20,17 +20,13 @@
|
||||||
position: absolute;
|
position: absolute;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
}
|
|
||||||
|
|
||||||
.cover__content .page-container {
|
|
||||||
display: flex;
|
display: flex;
|
||||||
height: 100%;
|
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
justify-content: flex-end;
|
justify-content: flex-end;
|
||||||
padding-bottom: 1em;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
.cover__overlay {
|
.cover__overlay {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
@ -51,7 +47,10 @@
|
||||||
|
|
||||||
.cover__title-container {
|
.cover__title-container {
|
||||||
position: relative;
|
position: relative;
|
||||||
|
padding-top: 1rem;
|
||||||
|
padding-bottom: 1rem;
|
||||||
animation: cover_title_in 0.5s cubic-bezier(.39,.58,.57,1);
|
animation: cover_title_in 0.5s cubic-bezier(.39,.58,.57,1);
|
||||||
|
background-color: rgba(1, 1, 1, 0.5);
|
||||||
}
|
}
|
||||||
|
|
||||||
.cover__title {
|
.cover__title {
|
||||||
|
@ -59,12 +58,10 @@
|
||||||
color: white;
|
color: white;
|
||||||
font-size: 3em;
|
font-size: 3em;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
margin-bottom: 0.3em;
|
margin-bottom: 0;
|
||||||
z-index: 2;
|
z-index: 2;
|
||||||
// position: absolute;
|
// position: absolute;
|
||||||
display: inline;
|
display: block;
|
||||||
padding: 0.4rem 0.75rem;
|
|
||||||
background: rgba(1, 1, 1, 0.5);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.cover__backdrop {
|
.cover__backdrop {
|
||||||
|
|
7
content/sandbox/_index.md
Normal file
7
content/sandbox/_index.md
Normal file
|
@ -0,0 +1,7 @@
|
||||||
|
---
|
||||||
|
title: "Timeline"
|
||||||
|
date: 2022-09-14T16:43:45+02:00
|
||||||
|
draft: true
|
||||||
|
---
|
||||||
|
|
||||||
|
## Timeline
|
|
@ -1,19 +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')">
|
||||||
</div>
|
</div>
|
||||||
<div class="cover__overlay">
|
<div class="cover__overlay">
|
||||||
</div>
|
</div>
|
||||||
<div class="cover__content">
|
<div class="cover__content">
|
||||||
<div class="page-container">
|
<div class="cover__title-container">
|
||||||
<div class="cover__title-container">
|
<div class="page-container">
|
||||||
<h1 class="cover__title">
|
<h1 class="cover__title">
|
||||||
Sauvons la chapelle
|
Sauvons la chapelle
|
||||||
de Bethléem !
|
de Bethléem !
|
||||||
</h1>
|
</h1>
|
||||||
<div class="cover__backdrop">
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
Loading…
Reference in a new issue