fix design with sandrine
This commit is contained in:
@@ -6,8 +6,8 @@
|
||||
|
||||
@font-face {
|
||||
font-family: 'gilroy-semiboldita';
|
||||
src: url('./theme/custom/quartiers_de_demain/dist/assets/fonts/Gilroy/gilroy-semibolditalic-webfont.woff2') format('woff2'),
|
||||
url('./theme/custom/quartiers_de_demain/dist/assets/fonts/Gilroy/gilroy-semibolditalic-webfont.woff') format('woff');
|
||||
src: url('../fonts/Gilroy/gilroy-semibolditalic-webfont.woff2') format('woff2'),
|
||||
url('../fonts/Gilroy/gilroy-semibolditalic-webfont.woff') format('woff');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
|
||||
@@ -18,8 +18,8 @@
|
||||
|
||||
@font-face {
|
||||
font-family: 'gilroy-semibold';
|
||||
src: url('./theme/custom/quartiers_de_demain/dist/assets/fonts/Gilroy/gilroy-semibold-webfont.woff2') format('woff2'),
|
||||
url('./theme/custom/quartiers_de_demain/dist/assets/fonts/Gilroy/gilroy-semibold-webfont.woff') format('woff');
|
||||
src: url('../fonts/Gilroy/gilroy-semibold-webfont.woff2') format('woff2'),
|
||||
url('../fonts/Gilroy/gilroy-semibold-webfont.woff') format('woff');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
|
||||
@@ -30,8 +30,8 @@
|
||||
|
||||
@font-face {
|
||||
font-family: 'gilroy-regularita';
|
||||
src: url('./theme/custom/quartiers_de_demain/dist/assets/fonts/Gilroy/gilroy-regularitalic-webfont.woff2') format('woff2'),
|
||||
url('./theme/custom/quartiers_de_demain/dist/assets/fonts/Gilroy/gilroy-regularitalic-webfont.woff') format('woff');
|
||||
src: url('../fonts/Gilroy/gilroy-regularitalic-webfont.woff2') format('woff2'),
|
||||
url('../fonts/Gilroy/gilroy-regularitalic-webfont.woff') format('woff');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
|
||||
@@ -42,8 +42,8 @@
|
||||
|
||||
@font-face {
|
||||
font-family: 'gilroy-regular';
|
||||
src: url('./theme/custom/quartiers_de_demain/dist/assets/fonts/Gilroy/gilroy-regular-webfont.woff2') format('woff2'),
|
||||
url('./theme/custom/quartiers_de_demain/dist/assets/fonts/Gilroy/gilroy-regular-webfont.woff') format('woff');
|
||||
src: url('../fonts/Gilroy/gilroy-regular-webfont.woff2') format('woff2'),
|
||||
url('../fonts/Gilroy/gilroy-regular-webfont.woff') format('woff');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
|
||||
@@ -51,23 +51,20 @@
|
||||
|
||||
|
||||
|
||||
|
||||
@font-face {
|
||||
font-family: 'gilroy-bolditalic';
|
||||
src: url('./theme/custom/quartiers_de_demain/dist/assets/fonts/Gilroy/gilroy-bolditalic-webfont.woff2') format('woff2'),
|
||||
url('./theme/custom/quartiers_de_demain/dist/assets/fonts/Gilroy/gilroy-bolditalic-webfont.woff') format('woff');
|
||||
src: url('../fonts/Gilroy/gilroy-bolditalic-webfont.woff2') format('woff2'),
|
||||
url('../fonts/Gilroy/gilroy-bolditalic-webfont.woff') format('woff');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
@font-face {
|
||||
font-family: 'gilroy-bold';
|
||||
src: url('../fonts/Gilroy/gilroy-bold-webfont.woff2') format('woff2'),
|
||||
url('./theme/custom/quartiers_de_demain/dist/assets/fonts/Gilroy/gilroy-bold-webfont.woff') format('woff');
|
||||
url('../fonts/Gilroy/gilroy-bold-webfont.woff') format('woff');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
|
||||
@@ -76,8 +73,8 @@
|
||||
|
||||
@font-face {
|
||||
font-family: 'gilroy-mediumital';
|
||||
src: url('./theme/custom/quartiers_de_demain/dist/assets/fonts/Gilroy/gilroy-mediumitalic-webfont.woff2') format('woff2'),
|
||||
url('./theme/custom/quartiers_de_demain/dist/assets/fonts/Gilroy/gilroy-mediumitalic-webfont.woff') format('woff');
|
||||
src: url('../fonts/Gilroy/gilroy-mediumitalic-webfont.woff2') format('woff2'),
|
||||
url('../fonts/Gilroy/gilroy-mediumitalic-webfont.woff') format('woff');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
|
||||
|
||||
@@ -8,7 +8,7 @@ $font-extra: 2.3rem;
|
||||
$font-large: 1.6rem;
|
||||
$font-big: 1.2rem;
|
||||
$font-medium: .8rem;
|
||||
$font-normal: .6rem;
|
||||
$font-normal: .8rem;
|
||||
$font-small: .45rem;
|
||||
|
||||
|
||||
@@ -18,4 +18,11 @@ p{
|
||||
|
||||
h3{
|
||||
font-size: $font-big;
|
||||
}
|
||||
|
||||
h1{
|
||||
font-family: 'gilroy-bold';
|
||||
}
|
||||
h2{
|
||||
font-family: 'gilroy-semibold';
|
||||
}
|
||||
@@ -8,6 +8,7 @@
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
||||
#block-quartiers-de-demain-titredepage{
|
||||
margin-top: 1rem;
|
||||
width: fit-content;
|
||||
@@ -15,7 +16,6 @@
|
||||
text-transform: none;
|
||||
color: black;
|
||||
font-size: 2rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
|
||||
@@ -29,7 +29,9 @@
|
||||
width: 80% ;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.field_field_title{
|
||||
font-family: 'gilroy-semibold';
|
||||
}
|
||||
width: 80%;
|
||||
.paragraph--type--static-parts:not(#paragraph-id--7){
|
||||
#svg1{
|
||||
@@ -44,7 +46,6 @@
|
||||
padding: 1rem;
|
||||
color: $blue_QDD;
|
||||
font-size: 2.5rem;
|
||||
font-weight: 500;
|
||||
@media(max-width: 500px){
|
||||
font-size: 2.2rem;
|
||||
padding: 0rem;
|
||||
@@ -69,7 +70,7 @@
|
||||
content:"";
|
||||
display: block;
|
||||
border-left: solid 1px $blue_QDD;
|
||||
height: 30%;
|
||||
height: 20%;
|
||||
margin-bottom: 0.5rem;
|
||||
@media(max-width: 500px){
|
||||
height: 15%;
|
||||
@@ -82,6 +83,7 @@
|
||||
// flex: 1 80%;
|
||||
width: 55%;
|
||||
padding-top: 2rem;
|
||||
margin-top: 2rem;
|
||||
margin: auto;
|
||||
@media(max-width: 500px){
|
||||
width: 80%;
|
||||
@@ -91,7 +93,7 @@
|
||||
}
|
||||
}
|
||||
#paragraph-id--11{
|
||||
width: 65%;
|
||||
width: 70%;
|
||||
background-color: white;
|
||||
margin: auto;
|
||||
display: flex;
|
||||
@@ -105,7 +107,6 @@
|
||||
.field_field_title{
|
||||
color: $blue_QDD;
|
||||
font-size: 1.2rem;
|
||||
font-weight: 500;
|
||||
@media(max-width: 500px){
|
||||
width: 80%;
|
||||
}
|
||||
@@ -115,18 +116,18 @@
|
||||
grid-template-columns: auto auto;
|
||||
grid-template-rows: auto auto;
|
||||
padding: 1rem;
|
||||
@media(max-width: 500px){
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
p{
|
||||
flex: 1 15%;
|
||||
padding: 0rem;
|
||||
margin: 0;
|
||||
|
||||
&:nth-of-type(1){
|
||||
grid-column: 1;
|
||||
grid-row: 2;
|
||||
padding-right: 5rem;
|
||||
@media(max-width: 500px){
|
||||
padding-right: 1rem;
|
||||
}
|
||||
}
|
||||
&:nth-of-type(2){
|
||||
grid-column: 2;
|
||||
@@ -135,8 +136,8 @@
|
||||
}
|
||||
h5{
|
||||
|
||||
font-size: 3rem;
|
||||
font-weight: 500;
|
||||
font-size: 3.5rem;
|
||||
font-family: 'gilroy-semibold';
|
||||
color: $blue_QDD;
|
||||
margin: 0;
|
||||
height: fit-content;
|
||||
@@ -167,14 +168,18 @@
|
||||
color: $blue_QDD;
|
||||
font-size: 1.2rem;
|
||||
font-weight: 500;
|
||||
padding-bottom: 1.5rem;
|
||||
padding-bottom: 1rem;
|
||||
@media(max-width: 500px){
|
||||
padding-bottom: 0.8rem;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
#paragraph-id--12{
|
||||
.field_field_texte{
|
||||
width: 80%;
|
||||
}
|
||||
}
|
||||
#paragraph-id--12::after{
|
||||
content:"";
|
||||
display: block;
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
}
|
||||
}
|
||||
.paragraph--type--static-parts{
|
||||
padding-top: 2rem;
|
||||
padding-top: 4rem;
|
||||
padding-bottom: 2rem;
|
||||
}
|
||||
article.node-type-static{
|
||||
@@ -15,6 +15,9 @@
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap ;
|
||||
@media(max-width: 1090px){
|
||||
flex-direction: column;
|
||||
}
|
||||
> p:nth-child(1){
|
||||
margin-bottom: 0;
|
||||
flex: 1 100%;
|
||||
@@ -38,21 +41,30 @@
|
||||
padding-left: 0 ;
|
||||
}
|
||||
}
|
||||
> p:nth-child(3){
|
||||
@media(max-width: 1090px){
|
||||
padding-top: 0 ;
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
.field_field_title{
|
||||
width: fit-content;
|
||||
margin: auto;
|
||||
font-size: 2rem;
|
||||
font-weight: 800;
|
||||
font-family: 'gilroy-bold';
|
||||
padding-bottom: 1rem;
|
||||
}
|
||||
#paragraph-id--1{ ///// Les enjeux
|
||||
background-color: #edefe8;
|
||||
.field_field_title{
|
||||
font-family: 'gilroy-bold';
|
||||
}
|
||||
.field_field_picto{
|
||||
display: none;
|
||||
}
|
||||
.field_field_texte{
|
||||
width: 50%;
|
||||
width: 65%;
|
||||
margin: auto;
|
||||
@media(max-width: 1090px){
|
||||
width: 80%;
|
||||
@@ -62,22 +74,24 @@
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
justify-content: flex-start;
|
||||
padding-left: 6rem;
|
||||
@media(max-width: 1090px){
|
||||
padding-left: 1.5rem;
|
||||
}
|
||||
|
||||
h3{
|
||||
flex: 1 100%;
|
||||
flex: 0 80%;
|
||||
color: #0833c2ff;
|
||||
// width: 80%;
|
||||
// padding-right: 3rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
font-size: 1rem;
|
||||
&:nth-of-type(2){
|
||||
|
||||
padding-top: 3rem;
|
||||
border-top: solid 1px #0833c2ff;
|
||||
}
|
||||
}
|
||||
p{
|
||||
padding-right: 2rem;
|
||||
padding-right: 1rem;
|
||||
padding-bottom: 1rem;
|
||||
flex: 1 30%;
|
||||
max-width: 30%;
|
||||
@@ -91,11 +105,11 @@
|
||||
}
|
||||
&:nth-of-type(1)::before{
|
||||
background-image: url("../img/fanion.svg");
|
||||
background-size: 60px 80px;
|
||||
background-size: 90px 100px;
|
||||
background-repeat: no-repeat;
|
||||
display: inline-block;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
content: "";
|
||||
padding-bottom: 1rem;
|
||||
@media(max-width: 500px){
|
||||
@@ -106,11 +120,11 @@
|
||||
}
|
||||
&:nth-of-type(2)::before{
|
||||
background-image: url("../img/pouce.svg");
|
||||
background-size: 60px 80px;
|
||||
background-size: 90px 100px;
|
||||
background-repeat: no-repeat;
|
||||
display: inline-block;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
content: "";
|
||||
padding-bottom: 1rem;
|
||||
@media(max-width: 500px){
|
||||
@@ -121,11 +135,11 @@
|
||||
}
|
||||
&:nth-of-type(3)::before{
|
||||
background-image: url("../img/planete.svg");
|
||||
background-size: 60px 80px;
|
||||
background-size: 90px 100px;
|
||||
background-repeat: no-repeat;
|
||||
display: inline-block;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
content: "";
|
||||
padding-bottom: 1rem;
|
||||
@media(max-width: 500px){
|
||||
@@ -137,11 +151,11 @@
|
||||
}
|
||||
&:nth-of-type(4)::before{
|
||||
background-image: url("../img/puzzle.svg");
|
||||
background-size: 60px 80px;
|
||||
background-size: 90px 100px;
|
||||
background-repeat: no-repeat;
|
||||
display: inline-block;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
content: "";
|
||||
padding-bottom: 1rem;
|
||||
@media(max-width: 500px){
|
||||
@@ -152,11 +166,11 @@
|
||||
}
|
||||
&:nth-of-type(5)::before{
|
||||
background-image: url("../img/cube.svg");
|
||||
background-size: 70px 80px;
|
||||
background-size: 100px 100px;
|
||||
background-repeat: no-repeat;
|
||||
display: inline-block;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
content: "";
|
||||
padding-bottom: 1rem;
|
||||
@media(max-width: 500px){
|
||||
@@ -167,11 +181,11 @@
|
||||
}
|
||||
&:nth-of-type(6)::before{
|
||||
background-image: url("../img/ampoule.svg");
|
||||
background-size: 60px 80px;
|
||||
background-size: 90px 100px;
|
||||
background-repeat: no-repeat;
|
||||
display: inline-block;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
content: "";
|
||||
padding-bottom: 1rem;
|
||||
@media(max-width: 500px){
|
||||
@@ -182,11 +196,11 @@
|
||||
}
|
||||
&:nth-of-type(7)::before{
|
||||
background-image: url("../img/bonhome.svg");
|
||||
background-size: 60px 80px;
|
||||
background-size: 90px 100px;
|
||||
background-repeat: no-repeat;
|
||||
display: inline-block;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
content: "";
|
||||
padding-bottom: 1rem;
|
||||
@media(max-width: 500px){
|
||||
@@ -197,11 +211,11 @@
|
||||
}
|
||||
&:nth-of-type(8)::before{
|
||||
background-image: url("../img/feuilles.svg");
|
||||
background-size: 60px 80px;
|
||||
background-size: 90px 100px;
|
||||
background-repeat: no-repeat;
|
||||
display: inline-block;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
content: "";
|
||||
padding-bottom: 1rem;
|
||||
@media(max-width: 500px){
|
||||
@@ -212,11 +226,11 @@
|
||||
}
|
||||
&:nth-of-type(9)::before{
|
||||
background-image: url("../img/calendrier.svg");
|
||||
background-size: 60px 80px;
|
||||
background-size: 90px 100px;
|
||||
background-repeat: no-repeat;
|
||||
display: inline-block;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
content: "";
|
||||
padding-bottom: 1rem;
|
||||
@media(max-width: 500px){
|
||||
@@ -227,11 +241,11 @@
|
||||
}
|
||||
&:nth-of-type(10)::before{
|
||||
background-image: url("../img/crayons.svg");
|
||||
background-size: 48px 80px;
|
||||
background-size: 60px 100px;
|
||||
background-repeat: no-repeat;
|
||||
display: inline-block;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
content: "";
|
||||
padding-bottom: 1rem;
|
||||
@media(max-width: 500px){
|
||||
@@ -245,38 +259,50 @@
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
#paragraph-id--6{ /////// quartier 2030
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin: auto;
|
||||
align-items: center;
|
||||
width: 70%;
|
||||
padding-bottom: 2rem;
|
||||
@media(max-width: 500px){
|
||||
width: 90%;
|
||||
text-align: center;
|
||||
}
|
||||
.field_field_title{
|
||||
padding-top: 4rem;
|
||||
padding-bottom: 2rem;
|
||||
@media(max-width: 500px){
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
}
|
||||
.field_field_texte{
|
||||
width: 50%;
|
||||
margin: auto;
|
||||
@media(max-width: 500px){
|
||||
width: 90%;
|
||||
}
|
||||
.colone-picto{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
> p:nth-of-type(1){
|
||||
color: #0833c2ff;
|
||||
font-size: 1.5rem;
|
||||
font-size: 1rem;
|
||||
font-weight: 800
|
||||
}
|
||||
> p:nth-of-type(2){
|
||||
width: 60%;
|
||||
font-size: 1.2rem;
|
||||
font-size: 0.8rem;
|
||||
align-self: center;
|
||||
padding-top: 1.5rem;
|
||||
@media(max-width: 500px){
|
||||
width: 80%;
|
||||
padding-top: 0;
|
||||
}
|
||||
}
|
||||
> p:nth-of-type(3){
|
||||
width: 80%;
|
||||
width: 90%;
|
||||
align-self: center;
|
||||
margin-top: 0 ;
|
||||
img{
|
||||
@@ -287,6 +313,7 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#paragraph-id--7{ ///////// les piliers
|
||||
background-color: #0833c2ff;
|
||||
display: flex;
|
||||
@@ -296,21 +323,27 @@
|
||||
padding-bottom: 2rem;
|
||||
color: white;
|
||||
.field_field_title{
|
||||
width: 50%;
|
||||
width: 48%;
|
||||
text-transform: lowercase;
|
||||
padding-top: 3rem;
|
||||
text-align: center;
|
||||
font-size: 1.8rem;
|
||||
@media(max-width: 550px){
|
||||
width: 90%;
|
||||
}
|
||||
}
|
||||
.field_field_texte{
|
||||
width: 80%;
|
||||
@media(max-width: 700px){
|
||||
position: relative;
|
||||
top: -80px;
|
||||
}
|
||||
.colone-picto{
|
||||
margin-top: 2rem;
|
||||
padding-left: 4rem;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(6 auto);
|
||||
grid-template-rows: repeat(3 1fr);
|
||||
grid-template-rows: repeat(3 auto);
|
||||
@media(max-width: 700px){
|
||||
grid-template-rows: repeat(10 auto);
|
||||
grid-template-columns: repeat(2 1fr);
|
||||
@@ -325,6 +358,7 @@
|
||||
h5:nth-of-type(1){
|
||||
grid-row: 2;
|
||||
grid-column: 1;
|
||||
padding-left: 1rem;
|
||||
|
||||
}
|
||||
h5:nth-of-type(2){
|
||||
@@ -334,6 +368,8 @@
|
||||
grid-row: 4;
|
||||
grid-column: 2;
|
||||
margin: auto;
|
||||
top: -50px;
|
||||
position: relative;
|
||||
}
|
||||
}
|
||||
h5:nth-of-type(3){
|
||||
@@ -342,50 +378,76 @@
|
||||
@media(max-width: 700px){
|
||||
grid-row: 8;
|
||||
grid-column: 1;
|
||||
padding-left: 1rem;
|
||||
}
|
||||
}
|
||||
p{
|
||||
font-size: 1rem;
|
||||
font-size: 0.8rem;
|
||||
font-weight: 400;
|
||||
margin: 0;
|
||||
&:not(:last-of-type){
|
||||
padding-right: 2rem;
|
||||
}
|
||||
@media(max-width: 700px){
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
}
|
||||
svg:nth-of-type(1){
|
||||
grid-row: 1 /span 2;
|
||||
grid-column: 1 /span 2;
|
||||
padding: 1rem;
|
||||
@media(max-width: 700px){
|
||||
width: 315px;
|
||||
width: 260px;
|
||||
top: 50px;
|
||||
position: relative;
|
||||
}
|
||||
}
|
||||
svg:nth-of-type(2){
|
||||
grid-row: 3;
|
||||
grid-column: inherit;
|
||||
padding: 1rem;
|
||||
padding-left: 0;
|
||||
@media(max-width: 700px){
|
||||
grid-row: 4;
|
||||
grid-column: 1 /span 2 ;
|
||||
width: 315px;
|
||||
width: 260px;
|
||||
padding-left: 1rem;
|
||||
|
||||
}
|
||||
}
|
||||
svg:nth-of-type(3){
|
||||
grid-row: 1 /span 2;
|
||||
grid-column: 5 /span 6;
|
||||
padding: 1rem;
|
||||
padding-left: 0;
|
||||
position: relative;
|
||||
left: -0.5rem;
|
||||
@media(max-width: 700px){
|
||||
grid-row: 8 ;
|
||||
grid-column: 1 /span 2;
|
||||
width: 315px;
|
||||
width: 260px;
|
||||
top: -50px;
|
||||
left: 0rem;
|
||||
padding-left: 1rem;
|
||||
position: relative;
|
||||
}
|
||||
}
|
||||
p:nth-of-type(1){
|
||||
grid-row: 3;
|
||||
grid-column: 1 /span 2;
|
||||
padding-left: 1rem;
|
||||
}
|
||||
p:nth-of-type(2){
|
||||
display: block;
|
||||
grid-row: 1;
|
||||
height: fit-content;
|
||||
padding-top: 0%;
|
||||
@media(max-width: 700px){
|
||||
grid-row: 7;
|
||||
grid-column: 1 /span 2;
|
||||
padding: 1rem;
|
||||
top: -60px;
|
||||
position: relative;
|
||||
}
|
||||
}
|
||||
p:nth-of-type(3){
|
||||
@@ -394,6 +456,9 @@
|
||||
@media(max-width: 700px){
|
||||
grid-row: 9;
|
||||
grid-column: 1 /span 2;
|
||||
padding-left: 1rem;
|
||||
top: -80px;
|
||||
position: relative;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -5,11 +5,11 @@
|
||||
padding-bottom: 3rem;
|
||||
h2{
|
||||
width: fit-content;
|
||||
padding-bottom: 0.4rem;
|
||||
margin-top: 3rem;
|
||||
padding-bottom: 1.5rem;
|
||||
margin-top: 4rem;
|
||||
margin-bottom: 3rem;
|
||||
font-size: 1.7rem;
|
||||
font-weight: bold;
|
||||
font-family: 'gilroy-semibold';
|
||||
}
|
||||
.content-actus{
|
||||
.view{
|
||||
@@ -20,8 +20,9 @@
|
||||
|
||||
}
|
||||
.views-row{
|
||||
width: 500px !important;
|
||||
padding: 2rem;
|
||||
width: 650px !important;
|
||||
padding: 1rem;
|
||||
|
||||
@media(max-width: 550px){
|
||||
width: 296px !important;
|
||||
}
|
||||
@@ -29,19 +30,43 @@
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.field_field_images{
|
||||
background-color: black;
|
||||
-moz-border-radius: 9px; /* pour Mozilla */
|
||||
-khtml-border-radius: 9px; /* pour Safari et Chrome */
|
||||
-webkit-border-radius: 9px; /* pour Safari sur Mac */
|
||||
border-radius: 9px; /* CSS3 */
|
||||
height: 250px;
|
||||
height: 350px;
|
||||
margin-bottom: 0.6rem;
|
||||
@media(max-width: 550px){
|
||||
height: 170px;
|
||||
}
|
||||
div{
|
||||
height: 100%;
|
||||
div{
|
||||
height: 100%;
|
||||
|
||||
a{
|
||||
display: block;
|
||||
height: 100%;
|
||||
img{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
-moz-border-radius: 9px; /* pour Mozilla */
|
||||
-khtml-border-radius: 9px; /* pour Safari et Chrome */
|
||||
-webkit-border-radius: 9px; /* pour Safari sur Mac */
|
||||
border-radius: 9px; /* CSS3 */
|
||||
@media(max-width: 550px){
|
||||
max-height: 170px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
img{
|
||||
width: 100%;
|
||||
height: fit-content;
|
||||
max-height: 250px;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
-moz-border-radius: 9px; /* pour Mozilla */
|
||||
-khtml-border-radius: 9px; /* pour Safari et Chrome */
|
||||
@@ -56,33 +81,38 @@
|
||||
.field_field_type_d_actualite{
|
||||
text-transform: uppercase;
|
||||
color: red;
|
||||
font-size: 0.6rem;
|
||||
font-weight: 600;
|
||||
font-size: 0.8rem;
|
||||
font-family: 'gilroy-bold';
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
&::before{
|
||||
content: url('../img/type-actu.svg');
|
||||
padding-right: 0.2rem;
|
||||
padding-right: 0.3rem;
|
||||
padding-bottom: 0.2rem;
|
||||
}
|
||||
}
|
||||
.field_field_date{
|
||||
color: red;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
font-size: 0.6rem;
|
||||
font-size: 0.8rem;
|
||||
font-family: 'gilroy-bold';
|
||||
|
||||
&::before{
|
||||
content: url('../img/date-actu.svg');
|
||||
padding-right: 0.2rem;
|
||||
padding-right: 0.3rem;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.field_title{
|
||||
padding-top: 0.5rem;
|
||||
h2{
|
||||
margin: 0;
|
||||
line-height: 0.4;
|
||||
padding-bottom: 0.8rem;
|
||||
a{
|
||||
font-size: 0.8rem;
|
||||
font-size: 1rem;
|
||||
color: $blue_QDD;
|
||||
}
|
||||
}
|
||||
@@ -93,6 +123,7 @@
|
||||
transform: none !important;
|
||||
p{
|
||||
margin: 0;
|
||||
font-size: 0.9rem ;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -223,15 +223,3 @@ header{
|
||||
}
|
||||
|
||||
}
|
||||
// /* Initial state of SVG */
|
||||
// .qdd-animated{
|
||||
// opacity: 1;
|
||||
// transform: scale(0.5);
|
||||
// transition: opacity 0.5s, transform 0.5s;
|
||||
// }
|
||||
|
||||
// /* Animated state of SVG */
|
||||
// .header:not(.header--collapsed .header--collapsed-already) .qdd-animated {
|
||||
// opacity: 1;
|
||||
// transform: scale(1);
|
||||
// }
|
||||
@@ -115,7 +115,7 @@ $slick-opacity-not-active: 0.25 !default;
|
||||
.slick-prev {
|
||||
left: 46%;
|
||||
@media(max-width:810px){
|
||||
left: 36%;
|
||||
left: 29%;
|
||||
}
|
||||
[dir="rtl"] & {
|
||||
left: auto;
|
||||
|
||||
@@ -16,9 +16,9 @@
|
||||
h2{
|
||||
width: fit-content;
|
||||
margin: auto;
|
||||
padding-top: 3rem;
|
||||
padding-top: 4rem;
|
||||
font-size: 1.7rem;
|
||||
font-weight: bold;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
@@ -112,9 +112,9 @@
|
||||
margin: auto;
|
||||
align-items: flex-start;
|
||||
padding-right: 1rem;
|
||||
margin-bottom: 2rem;
|
||||
margin-bottom: 1rem;
|
||||
.field_field_date_de_jour{
|
||||
font-size: 2rem;
|
||||
font-size: 2.5rem;
|
||||
line-height: 0.3rem;
|
||||
@media(max-width:550px){
|
||||
font-size: 3rem;
|
||||
@@ -124,7 +124,7 @@
|
||||
.field_field_date_de_moi{
|
||||
padding-right: 0.2rem;
|
||||
text-transform: uppercase;
|
||||
font-size: 3rem;
|
||||
font-size: 4rem;
|
||||
display: inline-flex;
|
||||
@media(max-width:550px){
|
||||
font-size: 4rem;
|
||||
@@ -186,7 +186,7 @@
|
||||
// width: fit-content;
|
||||
min-width: 65%;
|
||||
.field_field_titre{
|
||||
font-size: 0.5rem;
|
||||
font-size: 0.6rem;
|
||||
font-weight: 800;
|
||||
@media(max-width:1090px){
|
||||
font-size: 1rem;
|
||||
@@ -194,7 +194,7 @@
|
||||
}
|
||||
.field_field_description{
|
||||
p{
|
||||
font-size: 0.5rem !important;
|
||||
font-size: 0.6rem !important;
|
||||
margin: 0;
|
||||
@media(max-width:1090px){
|
||||
font-size: 1rem !important;
|
||||
|
||||
Reference in New Issue
Block a user