coup de polish

This commit is contained in:
Valentin 2024-11-08 06:12:36 +01:00
parent 217b84c755
commit cd3b47e913
15 changed files with 265 additions and 168 deletions

View File

@ -59,19 +59,36 @@ a {
}
} */
body {
height: 100vh;
overflow: scroll;
overflow-x: hidden;
}
body > .dialog-off-canvas-main-canvas {
body .layout-container {
position: relative;
display: flex;
flex-direction: column;
}
body .layout-container header {
z-index: 2;
}
body .layout-container main {
z-index: 1;
padding: 0.5rem;
}
@media screen and (min-width: 760px) {
body .layout-container main {
padding: 0;
}
}
body .layout-container footer {
z-index: 0;
}
body .layout-container #background {
z-index: -1;
}
html {
overflow-x: hidden;
}
.layout-container {
display: flex;
overflow: hidden;
}
main:has(#block-erabletheme-leprogramme-2),
@ -102,19 +119,9 @@ em {
border: solid 1px red !important;
} */
/* PARTIALS */
/*
body.toolbar-tray-open header[role="banner"] {
left: 15rem !important;
width: calc(100% - 15rem) !important;
} */
body.toolbar-fixed header[role=banner] {
top: 2.4em !important;
}
.layout-container header[role=banner] {
width: 100%;
background-color: white;
z-index: 99;
}
@media (min-width: 1080px) {
.layout-container header[role=banner] {
@ -451,7 +458,6 @@ body.toolbar-fixed header[role=banner] {
.layout-container > footer {
width: 100%;
background-color: white;
z-index: 99;
margin-top: 50px;
padding: 0 3vw;
}
@ -906,10 +912,10 @@ main.main-login .login, main.main-login .user, main.main-login .register, main.m
background-color: white;
}
main.main-login .login > h2, main.main-login .user > h2, main.main-login .register > h2, main.main-login .contact > h2, main.main-login .ask > h2, main.main-login .add-offre > h2, main.main-user .login > h2, main.main-user .user > h2, main.main-user .register > h2, main.main-user .contact > h2, main.main-user .ask > h2, main.main-user .add-offre > h2, main.main-register .login > h2, main.main-register .user > h2, main.main-register .register > h2, main.main-register .contact > h2, main.main-register .ask > h2, main.main-register .add-offre > h2, main.main-contact .login > h2, main.main-contact .user > h2, main.main-contact .register > h2, main.main-contact .contact > h2, main.main-contact .ask > h2, main.main-contact .add-offre > h2, main.main-ask .login > h2, main.main-ask .user > h2, main.main-ask .register > h2, main.main-ask .contact > h2, main.main-ask .ask > h2, main.main-ask .add-offre > h2, main.main-add-offre .login > h2, main.main-add-offre .user > h2, main.main-add-offre .register > h2, main.main-add-offre .contact > h2, main.main-add-offre .ask > h2, main.main-add-offre .add-offre > h2 {
text-align: center;
font-family: "Barlow", sans-serif;
color: black;
font-size: 1.2rem;
text-align: center;
}
@media (min-width: 760px) {
main.main-login .login > h2, main.main-login .user > h2, main.main-login .register > h2, main.main-login .contact > h2, main.main-login .ask > h2, main.main-login .add-offre > h2, main.main-user .login > h2, main.main-user .user > h2, main.main-user .register > h2, main.main-user .contact > h2, main.main-user .ask > h2, main.main-user .add-offre > h2, main.main-register .login > h2, main.main-register .user > h2, main.main-register .register > h2, main.main-register .contact > h2, main.main-register .ask > h2, main.main-register .add-offre > h2, main.main-contact .login > h2, main.main-contact .user > h2, main.main-contact .register > h2, main.main-contact .contact > h2, main.main-contact .ask > h2, main.main-contact .add-offre > h2, main.main-ask .login > h2, main.main-ask .user > h2, main.main-ask .register > h2, main.main-ask .contact > h2, main.main-ask .ask > h2, main.main-ask .add-offre > h2, main.main-add-offre .login > h2, main.main-add-offre .user > h2, main.main-add-offre .register > h2, main.main-add-offre .contact > h2, main.main-add-offre .ask > h2, main.main-add-offre .add-offre > h2 {
@ -917,12 +923,12 @@ main.main-login .login > h2, main.main-login .user > h2, main.main-login .regist
}
}
main.main-login .login h1, main.main-login .user h1, main.main-login .register h1, main.main-login .contact h1, main.main-login .ask h1, main.main-login .add-offre h1, main.main-user .login h1, main.main-user .user h1, main.main-user .register h1, main.main-user .contact h1, main.main-user .ask h1, main.main-user .add-offre h1, main.main-register .login h1, main.main-register .user h1, main.main-register .register h1, main.main-register .contact h1, main.main-register .ask h1, main.main-register .add-offre h1, main.main-contact .login h1, main.main-contact .user h1, main.main-contact .register h1, main.main-contact .contact h1, main.main-contact .ask h1, main.main-contact .add-offre h1, main.main-ask .login h1, main.main-ask .user h1, main.main-ask .register h1, main.main-ask .contact h1, main.main-ask .ask h1, main.main-ask .add-offre h1, main.main-add-offre .login h1, main.main-add-offre .user h1, main.main-add-offre .register h1, main.main-add-offre .contact h1, main.main-add-offre .ask h1, main.main-add-offre .add-offre h1 {
font-family: "Barlow", sans-serif;
color: black;
font-size: 1.2rem;
text-align: center;
margin-top: 3rem;
margin-bottom: 2rem;
font-family: "Barlow", sans-serif;
color: black;
font-size: 1.2rem;
}
@media (min-width: 760px) {
main.main-login .login h1, main.main-login .user h1, main.main-login .register h1, main.main-login .contact h1, main.main-login .ask h1, main.main-login .add-offre h1, main.main-user .login h1, main.main-user .user h1, main.main-user .register h1, main.main-user .contact h1, main.main-user .ask h1, main.main-user .add-offre h1, main.main-register .login h1, main.main-register .user h1, main.main-register .register h1, main.main-register .contact h1, main.main-register .ask h1, main.main-register .add-offre h1, main.main-contact .login h1, main.main-contact .user h1, main.main-contact .register h1, main.main-contact .contact h1, main.main-contact .ask h1, main.main-contact .add-offre h1, main.main-ask .login h1, main.main-ask .user h1, main.main-ask .register h1, main.main-ask .contact h1, main.main-ask .ask h1, main.main-ask .add-offre h1, main.main-add-offre .login h1, main.main-add-offre .user h1, main.main-add-offre .register h1, main.main-add-offre .contact h1, main.main-add-offre .ask h1, main.main-add-offre .add-offre h1 {
@ -1002,9 +1008,8 @@ main.main-login .login > div > div:not(.hidden) form .button:hover, main.main-lo
}
#background {
z-index: -1;
max-width: 99vw;
width: 100vw;
height: 98%;
width: 100%;
overflow: hidden;
position: absolute;
top: 0;
@ -1014,6 +1019,10 @@ main.main-login .login > div > div:not(.hidden) form .button:hover, main.main-lo
position: absolute;
pointer-events: none;
}
#background > div {
position: relative;
height: 80vh;
}
#background #bg-top {
/* #bg-1 {
top: 5vh;
@ -1027,6 +1036,14 @@ main.main-login .login > div > div:not(.hidden) form .button:hover, main.main-lo
#background #bg-top #bg-3 {
top: 13vh;
left: -10vw;
width: 20vw;
z-index: 1;
}
@media screen and (min-width: 1080px) {
#background #bg-top #bg-3 {
width: auto;
z-index: -1;
}
}
#background #bg-top #bg-2 {
top: 8vh;
@ -1036,6 +1053,12 @@ main.main-login .login > div > div:not(.hidden) form .button:hover, main.main-lo
width: 20vw;
top: 5vh;
right: -10vw;
z-index: 1;
}
@media screen and (min-width: 1080px) {
#background #bg-top #bg-5 {
z-index: -1;
}
}
#background #bg-middle {
/* #bg-8 {
@ -1058,19 +1081,44 @@ main.main-login .login > div > div:not(.hidden) form .button:hover, main.main-lo
left: -5vw;
top: 30vh;
}
#background #bg-bottom {
bottom: 0;
position: absolute;
}
#background #bg-bottom #bg-11 {
top: -70vh;
right: -5vw;
left: 0;
}
@media screen and (min-width: 1080px) {
#background #bg-bottom #bg-11 {
left: 50vw;
bottom: 70vh;
}
}
#background #bg-bottom #bg-10 {
width: 110vw;
top: -150vh;
left: 5vw;
bottom: 0;
}
@media screen and (min-width: 1080px) {
#background #bg-bottom #bg-10 {
left: 0;
bottom: 20vh;
}
}
#background #bg-bottom #bg-4 {
transform: scaleX(-1);
top: -40vh;
left: -45vw;
bottom: 5vh;
}
@media screen and (min-width: 760px) {
#background #bg-bottom #bg-4 {
bottom: 150vhvh;
}
}
@media screen and (min-width: 1080px) {
#background #bg-bottom #bg-4 {
bottom: -8vh;
}
}
/* PAGES */
@ -1456,7 +1504,6 @@ main.main-login .login > div > div:not(.hidden) form .button:hover, main.main-lo
@media (min-width: 1080px) {
.layout-content .fullpage .fullpage_content .liens_fixed > div > div, .layout-content .fullpage .fullpage_content .file_fixed > div > div,
.layout-content .fullpage .fullpage_content .liens > div > div, .layout-content .fullpage .fullpage_content .file_fixed > div > div {
margin-bottom: 0 !important;
margin: 0;
bottom: 10vh;
}
@ -2077,6 +2124,7 @@ aside.layout-sidebar-first:has(#block-erabletheme-views-block-projets-block-1) >
}
.fullpage.meetup > header > div:last-of-type > div > a::before {
content: "+";
aspect-ratio: 1/1;
text-decoration: none !important;
color: white;
border: solid 1px white;
@ -3054,13 +3102,8 @@ aside.layout-sidebar-first:has(#block-erabletheme-views-block-projets-block-1) >
margin: 0 !important;
padding: 0 !important;
}
.fullpage.projet_full .liens > div > div,
.fullpage.projet_full .file_fixed > div > div {
margin: 0 !important;
}
.fullpage.projet_full .liens > div > div > div,
.fullpage.projet_full .file_fixed > div > div > div {
padding: 1rem 0;
.fullpage.projet_full .liens > div > div > div:not(:last-of-type) {
margin-bottom: 30px;
}
.taxonomy_page > .fullpage_content > div:last-of-type {
@ -3093,6 +3136,10 @@ aside.layout-sidebar-first:has(#block-erabletheme-views-block-projets-block-1) >
display: none;
}
.views-row:not(:first-of-type) .taxonomy_page .retour_projets {
display: none;
}
@media (min-width: 760px) {
.fullpage.actus .actus_list {
display: grid;
@ -3134,6 +3181,9 @@ aside.layout-sidebar-first:has(#block-erabletheme-views-block-projets-block-1) >
padding: 0 !important;
justify-self: start;
}
.ressources > div > h2 > a {
pointer-events: none;
}
.ressources > div > h2 > a > span {
display: block;
font-family: "Barlow", sans-serif;
@ -3213,41 +3263,53 @@ aside.layout-sidebar-first:has(#block-erabletheme-views-block-projets-block-1) >
}
}
.ressource > div {
.ressource .retour_ressources {
padding-top: 3vh;
padding-left: 3vw;
font-family: "Marianne", sans-serif;
font-size: 1rem;
line-height: 1.4;
}
.ressource .retour_ressources a {
font-size: 0.8rem;
font-weight: 800;
color: #038788;
}
.ressource > div:not(.retour_ressources) {
margin: 3vw;
display: grid;
grid-template-columns: 0.25fr 1fr;
grid-auto-rows: auto;
}
.ressource > div > div > div:first-of-type {
.ressource > div:not(.retour_ressources) > div > div:first-of-type {
display: none;
}
.ressource > div > h2 {
.ressource > div:not(.retour_ressources) > h2 {
grid-column: 2;
grid-row: 1;
margin: 0 !important;
padding: 0 !important;
justify-self: start;
}
.ressource > div > h2 > span {
.ressource > div:not(.retour_ressources) > h2 > span {
display: block;
font-family: "Barlow", sans-serif;
color: black;
font-size: 1.2rem;
}
@media (min-width: 760px) {
.ressource > div > h2 > span {
.ressource > div:not(.retour_ressources) > h2 > span {
font-size: 1.6rem;
}
}
.ressource > div > div:first-of-type {
.ressource > div:not(.retour_ressources) > div:not(.retour_ressources):first-of-type {
grid-column: 2;
grid-row: 3;
}
.ressource > div > div:first-of-type > div > span {
.ressource > div:not(.retour_ressources) > div:not(.retour_ressources):first-of-type > div > span {
margin-top: -1rem;
}
.ressource > div > div:first-of-type > div > span a {
.ressource > div:not(.retour_ressources) > div:not(.retour_ressources):first-of-type > div > span a {
text-align: center;
color: black;
font-family: "Marianne", sans-serif;
@ -3258,26 +3320,26 @@ aside.layout-sidebar-first:has(#block-erabletheme-views-block-projets-block-1) >
padding: 9px 18px;
transition: background-color 0.3s ease;
}
.ressource > div > div:first-of-type > div > span a svg {
.ressource > div:not(.retour_ressources) > div:not(.retour_ressources):first-of-type > div > span a svg {
display: none;
}
.ressource > div > div:first-of-type > div > span a:hover {
.ressource > div:not(.retour_ressources) > div:not(.retour_ressources):first-of-type > div > span a:hover {
background-color: #00ff80;
}
.ressource > div > div:first-of-type > div > span:last-of-type {
.ressource > div:not(.retour_ressources) > div:not(.retour_ressources):first-of-type > div > span:last-of-type {
display: none;
}
.ressource > div > div:nth-of-type(2) {
.ressource > div:not(.retour_ressources) > div:nth-of-type(2) {
grid-column: 1;
grid-row: 1/4;
padding: 2rem 0;
margin-right: 2rem;
}
.ressource > div > div:nth-of-type(2) img {
.ressource > div:not(.retour_ressources) > div:nth-of-type(2) img {
width: 100%;
height: auto;
}
.ressource > div > div:nth-of-type(3) {
.ressource > div:not(.retour_ressources) > div:nth-of-type(3) {
grid-column: 2;
grid-row: 2;
margin-top: -1rem;

File diff suppressed because one or more lines are too long

View File

@ -114,25 +114,35 @@
} else if (document.querySelector('.offre-content')) {
fluoButtons = document.querySelectorAll('.liens_fixed > div, .file_fixed > div > div');
} else if (document.querySelector('.projets')) {
fluoButtons = document.querySelectorAll('.file_fixed > div > div > div, .liens > div > div > div');
fluoButtons = document.querySelectorAll('.file_fixed > div > div, .liens > div > div > div');
} else {
fluoButtons = document.querySelectorAll('.liens_fixed > div > div:not(.visually-hidden), .file_fixed > div > div, .liens > div > div');
}
let footer = document.querySelector('#footer_top');
function positionFluoLinks() {
// if window is more than 960px
let footer = document.querySelector('footer');
function positionFluoLinks(scrollTop) {
for (let i = fluoButtons.length; i > 0 ; i--) {
if (window.innerWidth > 1080) {
const layoutContainerEl = document.querySelector('.layout-container');
let pageScrollableHeight = layoutContainerEl.offsetHeight;
let prevButtonBottom = fluoButtons[i] ? parseInt(fluoButtons[i].style.bottom) : 0;
let prevButtonHeight = fluoButtons[i] ? fluoButtons[i].offsetHeight : 0;
fluoButtons[i - 1].style.position = 'fixed';
fluoButtons[i - 1].style.left = document.querySelector('.projets') ? '76vw' : '75vw';
if (footer.offsetTop < window.innerHeight + window.scrollY && i === fluoButtons.length) {
fluoButtons[i - 1].style.bottom = `${window.innerHeight - footer.offsetTop + window.scrollY + 30}px`;
/* console.log(`
pageScrollableHeight: ${pageScrollableHeight},
footer.offsetHeight: ${footer.offsetHeight},
window.innerHeight: ${window.innerHeight},
scrollTop: ${scrollTop}
`); */
if (pageScrollableHeight - footer.offsetHeight < window.innerHeight + scrollTop && i === fluoButtons.length) {
let margin = document.querySelector('.projets') ? 15 : 30;
fluoButtons[i - 1].style.bottom = `${window.innerHeight - footer.offsetTop + scrollTop + margin}px`;
} else {
fluoButtons[i - 1].style.bottom = i === fluoButtons.length ? '30px' : `${prevButtonBottom + prevButtonHeight + 15}px`;
let margin = document.querySelector('.projets') ? 0 : 15;
fluoButtons[i - 1].style.bottom = i === fluoButtons.length ? '30px' : `${prevButtonBottom + prevButtonHeight + margin}px`;
}
} else {
fluoButtons[i - 1].style.position = 'relative';
@ -146,9 +156,10 @@
for (let lien of liens) {
lien.setAttribute('target', '_blank');
}
positionFluoLinks();
document.addEventListener('scroll', () => {
positionFluoLinks();
document.body.addEventListener('scroll', (e) => {
positionFluoLinks(e.target.scrollTop);
});
window.addEventListener('resize', () => {
positionFluoLinks();
@ -325,50 +336,25 @@
//
// set bg middle placement
//
setBgContainer();
setBgMiddlePlacement();
setBgBottomPlacement();
let pageHeight = document.querySelector('.layout-container').offsetHeight;
toggleBgMiddle(pageHeight)
window.addEventListener('resize', () => {
setBgMiddlePlacement();
setBgBottomPlacement();
setBgContainer();
});
pageHeight = document.querySelector('.layout-container').offsetHeight;
toggleBgMiddle(pageHeight);
})
function setBgContainer() {
const bg = document.querySelector('#background');
const pageHeight = document.documentElement.scrollHeight;
bg.style.height = `${pageHeight}px`;
}
function setBgMiddlePlacement() {
const bgMiddleImgs = document.querySelectorAll('#bg-middle img');
const carousel = document.querySelector('.carousel_container');
const pageHeight = document.documentElement.scrollHeight;
for (let img of bgMiddleImgs) {
if (carousel) {
img.style.paddingTop = `${carousel.offsetHeight}px`;
} else {
img.style.paddingTop = `${pageHeight / 2}px`;
}
}
function toggleBgMiddle(pageHeight) {
const bgMiddle = document.querySelector('#bg-middle');
const bgOnze = document.querySelector('#bg-11');
if (pageHeight < 2000) {
const bgMiddle = document.querySelector('#bg-middle');
bgMiddle.style.display = 'none';
bgOnze.style.display = 'none';
} else {
bgMiddle.style.display = 'block';
bgOnze.style.display = 'block';
}
}
function setBgBottomPlacement() {
const bgBottomImgs = document.querySelectorAll('#bg-bottom img');
const pageHeight = document.documentElement.scrollHeight;
for (let img of bgBottomImgs) {
img.style.paddingTop = `${pageHeight}px`;
}
}
}
}

View File

@ -52,7 +52,7 @@
display: inline-block;
}
@media (min-width: $breakpoint_desktop) {
margin-bottom: 0 !important;
//margin-bottom: 0 !important;
margin: 0;
//position: fixed; -> dans le js direct
//left: 75vw;
@ -116,6 +116,7 @@ main:has(#block-erabletheme-views-block-projets-block-1) {
}
}
aside.layout-sidebar-first:has(#block-erabletheme-leprogramme-2),
aside.layout-sidebar-first:has(#block-erabletheme-views-block-projets-block-1) {
height: auto;

View File

@ -58,6 +58,7 @@
}
> a::before {
content: "+";
aspect-ratio: 1/1;
text-decoration: none !important;
color: white;
border: solid 1px white;

View File

@ -173,7 +173,6 @@
.fullpage.projet_full {
// overflow-x: hidden; // enlever quand on ajoute le menu des projets à gauche
.retour_projets {
padding-top: 3vh;
padding-left: $x_margin;
@include main_text_content();
@ -423,13 +422,9 @@
}
}
}
.liens,
.file_fixed {
> div > div {
margin: 0 !important;
> div {
padding: 1rem 0;
}
.liens {
> div > div > div:not(:last-of-type) {
margin-bottom: 30px;
}
}
}
@ -468,3 +463,7 @@
.feed-icon {
display: none;
}
.views-row:not(:first-of-type) .taxonomy_page .retour_projets {
display: none;
}

View File

@ -18,10 +18,13 @@
margin: 0 !important;
padding: 0 !important;
justify-self: start;
> a > span {
//margin-top: -1rem !important;
display: block;
@include sous_titre_alt();
> a {
pointer-events: none;
> span {
//margin-top: -1rem !important;
display: block;
@include sous_titre_alt();
}
}
}
> div:first-of-type {
@ -66,7 +69,17 @@
}
.ressource {
> div {
.retour_ressources {
padding-top: 3vh;
padding-left: $x_margin;
@include main_text_content();
a {
font-size: $sm_font_size;
font-weight: 800;
color: $teal;
}
}
> div:not(.retour_ressources) {
margin: $x_margin;
display: grid;
grid-template-columns: 0.25fr 1fr;
@ -86,7 +99,7 @@
@include sous_titre_alt();
}
}
> div:first-of-type {
> div:not(.retour_ressources):first-of-type {
grid-column: 2;
grid-row: 3;
> div > span {

View File

@ -6,21 +6,37 @@
}
} */
body {
//background-color: lightgrey;
> .dialog-off-canvas-main-canvas {
height: 100vh;
overflow: scroll;
.layout-container {
position: relative;
z-index: 1;
display: flex;
flex-direction: column;
//height: 100%;
header {
z-index: 2;
}
main {
z-index: 1;
padding: 0.5rem;
@media screen and (min-width: $breakpoint_tablet) {
padding: 0;
}
}
footer {
z-index: 0;
}
#background {
z-index: -1;
}
}
overflow-x: hidden;
}
html {
overflow-x: hidden;
overflow: hidden;
}
.layout-container {
display: flex;
}
main:has(#block-erabletheme-leprogramme-2),
main:has(#block-erabletheme-views-block-projets-block-1) {

View File

@ -1,7 +1,6 @@
#background {
z-index: -1;
max-width: 99vw;
width: 100vw;
height: 98%;
width: 100%;
overflow: hidden;
position: absolute;
top: 0;
@ -10,6 +9,10 @@
position: absolute;
pointer-events: none;
}
> div {
position: relative;
height: 80vh;
}
#bg-top {
/* #bg-1 {
top: 5vh;
@ -18,6 +21,12 @@
#bg-3 {
top: 13vh;
left: -10vw;
width: 20vw;
z-index: 1;
@media screen and (min-width: $breakpoint_desktop) {
width: auto;
z-index: -1;
}
}
#bg-2 {
top: 8vh;
@ -27,6 +36,10 @@
width: 20vw;
top: 5vh;
right: -10vw;
z-index: 1;
@media screen and (min-width: $breakpoint_desktop) {
z-index: -1;
}
}
/* #bg-4 {
top: 18vh;
@ -56,19 +69,35 @@
}
}
#bg-bottom {
bottom: 0;
position: absolute;
#bg-11 {
top: -70vh;
right: -5vw;
left: 0;
@media screen and (min-width: $breakpoint_desktop) {
left: 50vw;
bottom: 70vh;
}
}
#bg-10 {
width: 110vw;
top: -150vh;
left: 5vw;
bottom: 0;
@media screen and (min-width: $breakpoint_desktop) {
left: 0;
bottom: 20vh;
}
}
#bg-4 {
transform: scaleX(-1);
top: -40vh;
left: -45vw;
bottom: 5vh;
@media screen and (min-width: $breakpoint_tablet) {
bottom: 150vhvh;
}
@media screen and (min-width: $breakpoint_desktop) {
bottom: -8vh;
}
}
}
}

View File

@ -1,7 +1,6 @@
.layout-container > footer {
width: 100%;
background-color: white;
z-index: 99;
margin-top: 50px;
padding: 0 $x_margin;
#footer_middle {

View File

@ -6,14 +6,14 @@ main.main-login, main.main-user, main.main-register, main.main-contact, main.mai
width: 100vw;
background-color: white;
> h2 {
@include sous_titre_alt();
text-align: center;
text-align: center;
@include sous_titre_alt();
}
h1 {
@include sous_titre_alt();
text-align: center;
margin-top: 3rem;
margin-bottom: 2rem;
text-align: center;
margin-top: 3rem;
margin-bottom: 2rem;
@include sous_titre_alt();
}
div[role="contentinfo"] {
@include main_text_content();

View File

@ -1,21 +1,7 @@
/*
body.toolbar-tray-open header[role="banner"] {
left: 15rem !important;
width: calc(100% - 15rem) !important;
} */
body.toolbar-fixed header[role="banner"] {
top: 2.4em !important;
}
.layout-container {
//max-width: 100vw;
//overflow: hidden;
header[role="banner"] {
width: 100%;
background-color: white;
z-index: 99;
// box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.2);
@media (min-width: $breakpoint_desktop) {
position: sticky;
top: -12vh;

View File

@ -44,26 +44,6 @@
{{ page_top }}
{{ page }}
{{ page_bottom }}
<div id="background">
<div id="bg-top">
{# <img src="/themes/erabletheme/assets/bg-shapes/bg-1.svg" aria-hidden="true" alt="bg shape" id="bg-1"> #}
<img src="/themes/erabletheme/assets/bg-shapes/bg-5.svg" aria-hidden="true" alt="bg shape" id="bg-5">
<img src="/themes/erabletheme/assets/bg-shapes/bg-3.svg" aria-hidden="true" alt="bg shape" id="bg-3">
<img src="/themes/erabletheme/assets/bg-shapes/bg-2.svg" aria-hidden="true" alt="bg shape" id="bg-2">
{# <img src="/themes/erabletheme/assets/bg-shapes/bg-4.svg" aria-hidden="true" alt="bg shape" id="bg-4"> #}
</div>
<div id="bg-middle">
{# <img src="/themes/erabletheme/assets/bg-shapes/bg-8.svg" aria-hidden="true" alt="bg shape" id="bg-8"> #}
<img src="/themes/erabletheme/assets/bg-shapes/bg-6.svg" aria-hidden="true" alt="bg shape" id="bg-6">
<img src="/themes/erabletheme/assets/bg-shapes/bg-7.svg" aria-hidden="true" alt="bg shape" id="bg-7">
<img src="/themes/erabletheme/assets/bg-shapes/bg-12.png" aria-hidden="true" alt="bg shape" id="bg-12">
</div>
<div id="bg-bottom">
<img src="/themes/erabletheme/assets/bg-shapes/bg-11.svg" aria-hidden="true" alt="bg shape" id="bg-11">
<img src="/themes/erabletheme/assets/bg-shapes/bg-10.svg" aria-hidden="true" alt="bg shape" id="bg-10">
<img src="/themes/erabletheme/assets/bg-shapes/bg-4.svg" aria-hidden="true" alt="bg shape" id="bg-4">
</div>
</div>
<js-bottom-placeholder token="{{ placeholder_token }}">
</body>
</html>

View File

@ -72,6 +72,9 @@
<article class="fullpage">
<div class="fullpage_content ressource">
<div class="retour_ressources">
<a href="/ressources">← Retour aux ressources</a>
</div>
<div{{ content_attributes }}>
<h2>{{ label }}</h2>

View File

@ -99,4 +99,26 @@
</footer>
<div id="background">
<div id="bg-top">
{# <img src="/themes/erabletheme/assets/bg-shapes/bg-1.svg" aria-hidden="true" alt="bg shape" id="bg-1"> #}
<img src="/themes/erabletheme/assets/bg-shapes/bg-5.svg" aria-hidden="true" alt="bg shape" id="bg-5">
<img src="/themes/erabletheme/assets/bg-shapes/bg-3.svg" aria-hidden="true" alt="bg shape" id="bg-3">
<img src="/themes/erabletheme/assets/bg-shapes/bg-2.svg" aria-hidden="true" alt="bg shape" id="bg-2">
{# <img src="/themes/erabletheme/assets/bg-shapes/bg-4.svg" aria-hidden="true" alt="bg shape" id="bg-4"> #}
</div>
<div id="bg-middle">
{# <img src="/themes/erabletheme/assets/bg-shapes/bg-8.svg" aria-hidden="true" alt="bg shape" id="bg-8"> #}
<img src="/themes/erabletheme/assets/bg-shapes/bg-6.svg" aria-hidden="true" alt="bg shape" id="bg-6">
<img src="/themes/erabletheme/assets/bg-shapes/bg-7.svg" aria-hidden="true" alt="bg shape" id="bg-7">
<img src="/themes/erabletheme/assets/bg-shapes/bg-12.png" aria-hidden="true" alt="bg shape" id="bg-12">
</div>
<div id="bg-bottom">
<img src="/themes/erabletheme/assets/bg-shapes/bg-11.svg" aria-hidden="true" alt="bg shape" id="bg-11">
<img src="/themes/erabletheme/assets/bg-shapes/bg-10.svg" aria-hidden="true" alt="bg shape" id="bg-10">
<img src="/themes/erabletheme/assets/bg-shapes/bg-4.svg" aria-hidden="true" alt="bg shape" id="bg-4">
</div>
</div>
</div>{# /.layout-container #}