fonds, ajustements carte index projets, ajustements grille index projets, hover carte leaflet projet, ajustements collectifs des projets

This commit is contained in:
Valentin
2024-11-07 04:37:14 +01:00
parent dea01885d7
commit 9cd6627bfa
47 changed files with 2795 additions and 209 deletions

View File

@@ -8,68 +8,70 @@
&:first-of-type {
margin-top: 5vh;
}
> div:first-of-type {
grid-row: 1 / 3;
display: flex;
align-items: center;
> div {
width: 20vw;
height: 20vw;
position: relative;
img {
border-radius: 10vw;
width: 100%;
height: 100%;
object-fit: cover;
}
&::after {
top: 0;
left: 0;
position: absolute;
content: '';
height: 100%;
width: 100%;
background-image: url('/themes/erabletheme/assets/cercle_dessin.svg');
background-size: cover;
display: block;
pointer-events: none;
}
}
> .portrait {
grid-row: 1 / 3;
> div {
display: flex;
align-items: center;
> div {
width: 20vw;
height: 20vw;
position: relative;
img {
border-radius: 10vw;
width: 100%;
height: 100%;
object-fit: cover;
}
&::after {
top: 0;
left: 0;
position: absolute;
content: '';
height: 100%;
width: 100%;
background-image: url('/themes/erabletheme/assets/cercle_dessin.svg');
background-size: cover;
display: block;
pointer-events: none;
}
}
}
}
> div:nth-of-type(2),
> div:nth-of-type(3) {
margin-bottom: 2vh;
> .prenom,
> .nom {
align-self: flex-end;
margin-bottom: 2vh;
@include sous_titre();
}
> div:nth-of-type(3) {
> .nom > div {
padding-left: 0.5rem;
}
> div:last-of-type {
> .texte {
grid-column: 2 / 4;
@include main_text_content();
> div > p {
p {
margin-top: 0 !important;
padding-left: 0;
padding-left: 0 !important;
}
}
@media (min-width: $breakpoint_tablet) {
grid-template-columns: 10vw auto 1fr;
> div:first-of-type > div {
> .portrait > div > div {
width: 10vw;
height: 10vw;
border-radius: 5vw;
}
> div:nth-of-type(2) {
> .prenom {
padding-left: 3vw;
}
> div:last-of-type > div > p {
padding-left: 3vw;
> .texte p {
padding-left: 3vw !important;
}
}

View File

@@ -67,6 +67,8 @@
@media (min-width: $breakpoint_desktop) {
display: flex;
justify-content: space-around;
margin-top: 20vh;
margin-bottom: 20vh !important;
}
}
@@ -138,6 +140,8 @@
@media (min-width: $breakpoint_desktop) {
margin-left: 25vw;
width: calc(100% - 50vw);
margin-top: 10vh;
margin-bottom: 10vh;
}
> h2 {
@include main_title();

View File

@@ -6,9 +6,12 @@
flex-direction: row;
}
> header {
margin-right: 5vw;
//margin-right: 5vw;
padding: 0 3vw;
@include main_text_content();
@media (min-width: $breakpoint_desktop) {
max-width: 55vw;
}
h1, h2, h3,
h4, h5, h6 {
padding: 0 !important;
@@ -24,6 +27,9 @@
width: 100%;
}
}
p {
margin-bottom: 1rem;
}
}
.projets_intro {
display: none;
@@ -31,12 +37,17 @@
#sites-map-container {
width: 70%;
padding: 0 !important;
padding-bottom: 5vh !important;
@media screen and (min-width: $breakpoint_tablet) {
width: 50%;
}
@media (min-width: $breakpoint_desktop) {
margin-right: 8vw !important;
width: 85%;
//margin-right: 8vw !important;
margin: 0 2vw;
margin-right: 3vw;
margin-top: 5vh;
padding-bottom: 0;
//width: 85%;
}
#popup {
h3 {
@@ -67,29 +78,31 @@
display: grid;
grid-template-columns: 0.5fr 1fr;
grid-template-rows: repeat(4, auto);
grid-column-gap: 1rem;
> .views-field-field-diaporama {
grid-column: 1;
grid-row: 1/5;
grid-row: 1/4;
align-self: start;
overflow: hidden;
height: 100%;
> .field-content {
width: 8rem;
height: 8rem;
display: block;
width: 100%;
height: 100%;
> a {
width: 100%;
height: 100%;
overflow: hidden;
display: block;
height: auto;
display: flex;
align-items: center;
align-items: start;
justify-content: center;
mask-image: url('/themes/erabletheme/assets/shapes/shape_1.svg');
mask-repeat: no-repeat;
mask-size: 100% auto;
mask-position: center;
img {
width: 100%;
height: 100%;
mask-image: url('/themes/erabletheme/assets/shapes/shape_1.svg');
mask-repeat: no-repeat;
mask-size: 100% 100%;
mask-position: center;
object-fit: cover;
width: 170%;
height: auto;
//object-fit: cover;
}
}
}
@@ -98,6 +111,7 @@
grid-column: 2;
grid-row: 1;
margin-bottom: 1rem;
margin-left: -1rem;
a {
color: $teal;
}
@@ -109,6 +123,7 @@
font-size: 1.1rem !important;
margin-bottom: 1rem;
line-height: 1.3;
font-size: $m_font_size !important;
a {
color: black;
}
@@ -118,14 +133,16 @@
grid-column: 2;
grid-row: 3;
margin-bottom: 1rem;
margin-left: -0.5rem;
@include main_text_content();
a {
color: black;
}
}
> .views-field-field-th {
grid-column: 2;
grid-column: 1/3;
grid-row: 4;
padding-left: 1rem;
ul {
li {
display: inline-block;
@@ -192,6 +209,11 @@
}
}
}
.intro {
> div > div:first-of-type {
display: none;
}
}
.diapo {
margin-top: 3rem;
margin-left: calc($x_margin * 3);
@@ -278,7 +300,8 @@
}
.carte {
width: auto;
margin: 4rem $x_margin;
margin: 0 $x_margin;
margin-top: 4rem;
.leaflet-pane {
path {
stroke: $fluo_green;
@@ -287,11 +310,34 @@
fill-opacity: 0.2;
}
}
#leaflet-popup {
position: fixed;
padding: 0.3rem 0.8rem;
background-color: white;
font-size: $sm_font_size !important;
opacity: 0;
transition: opacity 0.3s ease;
@include main_text_content();
}
}
.libelles-carte {
display: none;
}
.legende-carte {
> div > div:first-of-type {
display: none;
}
p {
margin-top: 1rem !important;
font-size: 0.8rem !important;
opacity: 0.7;
}
}
.chronologie {
display: none;
}
.equipe {
margin-top: 4rem;
> div {
> div:first-of-type {
margin-left: $x_margin;
@@ -313,11 +359,11 @@
> div {
display: grid;
grid-template-columns: 1fr;
grid-row-gap: 1rem;
grid-column-gap: 4rem;
grid-row-gap: 2rem;
grid-column-gap: 1.5rem;
width: 75%;
@media screen and (min-width: $breakpoint_tablet) {
grid-template-columns: repeat(2, 1fr);
grid-template-columns: repeat(3, 1fr);
width: unset;
}
> div {
@@ -332,44 +378,36 @@
grid-template-columns: auto 1fr;
grid-column-gap: 0;
flex-direction: column;
> div:first-of-type {
grid-column: 1 / span 2;
grid-row: 1;
margin: 0;
padding: 0;
display: block;
width: 5rem;
height: 5rem;
margin-bottom: 0.75rem;
> div {
width: 5rem;
height: 5rem;
> img {
width: 5rem;
height: auto;
}
}
> .portrait {
display: none;
}
> div:nth-of-type(2) {
> .nom {
grid-column: 2;
grid-row: 2;
margin: 0;
padding: 0;
margin-left: 0.3rem;
color: black;
font-size: $m_font_size;
> div {
padding-left: 0.2rem !important;
}
}
> div:nth-of-type(3) {
> .prenom {
grid-column: 1;
grid-row: 2;
margin: 0;
padding: 0;
color: black;
font-size: $m_font_size;
}
> div:nth-of-type(4) {
> .texte {
margin-top: 0.5rem;
grid-column: 1 / span 2;
grid-row: 3;
p {
margin: 0;
padding: 0;
font-size: $m_font_size;
margin: 0 !important;
padding: 0 !important;
}
}
}
@@ -391,7 +429,3 @@
}
}
}
#block-erabletheme-views-block-projets-block-1 {
// display: none;
}

View File

@@ -5,9 +5,13 @@
margin-top: calc(10vh + 3rem);
}
} */
body {
background-color: lightgrey;
//background-color: lightgrey;
> div:first-of-type {
position: relative;
z-index: 1;
}
overflow-x: hidden;
}
.layout-container {

View File

@@ -0,0 +1,67 @@
#background {
z-index: -1;
img {
position: absolute;
pointer-events: none;
}
#bg-top {
#bg-1 {
top: 5vh;
left: 0;
}
#bg-3 {
top: 13vh;
left: -10vw;
}
#bg-2 {
top: 8vh;
left: -28vw;
}
#bg-4 {
top: 18vh;
right: -45vw;
}
}
#bg-middle {
#bg-5 {
top: -20vh;
right: -10vw;
}
#bg-6 {
top: 5vh;
right: -5vw;
}
#bg-7 {
width: 85vw;
top: 10vh;
right: 0vw;
}
#bg-8 {
width: 80vw;
top: 45vh;
left: -40vw;
}
#bg-12 {
width: 105vw;
left: -5vw;
top: 30vh;
}
}
#bg-bottom {
#bg-11 {
top: -70vh;
right: -5vw;
}
#bg-10 {
width: 110vw;
top: -150vh;
left: 5vw;
}
#bg-4 {
transform: scaleX(-1);
top: -40vh;
left: -45vw;
}
}
}

View File

@@ -227,8 +227,10 @@ body.toolbar-fixed header[role="banner"] {
opacity: 1;
}
> li:nth-of-type(1),
> li:nth-of-type(2),
> li:nth-of-type(6) {
> li:nth-of-type(6),
> li:nth-of-type(7),
> li:nth-of-type(8),
> li:nth-of-type(9) {
border-bottom: solid 1px white;
padding: 12px 0;
}

View File

@@ -13,6 +13,7 @@
@import "partials/_articles";
@import "partials/_articles_teaser";
@import "partials/_forms.scss";
@import "partials/_background.scss";
/* PAGES */