bachir
/
drupal-erable
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Compare commits

base: bachir:master
Branches Tags
bachir:master
bachir:prod
bachir:stage
..
compare: bachir:stage
Branches Tags
bachir:master
bachir:prod
bachir:stage

No commits in common. "master" and "stage" have entirely different histories.
master ... stage

18 changed files with 181 additions and 324 deletions
Show Stats Expand all files Collapse all files

195
web/themes/erabletheme/css/styles.css
View File

@ -59,36 +59,19 @@ a {
}
} */
body {
height: 100vh;
overflow: scroll;
overflow-x: hidden;
}
body .layout-container {
body > .dialog-off-canvas-main-canvas {
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: hidden;
overflow-x: hidden;
}
.layout-container {
display: flex;
}
main:has(#block-erabletheme-leprogramme-2),
@ -119,9 +102,19 @@ 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] {
@ -458,6 +451,7 @@ em {
.layout-container > footer {
width: 100%;
background-color: white;
z-index: 99;
margin-top: 50px;
padding: 0 3vw;
}
@ -592,7 +586,7 @@ em {
}
}
.carousel_container .slick-container div.views-row {
padding: 0 2vw;
padding: 0 3vw;
}
@media screen and (min-width: 760px) {
.carousel_container .slick-container div.views-row {
@ -837,14 +831,9 @@ em {
.views-row article.actu-teaser {
background-color: white;
padding: 1rem;
padding: 2rem;
box-sizing: border-box;
}
@media screen and (min-width: 760px) {
.views-row article.actu-teaser {
padding: 2rem;
}
}
.views-row article.actu-teaser > div:first-of-type {
width: 100%;
aspect-ratio: 20/9;
@ -871,11 +860,9 @@ em {
margin: 0 3vw;
margin-top: 1.3rem;
padding-top: 0.7rem;
margin-left: 0;
}
@media (min-width: 760px) {
.views-row article.actu-teaser .preview_meta {
margin-left: unset;
font-size: 0.9rem;
}
}
@ -883,19 +870,16 @@ em {
font-family: "Marianne", sans-serif;
font-size: 0.9rem;
padding: 5px 3vw;
padding-left: 0 !important;
}
@media (min-width: 760px) {
.views-row article.actu-teaser .preview_sous_titre {
padding-left: unset;
font-size: 1.2rem;
padding-top: unset !important;
padding-top: 0;
}
}
.views-row article.actu-teaser h2 {
margin-bottom: 0.5rem;
margin-top: 1rem !important;
padding: 0 !important;
font-family: "Barlow Condensed", sans-serif;
font-size: 1.6rem;
padding: 0 3vw;
@ -922,10 +906,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 {
@ -933,12 +917,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 {
text-align: center;
margin-top: 3rem;
margin-bottom: 2rem;
font-family: "Barlow", sans-serif;
color: black;
font-size: 1.2rem;
text-align: center;
margin-top: 3rem;
margin-bottom: 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 {
@ -1018,8 +1002,9 @@ main.main-login .login > div > div:not(.hidden) form .button:hover, main.main-lo
}
#background {
height: 98%;
width: 100%;
z-index: -1;
max-width: 99vw;
width: 100vw;
overflow: hidden;
position: absolute;
top: 0;
@ -1029,10 +1014,6 @@ 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;
@ -1046,14 +1027,6 @@ 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;
@ -1063,12 +1036,6 @@ 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 {
@ -1091,44 +1058,19 @@ 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 {
left: 0;
}
@media screen and (min-width: 1080px) {
#background #bg-bottom #bg-11 {
left: 50vw;
bottom: 70vh;
}
top: -70vh;
right: -5vw;
}
#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 */
@ -1383,17 +1325,10 @@ main.main-login .login > div > div:not(.hidden) form .button:hover, main.main-lo
}
.map-projets > .projets_intro {
padding: 0 3vw;
margin-top: 1.3rem;
margin-bottom: 6vh;
font-family: "Marianne", sans-serif;
font-size: 1rem;
line-height: 1.4;
}
@media screen and (min-width: 760px) {
.map-projets > .projets_intro {
margin-top: 2vh;
}
}
.map-projets > .projets_intro h1, .map-projets > .projets_intro h2, .map-projets > .projets_intro h3,
.map-projets > .projets_intro h4, .map-projets > .projets_intro h5, .map-projets > .projets_intro h6 {
font-family: "Barlow", sans-serif;
@ -1521,6 +1456,7 @@ 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;
}
@ -2141,7 +2077,6 @@ 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;
@ -2623,14 +2558,12 @@ aside.layout-sidebar-first:has(#block-erabletheme-views-block-projets-block-1) >
}
.layout-content .fullpage.projets > .intro_map > header {
padding: 0 3vw;
margin-bottom: 6vh;
font-family: "Marianne", sans-serif;
font-size: 1rem;
line-height: 1.4;
}
@media (min-width: 1080px) {
.layout-content .fullpage.projets > .intro_map > header {
margin-bottom: 0;
max-width: 55vw;
}
}
@ -3121,18 +3054,15 @@ aside.layout-sidebar-first:has(#block-erabletheme-views-block-projets-block-1) >
margin: 0 !important;
padding: 0 !important;
}
.fullpage.projet_full .liens > div > div > div:not(:last-of-type) {
margin-bottom: 30px;
.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;
}
.views-row:first-of-type > .taxonomy_page {
margin-top: 13vh !important;
}
.taxonomy_page {
margin-top: 0 !important;
margin-bottom: 0 !important;
}
.taxonomy_page > .fullpage_content > div:last-of-type {
display: grid !important;
grid-template-columns: 0.5fr 1fr;
@ -3163,10 +3093,6 @@ 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;
@ -3208,9 +3134,6 @@ 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;
@ -3290,53 +3213,41 @@ aside.layout-sidebar-first:has(#block-erabletheme-views-block-projets-block-1) >
}
}
.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) {
.ressource > div {
margin: 3vw;
display: grid;
grid-template-columns: 0.25fr 1fr;
grid-auto-rows: auto;
}
.ressource > div:not(.retour_ressources) > div > div:first-of-type {
.ressource > div > div > div:first-of-type {
display: none;
}
.ressource > div:not(.retour_ressources) > h2 {
.ressource > div > h2 {
grid-column: 2;
grid-row: 1;
margin: 0 !important;
padding: 0 !important;
justify-self: start;
}
.ressource > div:not(.retour_ressources) > h2 > span {
.ressource > div > h2 > span {
display: block;
font-family: "Barlow", sans-serif;
color: black;
font-size: 1.2rem;
}
@media (min-width: 760px) {
.ressource > div:not(.retour_ressources) > h2 > span {
.ressource > div > h2 > span {
font-size: 1.6rem;
}
}
.ressource > div:not(.retour_ressources) > div:not(.retour_ressources):first-of-type {
.ressource > div > div:first-of-type {
grid-column: 2;
grid-row: 3;
}
.ressource > div:not(.retour_ressources) > div:not(.retour_ressources):first-of-type > div > span {
.ressource > div > div:first-of-type > div > span {
margin-top: -1rem;
}
.ressource > div:not(.retour_ressources) > div:not(.retour_ressources):first-of-type > div > span a {
.ressource > div > div:first-of-type > div > span a {
text-align: center;
color: black;
font-family: "Marianne", sans-serif;
@ -3347,26 +3258,26 @@ aside.layout-sidebar-first:has(#block-erabletheme-views-block-projets-block-1) >
padding: 9px 18px;
transition: background-color 0.3s ease;
}
.ressource > div:not(.retour_ressources) > div:not(.retour_ressources):first-of-type > div > span a svg {
.ressource > div > div:first-of-type > div > span a svg {
display: none;
}
.ressource > div:not(.retour_ressources) > div:not(.retour_ressources):first-of-type > div > span a:hover {
.ressource > div > div:first-of-type > div > span a:hover {
background-color: #00ff80;
}
.ressource > div:not(.retour_ressources) > div:not(.retour_ressources):first-of-type > div > span:last-of-type {
.ressource > div > div:first-of-type > div > span:last-of-type {
display: none;
}
.ressource > div:not(.retour_ressources) > div:nth-of-type(2) {
.ressource > div > div:nth-of-type(2) {
grid-column: 1;
grid-row: 1/4;
padding: 2rem 0;
margin-right: 2rem;
}
.ressource > div:not(.retour_ressources) > div:nth-of-type(2) img {
.ressource > div > div:nth-of-type(2) img {
width: 100%;
height: auto;
}
.ressource > div:not(.retour_ressources) > div:nth-of-type(3) {
.ressource > div > div:nth-of-type(3) {
grid-column: 2;
grid-row: 2;
margin-top: -1rem;

2
web/themes/erabletheme/css/styles.css.map
View File

File diff suppressed because one or more lines are too long

78
web/themes/erabletheme/js/erabletheme.js
View File

@ -114,35 +114,25 @@
} 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, .liens > div > div > div');
fluoButtons = document.querySelectorAll('.file_fixed > div > 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');
let footer = document.querySelector('#footer_top');
function positionFluoLinks() {
// if window is more than 960px
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';
/* 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`;
if (footer.offsetTop < window.innerHeight + window.scrollY && i === fluoButtons.length) {
fluoButtons[i - 1].style.bottom = `${window.innerHeight - footer.offsetTop + window.scrollY + 30}px`;
} else {
let margin = document.querySelector('.projets') ? 0 : 15;
fluoButtons[i - 1].style.bottom = i === fluoButtons.length ? '30px' : `${prevButtonBottom + prevButtonHeight + margin}px`;
fluoButtons[i - 1].style.bottom = i === fluoButtons.length ? '30px' : `${prevButtonBottom + prevButtonHeight + 15}px`;
}
} else {
fluoButtons[i - 1].style.position = 'relative';
@ -156,10 +146,9 @@
for (let lien of liens) {
lien.setAttribute('target', '_blank');
}
positionFluoLinks();
document.body.addEventListener('scroll', (e) => {
positionFluoLinks(e.target.scrollTop);
document.addEventListener('scroll', () => {
positionFluoLinks();
});
window.addEventListener('resize', () => {
positionFluoLinks();
@ -336,25 +325,50 @@
//
// set bg middle placement
//
let pageHeight = document.querySelector('.layout-container').offsetHeight;
toggleBgMiddle(pageHeight)
setBgContainer();
setBgMiddlePlacement();
setBgBottomPlacement();
window.addEventListener('resize', () => {
pageHeight = document.querySelector('.layout-container').offsetHeight;
toggleBgMiddle(pageHeight);
})
setBgMiddlePlacement();
setBgBottomPlacement();
setBgContainer();
});
function toggleBgMiddle(pageHeight) {
const bgMiddle = document.querySelector('#bg-middle');
const bgOnze = document.querySelector('#bg-11');
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`;
}
}
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`;
}
}
}
}

3
web/themes/erabletheme/scss/_fullpage.scss
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,7 +116,6 @@ 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;

5
web/themes/erabletheme/scss/_home.scss
View File

@ -148,12 +148,7 @@
}
> .projets_intro {
padding: 0 3vw;
margin-top: 1.3rem;
margin-bottom: 6vh;
@include main_text_content();
@media screen and (min-width: $breakpoint_tablet) {
margin-top: 2vh;
}
h1, h2, h3,
h4, h5, h6 {
@include sous_titre_alt();

1
web/themes/erabletheme/scss/_meetup.scss
View File

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

23
web/themes/erabletheme/scss/_projets.scss
View File

@ -8,10 +8,8 @@
> header {
//margin-right: 5vw;
padding: 0 3vw;
margin-bottom: 6vh;
@include main_text_content();
@media (min-width: $breakpoint_desktop) {
margin-bottom: 0;
max-width: 55vw;
}
h1, h2, h3,
@ -175,6 +173,7 @@
.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();
@ -424,18 +423,18 @@
}
}
}
.liens {
> div > div > div:not(:last-of-type) {
margin-bottom: 30px;
.liens,
.file_fixed {
> div > div {
margin: 0 !important;
> div {
padding: 1rem 0;
}
}
}
}
.views-row:first-of-type > .taxonomy_page {
margin-top: 13vh !important;
}
.taxonomy_page {
margin-top: 0 !important;
margin-bottom: 0 !important;
> .fullpage_content {
> div:last-of-type {
display: grid !important;
@ -469,7 +468,3 @@
.feed-icon {
display: none;
}
.views-row:not(:first-of-type) .taxonomy_page .retour_projets {
display: none;
}

25
web/themes/erabletheme/scss/_ressources.scss
View File

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

30
web/themes/erabletheme/scss/global/_global.scss
View File

@ -6,37 +6,21 @@
}
} */
body {
height: 100vh;
overflow: scroll;
.layout-container {
//background-color: lightgrey;
> .dialog-off-canvas-main-canvas {
position: relative;
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;
}
z-index: 1;
}
overflow-x: hidden;
}
html {
overflow: hidden;
overflow-x: hidden;
}
.layout-container {
display: flex;
}
main:has(#block-erabletheme-leprogramme-2),
main:has(#block-erabletheme-views-block-projets-block-1) {

24
web/themes/erabletheme/scss/partials/_articles_teaser.scss
View File

@ -1,11 +1,8 @@
.views-row {
article.actu-teaser {
background-color: white;
padding: 1rem;
padding: 2rem;
box-sizing: border-box;
@media screen and (min-width: $breakpoint_tablet) {
padding: 2rem;
}
> div:first-of-type {
width: 100%;
aspect-ratio: 20 / 9;
@ -35,29 +32,24 @@
margin: 0 $x_margin;
margin-top: 1.3rem;
padding-top: 0.7rem;
margin-left: 0;
@media (min-width: $breakpoint_tablet) {
margin-left: unset;
font-size: $m_font_size;
}
}
.preview_sous_titre {
font-family: "Marianne", sans-serif;
font-size: $m_font_size;
padding: 5px $x_margin;
padding-left: 0 !important;
@media (min-width: $breakpoint_tablet) {
padding-left: unset;
font-size: $l_font_size;
padding-top: unset !important;
}
font-family: "Marianne", sans-serif;
font-size: $m_font_size;
padding: 5px $x_margin;
@media (min-width: $breakpoint_tablet) {
font-size: $l_font_size;
padding-top: 0;
}
}
h2 {
margin-bottom: 0.5rem;
margin-top: 1rem !important;
padding: 0 !important;
@include main_title();
}
}

43
web/themes/erabletheme/scss/partials/_background.scss
View File

@ -1,6 +1,7 @@
#background {
height: 98%;
width: 100%;
z-index: -1;
max-width: 99vw;
width: 100vw;
overflow: hidden;
position: absolute;
top: 0;
@ -9,10 +10,6 @@
position: absolute;
pointer-events: none;
}
> div {
position: relative;
height: 80vh;
}
#bg-top {
/* #bg-1 {
top: 5vh;
@ -21,12 +18,6 @@
#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;
@ -36,10 +27,6 @@
width: 20vw;
top: 5vh;
right: -10vw;
z-index: 1;
@media screen and (min-width: $breakpoint_desktop) {
z-index: -1;
}
}
/* #bg-4 {
top: 18vh;
@ -69,35 +56,19 @@
}
}
#bg-bottom {
bottom: 0;
position: absolute;
#bg-11 {
left: 0;
@media screen and (min-width: $breakpoint_desktop) {
left: 50vw;
bottom: 70vh;
}
top: -70vh;
right: -5vw;
}
#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;
}
}
}
}

2
web/themes/erabletheme/scss/partials/_carousel.scss
View File

@ -11,7 +11,7 @@
transform: translateX(-50vw);
}
div.views-row {
padding: 0 2vw;
padding: 0 3vw;
@media screen and (min-width: $breakpoint_tablet) {
padding: 0 6vw;
}

1
web/themes/erabletheme/scss/partials/_footer.scss
View File

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

12
web/themes/erabletheme/scss/partials/_forms.scss
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 {
text-align: center;
@include sous_titre_alt();
@include sous_titre_alt();
text-align: center;
}
h1 {
text-align: center;
margin-top: 3rem;
margin-bottom: 2rem;
@include sous_titre_alt();
@include sous_titre_alt();
text-align: center;
margin-top: 3rem;
margin-bottom: 2rem;
}
div[role="contentinfo"] {
@include main_text_content();

14
web/themes/erabletheme/scss/partials/_header.scss
View File

@ -1,7 +1,21 @@
/*
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;

20
web/themes/erabletheme/templates/html.html.twig
View File

@ -44,6 +44,26 @@
{{ 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>

3
web/themes/erabletheme/templates/node/node--ressource--full.html.twig
View File

@ -72,9 +72,6 @@
<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>

24
web/themes/erabletheme/templates/page/page.html.twig
View File

@ -96,29 +96,7 @@
</div>
</section>
<section id="footer_bottom">{{ page.bottom }}</section>
</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 #}