ajout des images d'ornement
This commit is contained in:
parent
a0137d95ac
commit
02e77dda2f
Binary file not shown.
After Width: | Height: | Size: 1.3 MiB |
Binary file not shown.
After Width: | Height: | Size: 283 KiB |
Binary file not shown.
After Width: | Height: | Size: 252 KiB |
Binary file not shown.
After Width: | Height: | Size: 1.6 MiB |
Binary file not shown.
After Width: | Height: | Size: 184 KiB |
|
@ -35,6 +35,7 @@
|
||||||
.layout-container {
|
.layout-container {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
justify-content: space-between;
|
||||||
min-height: 100vh;
|
min-height: 100vh;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -668,18 +669,11 @@ a {
|
||||||
}
|
}
|
||||||
.actu_full .liens_fixed > div > div:nth-of-type(2) a, .actu_full .file_fixed > div > div > div a {
|
.actu_full .liens_fixed > div > div:nth-of-type(2) a, .actu_full .file_fixed > div > div > div a {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
max-width: 19vw;
|
|
||||||
}
|
|
||||||
@media (min-width: 760px) {
|
|
||||||
.actu_full .liens_fixed > div > div:nth-of-type(2), .actu_full .file_fixed > div > div > div {
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
@media (min-width: 1080px) {
|
@media (min-width: 1080px) {
|
||||||
.actu_full .liens_fixed > div > div:nth-of-type(2), .actu_full .file_fixed > div > div > div {
|
.actu_full .liens_fixed > div > div:nth-of-type(2), .actu_full .file_fixed > div > div > div {
|
||||||
margin-bottom: 0 !important;
|
margin-bottom: 0 !important;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0 3vw;
|
|
||||||
position: fixed;
|
position: fixed;
|
||||||
right: 0;
|
right: 0;
|
||||||
bottom: 10vh;
|
bottom: 10vh;
|
||||||
|
@ -687,6 +681,9 @@ a {
|
||||||
.actu_full .liens_fixed > div > div:nth-of-type(2) > div, .actu_full .file_fixed > div > div > div > div {
|
.actu_full .liens_fixed > div > div:nth-of-type(2) > div, .actu_full .file_fixed > div > div > div > div {
|
||||||
height: 3vh;
|
height: 3vh;
|
||||||
}
|
}
|
||||||
|
.actu_full .liens_fixed > div > div:nth-of-type(2) a, .actu_full .file_fixed > div > div > div a {
|
||||||
|
max-width: 19vw;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
.actu_full .file_fixed span:last-of-type {
|
.actu_full .file_fixed span:last-of-type {
|
||||||
display: none;
|
display: none;
|
||||||
|
@ -914,6 +911,7 @@ a {
|
||||||
margin-top: -3vh;
|
margin-top: -3vh;
|
||||||
padding-top: 3vh;
|
padding-top: 3vh;
|
||||||
background: linear-gradient(to bottom, #fcf9ee 80%, white 100%);
|
background: linear-gradient(to bottom, #fcf9ee 80%, white 100%);
|
||||||
|
position: relative;
|
||||||
}
|
}
|
||||||
.fullpage > h2 {
|
.fullpage > h2 {
|
||||||
font-family: "Barlow", sans-serif;
|
font-family: "Barlow", sans-serif;
|
||||||
|
@ -921,23 +919,43 @@ a {
|
||||||
padding: 0 3vw;
|
padding: 0 3vw;
|
||||||
margin-top: 1rem;
|
margin-top: 1rem;
|
||||||
color: #038788;
|
color: #038788;
|
||||||
padding-top: 5vh;
|
margin-top: 5vh;
|
||||||
margin-bottom: 7vh;
|
margin-bottom: 7vh;
|
||||||
|
background-color: #fcf9ee;
|
||||||
|
z-index: 1;
|
||||||
|
position: relative;
|
||||||
|
width: auto;
|
||||||
|
display: inline-block;
|
||||||
}
|
}
|
||||||
.fullpage > h2 a {
|
.fullpage > h2 a {
|
||||||
color: #038788;
|
color: #038788;
|
||||||
}
|
}
|
||||||
|
@media (min-width: 760px) {
|
||||||
|
.fullpage > h2 {
|
||||||
|
background-color: unset;
|
||||||
|
}
|
||||||
|
}
|
||||||
.fullpage .fullpage_content > h2 {
|
.fullpage .fullpage_content > h2 {
|
||||||
font-family: "Barlow", sans-serif;
|
font-family: "Barlow", sans-serif;
|
||||||
font-size: 2.3rem;
|
font-size: 2.3rem;
|
||||||
padding: 0 3vw;
|
padding: 0 3vw;
|
||||||
margin-top: 1rem;
|
margin-top: 1rem;
|
||||||
color: #038788;
|
color: #038788;
|
||||||
padding-top: 5vh;
|
margin-top: 5vh;
|
||||||
|
background-color: #fcf9ee;
|
||||||
|
z-index: 1;
|
||||||
|
position: relative;
|
||||||
|
width: auto;
|
||||||
|
display: inline-block;
|
||||||
}
|
}
|
||||||
.fullpage .fullpage_content > h2 a {
|
.fullpage .fullpage_content > h2 a {
|
||||||
color: #038788;
|
color: #038788;
|
||||||
}
|
}
|
||||||
|
@media (min-width: 760px) {
|
||||||
|
.fullpage .fullpage_content > h2 {
|
||||||
|
background-color: unset;
|
||||||
|
}
|
||||||
|
}
|
||||||
.fullpage .fullpage_content .sous_titre {
|
.fullpage .fullpage_content .sous_titre {
|
||||||
font-family: "Marianne", sans-serif;
|
font-family: "Marianne", sans-serif;
|
||||||
font-size: 1rem;
|
font-size: 1rem;
|
||||||
|
@ -979,18 +997,11 @@ a {
|
||||||
}
|
}
|
||||||
.fullpage .fullpage_content .liens_fixed > div > div a, .fullpage .fullpage_content .file_fixed > div > div a {
|
.fullpage .fullpage_content .liens_fixed > div > div a, .fullpage .fullpage_content .file_fixed > div > div a {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
max-width: 19vw;
|
|
||||||
}
|
|
||||||
@media (min-width: 760px) {
|
|
||||||
.fullpage .fullpage_content .liens_fixed > div > div, .fullpage .fullpage_content .file_fixed > div > div {
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
@media (min-width: 1080px) {
|
@media (min-width: 1080px) {
|
||||||
.fullpage .fullpage_content .liens_fixed > div > div, .fullpage .fullpage_content .file_fixed > div > div {
|
.fullpage .fullpage_content .liens_fixed > div > div, .fullpage .fullpage_content .file_fixed > div > div {
|
||||||
margin-bottom: 0 !important;
|
margin-bottom: 0 !important;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0 3vw;
|
|
||||||
position: fixed;
|
position: fixed;
|
||||||
right: 0;
|
right: 0;
|
||||||
bottom: 10vh;
|
bottom: 10vh;
|
||||||
|
@ -998,6 +1009,9 @@ a {
|
||||||
.fullpage .fullpage_content .liens_fixed > div > div > div, .fullpage .fullpage_content .file_fixed > div > div > div {
|
.fullpage .fullpage_content .liens_fixed > div > div > div, .fullpage .fullpage_content .file_fixed > div > div > div {
|
||||||
height: 3vh;
|
height: 3vh;
|
||||||
}
|
}
|
||||||
|
.fullpage .fullpage_content .liens_fixed > div > div a, .fullpage .fullpage_content .file_fixed > div > div a {
|
||||||
|
max-width: 19vw;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
.fullpage .fullpage_content .file_fixed span:last-of-type {
|
.fullpage .fullpage_content .file_fixed span:last-of-type {
|
||||||
display: none;
|
display: none;
|
||||||
|
@ -1020,6 +1034,158 @@ a {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.ornements_top_over {
|
||||||
|
position: absolute;
|
||||||
|
width: 100vw;
|
||||||
|
height: 30vh;
|
||||||
|
right: -55vw;
|
||||||
|
top: -5vh;
|
||||||
|
z-index: 0;
|
||||||
|
}
|
||||||
|
.ornements_top_over > div {
|
||||||
|
position: absolute;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-size: contain;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
.ornements_top_over > div:first-of-type {
|
||||||
|
background-image: url(../assets/formes/forme_4.png);
|
||||||
|
top: -3vh;
|
||||||
|
right: 5vw;
|
||||||
|
}
|
||||||
|
.ornements_top_over > div:nth-of-type(2) {
|
||||||
|
background-image: url(../assets/formes/forme_5.png);
|
||||||
|
right: -13vw;
|
||||||
|
}
|
||||||
|
.ornements_top_over > div:nth-of-type(3) {
|
||||||
|
background-image: url(../assets/formes/forme_3.png);
|
||||||
|
top: 4vh;
|
||||||
|
right: -8vw;
|
||||||
|
}
|
||||||
|
@media (min-width: 760px) {
|
||||||
|
.ornements_top_over {
|
||||||
|
left: -40vw;
|
||||||
|
top: -10vw;
|
||||||
|
}
|
||||||
|
.ornements_top_over > div {
|
||||||
|
transform: scaleX(-1);
|
||||||
|
left: -55vw;
|
||||||
|
}
|
||||||
|
.ornements_top_over > div:first-of-type {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
.ornements_top_over > div:nth-of-type(2) {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media (min-width: 1080px) {
|
||||||
|
.ornements_top_over > div:nth-of-type(3) {
|
||||||
|
transform: scaleX(-1) rotate(-25deg);
|
||||||
|
top: -25vh;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ornements_top_under {
|
||||||
|
display: none;
|
||||||
|
position: absolute;
|
||||||
|
width: 100vw;
|
||||||
|
height: 30vh;
|
||||||
|
left: -30vw;
|
||||||
|
top: 0vw;
|
||||||
|
}
|
||||||
|
.ornements_top_under > div {
|
||||||
|
position: absolute;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-size: contain;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
transform: scaleX(-1);
|
||||||
|
}
|
||||||
|
.ornements_top_under > div:first-of-type {
|
||||||
|
background-image: url(../assets/formes/forme_4.png);
|
||||||
|
top: -3vh;
|
||||||
|
left: -45vw;
|
||||||
|
}
|
||||||
|
.ornements_top_under > div:nth-of-type(2) {
|
||||||
|
background-image: url(../assets/formes/forme_5.png);
|
||||||
|
left: -60vw;
|
||||||
|
}
|
||||||
|
@media (min-width: 760px) {
|
||||||
|
.ornements_top_under {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media (min-width: 1080px) {
|
||||||
|
.ornements_top_under > div:first-of-type {
|
||||||
|
top: 1vh;
|
||||||
|
left: -50vw;
|
||||||
|
}
|
||||||
|
.ornements_top_under > div:nth-of-type(2) {
|
||||||
|
top: 6vh;
|
||||||
|
left: -56.5vw;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ornements_bottom_over {
|
||||||
|
position: absolute;
|
||||||
|
width: 100vw;
|
||||||
|
height: 30vh;
|
||||||
|
left: -30vw;
|
||||||
|
bottom: -20vh;
|
||||||
|
}
|
||||||
|
.ornements_bottom_over > div {
|
||||||
|
position: absolute;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-size: contain;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
.ornements_bottom_over > div:first-of-type {
|
||||||
|
background-image: url(../assets/formes/forme_1.png);
|
||||||
|
left: 8vw;
|
||||||
|
bottom: -4vh;
|
||||||
|
}
|
||||||
|
.ornements_bottom_over > div:nth-of-type(2) {
|
||||||
|
background-image: url(../assets/formes/forme_2.png);
|
||||||
|
bottom: -15vh;
|
||||||
|
left: -3vw;
|
||||||
|
}
|
||||||
|
@media (min-width: 760px) {
|
||||||
|
.ornements_bottom_over {
|
||||||
|
left: unset;
|
||||||
|
right: -8vw;
|
||||||
|
bottom: -25vh;
|
||||||
|
}
|
||||||
|
.ornements_bottom_over > div {
|
||||||
|
transform: scaleX(-1);
|
||||||
|
}
|
||||||
|
.ornements_bottom_over > div:nth-of-type(2) {
|
||||||
|
left: 18vw;
|
||||||
|
bottom: -11vh;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media (min-width: 1080px) {
|
||||||
|
.ornements_bottom_over > div:first-of-type {
|
||||||
|
bottom: 6vh;
|
||||||
|
left: 20vw;
|
||||||
|
}
|
||||||
|
.ornements_bottom_over > div:nth-of-type(2) {
|
||||||
|
bottom: -9vh;
|
||||||
|
left: 25vw;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.fullpage.actus .ornements_top_over, .fullpage.actus .ornements_top_under {
|
||||||
|
top: -12vh;
|
||||||
|
}
|
||||||
|
.fullpage.actus .ornements_bottom_over {
|
||||||
|
bottom: -28vh;
|
||||||
|
}
|
||||||
|
.fullpage.actus .ornements_bottom_over > div:nth-of-type(2) {
|
||||||
|
bottom: -10vh;
|
||||||
|
left: -7vh;
|
||||||
|
}
|
||||||
@media (min-width: 760px) {
|
@media (min-width: 760px) {
|
||||||
.fullpage.actus {
|
.fullpage.actus {
|
||||||
width: auto;
|
width: auto;
|
||||||
|
@ -1035,6 +1201,16 @@ a {
|
||||||
.fullpage.actus .actus_list {
|
.fullpage.actus .actus_list {
|
||||||
grid-template-columns: repeat(3, 1fr);
|
grid-template-columns: repeat(3, 1fr);
|
||||||
}
|
}
|
||||||
|
.fullpage.actus .ornements_top_over > div:nth-of-type(3) {
|
||||||
|
top: -28vh;
|
||||||
|
}
|
||||||
|
.fullpage.actus .ornements_bottom_over > div:first-of-type {
|
||||||
|
bottom: 0vh;
|
||||||
|
left: -3vw;
|
||||||
|
}
|
||||||
|
.fullpage.actus .ornements_bottom_over > div:nth-of-type(2) {
|
||||||
|
left: 6vh;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.content_gouvernance .views-row {
|
.content_gouvernance .views-row {
|
||||||
|
|
File diff suppressed because one or more lines are too long
|
@ -28,6 +28,7 @@
|
||||||
const menu = hamburgerBtn.nextElementSibling;
|
const menu = hamburgerBtn.nextElementSibling;
|
||||||
const menuItems = menu.children;
|
const menuItems = menu.children;
|
||||||
const opacityDelay = 50;
|
const opacityDelay = 50;
|
||||||
|
let inTransition = false;
|
||||||
|
|
||||||
function toggleMenuItems(action) {
|
function toggleMenuItems(action) {
|
||||||
let delay = opacityDelay;
|
let delay = opacityDelay;
|
||||||
|
@ -46,32 +47,41 @@
|
||||||
// Toggle menu visibility on hamburger click
|
// Toggle menu visibility on hamburger click
|
||||||
hamburgerBtn.addEventListener("click", function(event) {
|
hamburgerBtn.addEventListener("click", function(event) {
|
||||||
event.stopPropagation();
|
event.stopPropagation();
|
||||||
hamburgerIcon.classList.toggle('open');
|
if (!inTransition) {
|
||||||
if(menu.classList.contains('active')) {
|
inTransition = true;
|
||||||
|
hamburgerIcon.classList.toggle('open');
|
||||||
|
if(menu.classList.contains('active')) {
|
||||||
|
setTimeout(() => {
|
||||||
|
menu.style.display = "none";
|
||||||
|
}, 700);
|
||||||
|
toggleMenuItems('hide');
|
||||||
|
} else {
|
||||||
|
menu.style.display = "flex";
|
||||||
|
toggleMenuItems('show');
|
||||||
|
}
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
menu.style.display = "none";
|
menu.classList.toggle("active");
|
||||||
|
}, 1);
|
||||||
|
setTimeout(() => {
|
||||||
|
inTransition = false;
|
||||||
}, 700);
|
}, 700);
|
||||||
toggleMenuItems('hide');
|
|
||||||
} else {
|
|
||||||
menu.style.display = "flex";
|
|
||||||
toggleMenuItems('show');
|
|
||||||
}
|
}
|
||||||
setTimeout(() => {
|
|
||||||
menu.classList.toggle("active");
|
|
||||||
}, 1);
|
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
// Close menu when clicking outside of the menu
|
// Close menu when clicking outside of the menu
|
||||||
document.addEventListener("click", function(event) {
|
document.addEventListener("click", function(event) {
|
||||||
const isHamburgerClicked = event.target === hamburgerBtn;
|
const isHamburgerClicked = event.target === hamburgerBtn;
|
||||||
const isMenuClicked = event.target === menu || event.target.parentElement === menu;
|
const isMenuClicked = event.target === menu || event.target.parentElement === menu;
|
||||||
if (!isMenuClicked && !isHamburgerClicked) {
|
if (!isMenuClicked && !isHamburgerClicked && !inTransition) {
|
||||||
|
inTransition = true;
|
||||||
hamburgerIcon.classList.remove('open');
|
hamburgerIcon.classList.remove('open');
|
||||||
menu.classList.remove("active");
|
menu.classList.remove("active");
|
||||||
toggleMenuItems('hide');
|
toggleMenuItems('hide');
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
menu.style.display = "none";
|
menu.style.display = "none";
|
||||||
|
inTransition = false;
|
||||||
}, 700);
|
}, 700);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
|
@ -3,16 +3,33 @@
|
||||||
margin-top: -3vh;
|
margin-top: -3vh;
|
||||||
padding-top: 3vh;
|
padding-top: 3vh;
|
||||||
@include beige_gradient();
|
@include beige_gradient();
|
||||||
|
position: relative;
|
||||||
> h2 {
|
> h2 {
|
||||||
@include main_title();
|
@include main_title();
|
||||||
padding-top: 5vh;
|
margin-top: 5vh;
|
||||||
margin-bottom: 7vh;
|
margin-bottom: 7vh;
|
||||||
|
background-color: $beige;
|
||||||
|
z-index: 1;
|
||||||
|
position: relative;
|
||||||
|
width: auto;
|
||||||
|
display: inline-block;
|
||||||
|
@media (min-width: $breakpoint_tablet) {
|
||||||
|
background-color: unset;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.fullpage_content {
|
.fullpage_content {
|
||||||
> h2 {
|
> h2 {
|
||||||
@include main_title();
|
@include main_title();
|
||||||
padding-top: 5vh;
|
margin-top: 5vh;
|
||||||
|
background-color: $beige;
|
||||||
|
z-index: 1;
|
||||||
|
position: relative;
|
||||||
|
width: auto;
|
||||||
|
display: inline-block;
|
||||||
|
@media (min-width: $breakpoint_tablet) {
|
||||||
|
background-color: unset;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.sous_titre {
|
.sous_titre {
|
||||||
|
@ -39,21 +56,19 @@
|
||||||
@include fluo_button();
|
@include fluo_button();
|
||||||
a {
|
a {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
max-width: calc(25vw - $x_margin * 2);
|
|
||||||
}
|
|
||||||
@media (min-width: $breakpoint_tablet) {
|
|
||||||
padding: 0;
|
|
||||||
}
|
}
|
||||||
@media (min-width: $breakpoint_desktop) {
|
@media (min-width: $breakpoint_desktop) {
|
||||||
margin-bottom: 0 !important;
|
margin-bottom: 0 !important;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0 $x_margin;
|
|
||||||
position: fixed;
|
position: fixed;
|
||||||
right: 0;
|
right: 0;
|
||||||
bottom: 10vh;
|
bottom: 10vh;
|
||||||
> div {
|
> div {
|
||||||
height: 3vh;
|
height: 3vh;
|
||||||
}
|
}
|
||||||
|
a {
|
||||||
|
max-width: calc(25vw - $x_margin * 2);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.file_fixed span:last-of-type {
|
.file_fixed span:last-of-type {
|
||||||
|
@ -76,7 +91,154 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.ornements_top_over {
|
||||||
|
position: absolute;
|
||||||
|
width: 100vw;
|
||||||
|
height: 30vh;
|
||||||
|
right: -55vw;
|
||||||
|
top: -5vh;
|
||||||
|
z-index: 0;
|
||||||
|
> div {
|
||||||
|
position: absolute;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-size: contain;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
> div:first-of-type {
|
||||||
|
background-image: url(../assets/formes/forme_4.png);
|
||||||
|
top: -3vh;
|
||||||
|
right: 5vw;
|
||||||
|
}
|
||||||
|
> div:nth-of-type(2) {
|
||||||
|
background-image: url(../assets/formes/forme_5.png);
|
||||||
|
right: -13vw;
|
||||||
|
}
|
||||||
|
> div:nth-of-type(3) {
|
||||||
|
background-image: url(../assets/formes/forme_3.png);
|
||||||
|
top: 4vh;
|
||||||
|
right: -8vw;
|
||||||
|
}
|
||||||
|
@media (min-width: $breakpoint_tablet) {
|
||||||
|
left: -40vw;
|
||||||
|
top: -10vw;
|
||||||
|
> div {
|
||||||
|
transform: scaleX(-1);
|
||||||
|
left: -55vw;
|
||||||
|
}
|
||||||
|
> div:first-of-type {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
> div:nth-of-type(2) {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media (min-width: $breakpoint_desktop) {
|
||||||
|
> div:nth-of-type(3) {
|
||||||
|
transform: scaleX(-1) rotate(-25deg);
|
||||||
|
top: -25vh;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ornements_top_under {
|
||||||
|
display: none;
|
||||||
|
position: absolute;
|
||||||
|
width: 100vw;
|
||||||
|
height: 30vh;
|
||||||
|
left: -30vw;
|
||||||
|
top: 0vw;
|
||||||
|
> div {
|
||||||
|
position: absolute;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-size: contain;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
transform: scaleX(-1);
|
||||||
|
}
|
||||||
|
> div:first-of-type {
|
||||||
|
background-image: url(../assets/formes/forme_4.png);
|
||||||
|
top: -3vh;
|
||||||
|
left: -45vw;
|
||||||
|
}
|
||||||
|
> div:nth-of-type(2) {
|
||||||
|
background-image: url(../assets/formes/forme_5.png);
|
||||||
|
left: -60vw;
|
||||||
|
}
|
||||||
|
@media (min-width: $breakpoint_tablet) {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
@media (min-width: $breakpoint_desktop) {
|
||||||
|
> div:first-of-type {
|
||||||
|
top: 1vh;
|
||||||
|
left: -50vw;
|
||||||
|
}
|
||||||
|
> div:nth-of-type(2) {
|
||||||
|
top: 6vh;
|
||||||
|
left: -56.5vw;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ornements_bottom_over {
|
||||||
|
position: absolute;
|
||||||
|
width: 100vw;
|
||||||
|
height: 30vh;
|
||||||
|
left: -30vw;
|
||||||
|
bottom: -20vh;
|
||||||
|
> div {
|
||||||
|
position: absolute;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-size: contain;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
> div:first-of-type {
|
||||||
|
background-image: url(../assets/formes/forme_1.png);
|
||||||
|
left: 8vw;
|
||||||
|
bottom: -4vh;
|
||||||
|
}
|
||||||
|
> div:nth-of-type(2) {
|
||||||
|
background-image: url(../assets/formes/forme_2.png);
|
||||||
|
bottom: -15vh;
|
||||||
|
left: -3vw;
|
||||||
|
}
|
||||||
|
@media (min-width: $breakpoint_tablet) {
|
||||||
|
left: unset;
|
||||||
|
right: -8vw;
|
||||||
|
bottom: -25vh;
|
||||||
|
> div {
|
||||||
|
transform: scaleX(-1);
|
||||||
|
}
|
||||||
|
> div:nth-of-type(2) {
|
||||||
|
left: 18vw;
|
||||||
|
bottom: -11vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
@media (min-width: $breakpoint_desktop) {
|
||||||
|
> div:first-of-type {
|
||||||
|
bottom: 6vh;
|
||||||
|
left: 20vw;
|
||||||
|
}
|
||||||
|
> div:nth-of-type(2) {
|
||||||
|
bottom: -9vh;
|
||||||
|
left: 25vw;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.fullpage.actus {
|
.fullpage.actus {
|
||||||
|
.ornements_top_over, .ornements_top_under {
|
||||||
|
top: -12vh;
|
||||||
|
}
|
||||||
|
.ornements_bottom_over {
|
||||||
|
bottom: -28vh;
|
||||||
|
> div:nth-of-type(2) {
|
||||||
|
bottom: -10vh;
|
||||||
|
left: -7vh;
|
||||||
|
}
|
||||||
|
}
|
||||||
@media (min-width: $breakpoint_tablet) {
|
@media (min-width: $breakpoint_tablet) {
|
||||||
width: auto;
|
width: auto;
|
||||||
margin-left: $x_margin;
|
margin-left: $x_margin;
|
||||||
|
@ -90,6 +252,19 @@
|
||||||
.actus_list {
|
.actus_list {
|
||||||
grid-template-columns: repeat(3, 1fr);
|
grid-template-columns: repeat(3, 1fr);
|
||||||
}
|
}
|
||||||
|
.ornements_top_over {
|
||||||
|
> div:nth-of-type(3) {
|
||||||
|
top: -28vh;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.ornements_bottom_over {
|
||||||
|
> div:first-of-type {
|
||||||
|
bottom: 0vh;
|
||||||
|
left: -3vw;
|
||||||
|
}
|
||||||
|
> div:nth-of-type(2) {
|
||||||
|
left: 6vh;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
|
@ -9,5 +9,6 @@ $breakpoint_desktop: 1080px;
|
||||||
.layout-container {
|
.layout-container {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
justify-content: space-between;
|
||||||
min-height: 100vh;
|
min-height: 100vh;
|
||||||
}
|
}
|
|
@ -59,21 +59,19 @@
|
||||||
@include fluo_button();
|
@include fluo_button();
|
||||||
a {
|
a {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
max-width: calc(25vw - $x_margin * 2);
|
|
||||||
}
|
|
||||||
@media (min-width: $breakpoint_tablet) {
|
|
||||||
padding: 0;
|
|
||||||
}
|
}
|
||||||
@media (min-width: $breakpoint_desktop) {
|
@media (min-width: $breakpoint_desktop) {
|
||||||
margin-bottom: 0 !important;
|
margin-bottom: 0 !important;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0 $x_margin;
|
|
||||||
position: fixed;
|
position: fixed;
|
||||||
right: 0;
|
right: 0;
|
||||||
bottom: 10vh;
|
bottom: 10vh;
|
||||||
> div {
|
> div {
|
||||||
height: 3vh;
|
height: 3vh;
|
||||||
}
|
}
|
||||||
|
a {
|
||||||
|
max-width: calc(25vw - $x_margin * 2);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.file_fixed span:last-of-type {
|
.file_fixed span:last-of-type {
|
||||||
|
|
|
@ -68,7 +68,20 @@
|
||||||
* @ingroup themeable
|
* @ingroup themeable
|
||||||
*/
|
*/
|
||||||
#}
|
#}
|
||||||
|
<div class="ornements_top_under">
|
||||||
|
<div></div>
|
||||||
|
<div></div>
|
||||||
|
</div>
|
||||||
<article{{ attributes }} class="actu_full fullpage">
|
<article{{ attributes }} class="actu_full fullpage">
|
||||||
|
<div class="ornements_top_over">
|
||||||
|
<div></div>
|
||||||
|
<div></div>
|
||||||
|
<div></div>
|
||||||
|
</div>
|
||||||
|
<div class="ornements_bottom_over">
|
||||||
|
<div></div>
|
||||||
|
<div></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="retour_actus">
|
<div class="retour_actus">
|
||||||
← Retour aux actualités
|
← Retour aux actualités
|
||||||
|
|
|
@ -68,7 +68,21 @@
|
||||||
* @ingroup themeable
|
* @ingroup themeable
|
||||||
*/
|
*/
|
||||||
#}
|
#}
|
||||||
|
|
||||||
|
<div class="ornements_top_under">
|
||||||
|
<div></div>
|
||||||
|
<div></div>
|
||||||
|
</div>
|
||||||
<article class="fullpage">
|
<article class="fullpage">
|
||||||
|
<div class="ornements_top_over">
|
||||||
|
<div></div>
|
||||||
|
<div></div>
|
||||||
|
<div></div>
|
||||||
|
</div>
|
||||||
|
<div class="ornements_bottom_over">
|
||||||
|
<div></div>
|
||||||
|
<div></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="fullpage_content">
|
<div class="fullpage_content">
|
||||||
|
|
||||||
|
|
|
@ -38,7 +38,21 @@
|
||||||
]
|
]
|
||||||
%}
|
%}
|
||||||
<div{{ attributes.addClass(classes) }}>
|
<div{{ attributes.addClass(classes) }}>
|
||||||
|
<div class="ornements_top_under">
|
||||||
|
<div></div>
|
||||||
|
<div></div>
|
||||||
|
</div>
|
||||||
<div class="content_gouvernance fullpage">
|
<div class="content_gouvernance fullpage">
|
||||||
|
<div class="ornements_top_over">
|
||||||
|
<div></div>
|
||||||
|
<div></div>
|
||||||
|
<div></div>
|
||||||
|
</div>
|
||||||
|
<div class="ornements_bottom_over">
|
||||||
|
<div></div>
|
||||||
|
<div></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<h2>
|
<h2>
|
||||||
{{ view_array['#title']['#markup'] }}
|
{{ view_array['#title']['#markup'] }}
|
||||||
</h2>
|
</h2>
|
||||||
|
|
|
@ -38,7 +38,21 @@
|
||||||
]
|
]
|
||||||
%}
|
%}
|
||||||
<div{{ attributes.addClass(classes) }}>
|
<div{{ attributes.addClass(classes) }}>
|
||||||
|
<div class="ornements_top_under">
|
||||||
|
<div></div>
|
||||||
|
<div></div>
|
||||||
|
</div>
|
||||||
<div class="content_partenaires fullpage">
|
<div class="content_partenaires fullpage">
|
||||||
|
<div class="ornements_top_over">
|
||||||
|
<div></div>
|
||||||
|
<div></div>
|
||||||
|
<div></div>
|
||||||
|
</div>
|
||||||
|
<div class="ornements_bottom_over">
|
||||||
|
<div></div>
|
||||||
|
<div></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<h2>
|
<h2>
|
||||||
{{ view_array['#title']['#markup'] }}
|
{{ view_array['#title']['#markup'] }}
|
||||||
</h2>
|
</h2>
|
||||||
|
|
|
@ -37,7 +37,20 @@
|
||||||
dom_id ? 'js-view-dom-id-' ~ dom_id,
|
dom_id ? 'js-view-dom-id-' ~ dom_id,
|
||||||
]
|
]
|
||||||
%}
|
%}
|
||||||
|
<div class="ornements_top_under">
|
||||||
|
<div></div>
|
||||||
|
<div></div>
|
||||||
|
</div>
|
||||||
<div{{ attributes.addClass(classes).addClass('fullpage', 'actus') }}>
|
<div{{ attributes.addClass(classes).addClass('fullpage', 'actus') }}>
|
||||||
|
<div class="ornements_top_over">
|
||||||
|
<div></div>
|
||||||
|
<div></div>
|
||||||
|
<div></div>
|
||||||
|
</div>
|
||||||
|
<div class="ornements_bottom_over">
|
||||||
|
<div></div>
|
||||||
|
<div></div>
|
||||||
|
</div>
|
||||||
<h2>
|
<h2>
|
||||||
{{ view_array['#title']['#markup'] }}
|
{{ view_array['#title']['#markup'] }}
|
||||||
</h2>
|
</h2>
|
||||||
|
|
Loading…
Reference in New Issue