css bandeau zoom projets sur home

This commit is contained in:
2023-06-20 12:09:38 +02:00
parent 954ffe2c8c
commit 90cd59bf62
3 changed files with 195 additions and 6 deletions
+81 -3
View File
@@ -471,9 +471,10 @@ a {
visibility: hidden; }
.path-frontpage .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) {
padding-top: 2rem; }
padding-top: 2rem;
padding-bottom: 4rem; }
.path-frontpage .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static {
width: 70%;
width: 80%;
margin: auto; }
@media (max-width: 479px) {
.path-frontpage .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static {
@@ -537,7 +538,84 @@ a {
.path-frontpage .block-views-blockprojets-block-4 {
border-top: 5px solid #009ee3;
background: rgba(0, 158, 227, 0.2); }
background: rgba(0, 158, 227, 0.2);
padding-top: 2rem;
padding-bottom: 4rem; }
.path-frontpage .block-views-blockprojets-block-4 span h2 {
width: 80%;
margin: auto;
padding-top: 1rem;
padding-bottom: 5rem;
text-transform: uppercase;
color: #e1000f;
font-family: 'Source Code Pro';
font-weight: 1000; }
.path-frontpage .block-views-blockprojets-block-4 .view-projets {
width: 80%;
margin: auto; }
.path-frontpage .block-views-blockprojets-block-4 .view-projets .view-content {
display: flex;
flex-direction: row;
justify-content: space-between; }
.path-frontpage .block-views-blockprojets-block-4 .view-projets .view-content .views-row {
width: 49%; }
.path-frontpage .block-views-blockprojets-block-4 .view-projets .view-content .views-row .node-type-projet {
color: #09398b;
line-height: 1.5rem; }
@media (max-width: 479px) {
.path-frontpage .block-views-blockprojets-block-4 .view-projets .view-content .views-row .node-type-projet {
padding-left: 0rem;
padding-right: 0rem;
padding-top: 2rem; } }
.path-frontpage .block-views-blockprojets-block-4 .view-projets .view-content .views-row .node-type-projet div:first-child {
display: flex;
flex-direction: column; }
.path-frontpage .block-views-blockprojets-block-4 .view-projets .view-content .views-row .node-type-projet div:first-child a {
color: #09398b; }
.path-frontpage .block-views-blockprojets-block-4 .view-projets .view-content .views-row .node-type-projet div:first-child .field--name-field-photo {
order: 1; }
.path-frontpage .block-views-blockprojets-block-4 .view-projets .view-content .views-row .node-type-projet div:first-child .field--name-field-photo img {
width: 100%;
object-fit: cover;
height: fit-content; }
.path-frontpage .block-views-blockprojets-block-4 .view-projets .view-content .views-row .node-type-projet div:first-child .field--name-field-adresse {
order: 2;
display: flex;
text-transform: uppercase;
font-size: 0.9rem;
font-weight: 800;
margin-top: 0.8rem;
line-height: 0.6rem; }
.path-frontpage .block-views-blockprojets-block-4 .view-projets .view-content .views-row .node-type-projet div:first-child .field--name-field-adresse .address {
display: flex;
flex-direction: row;
margin: 0; }
.path-frontpage .block-views-blockprojets-block-4 .view-projets .view-content .views-row .node-type-projet div:first-child .field--name-field-adresse .address .locality {
padding-top: 0 !important;
padding-bottom: 0 !important; }
.path-frontpage .block-views-blockprojets-block-4 .view-projets .view-content .views-row .node-type-projet div:first-child .field--name-field-adresse .address .locality::after {
content: ",";
margin-right: 0.3rem; }
.path-frontpage .block-views-blockprojets-block-4 .view-projets .view-content .views-row .node-type-projet div:first-child .field--name-field-adresse .address .country {
padding-top: 0 !important;
padding-bottom: 0 !important; }
.path-frontpage .block-views-blockprojets-block-4 .view-projets .view-content .views-row .node-type-projet div:first-child .field--name-field-sous-titre {
margin-top: 0.5rem;
font-size: 0.9rem;
font-weight: 800;
order: 4; }
.path-frontpage .block-views-blockprojets-block-4 .view-projets .view-content .views-row .node-type-projet div:first-child .field--name-title {
order: 3;
margin-top: 0.5rem;
font-size: 0.9rem;
font-weight: 800; }
.path-frontpage .block-views-blockprojets-block-4 .view-projets .view-content .views-row .node-type-projet div:first-child .field--name-title h2 {
margin: 0; }
.path-frontpage .block-views-blockprojets-block-4 .view-projets .view-content .views-row .node-type-projet div:first-child .field--name-field-incube {
order: 4;
color: #e1000f;
margin-top: 0.8rem;
font-size: 0.7rem; }
.node-id-20 {
background: url("../images/pictos/carre-contour-bleu_partenaire.svg");
@@ -7,4 +7,5 @@ $blue-dark: rgb(9,57,139);
$grey-background: rgb(153,147,174);
$black: rgb(0,0,0);
$white: rgb(255,255,255);
$background-actus: rgba(0,158,227, 0.2);
$background-actus: rgba(0,158,227, 0.2);
$red: rgb(225,0,15);
+112 -2
View File
@@ -100,6 +100,7 @@
}
}
}
// bouton voir toutes actus du bandeau bleu
.block-block-content3ee1f633-aaa7-4b4c-a42a-02206e26d3a2{
visibility: hidden;
@@ -151,6 +152,7 @@
.view-display-id-block_2:is(.view-id-home_nodes){
padding-top: 2rem;
padding-bottom: 4rem;
// // background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" version="1.1"><rect x="0" y="0" width="80" height="80" transform="rotate(35) translate(430, -800) scale(15)" fill="none" stroke="rgb(0,158,227)" stroke-width="0.4px"/></svg>');
// background: url('../images/pictos/carre-contour-bleu.svg');
// // background-position-y: 50%;
@@ -160,7 +162,7 @@
.node-type-static{
width: 70%;
width: 80%;
margin: auto;
@media (max-width: 479px) {
width: 80%;
@@ -256,7 +258,115 @@
.block-views-blockprojets-block-4{
border-top: 5px solid $blue-light;
background: $background-actus;
padding-top: 2rem;
padding-bottom: 4rem;
span h2{
width: 80%;
margin: auto;
padding-top: 1rem;
padding-bottom: 5rem;
text-transform: uppercase;
color: $red;
font-family: 'Source Code Pro';
font-weight: 1000;
}
.view-projets{
width: 80%;
margin: auto;
.view-content{
display: flex;
flex-direction: row;
justify-content: space-between;
.views-row{
width: 49%;
.node-type-projet{
color: $blue-dark;
line-height: 1.5rem;
// padding: 0.5rem;
// padding-right: 1rem;
// padding-left: 1rem;
@media (max-width: 479px){
padding-left: 0rem;
padding-right: 0rem;
padding-top: 2rem;
}
div:first-child{
display: flex;
flex-direction: column;
a{
color: $blue-dark;
}
.field--name-field-photo {
order:1;
img{
width: 100%;
object-fit: cover;
height: fit-content;
}
// &::after{
// display: block;
// content:url('data:image/svg+xml,<svg width="160" height="25" xmlns="http://www.w3.org/2000/svg" version="1.1"> <line x1="0" x2="80" y1="20" y2="20" stroke-linecap="cube" stroke="rgb(9,57,139)" stroke-width="2.5"/></svg>');
// }
}
.field--name-field-adresse{
order:2;
display: flex;
text-transform: uppercase;
font-size: 0.9rem;
font-weight: 800;
margin-top: 0.8rem;
line-height: 0.6rem;
.address{
display: flex;
flex-direction: row;
margin: 0;
.locality{
padding-top: 0 !important;
padding-bottom: 0 !important;
&::after{
content:",";
margin-right: 0.3rem;
}
}
.country{
padding-top: 0 !important;
padding-bottom: 0 !important;
} }
}
.field--name-field-sous-titre{
margin-top: 0.5rem;
font-size: 0.9rem;
font-weight: 800;
order: 4;
}
.field--name-title{
order: 3;
margin-top: 0.5rem;
font-size: 0.9rem;
font-weight: 800;
h2{margin: 0;}
}
.field--name-field-incube{
order:4;
color: $red;
margin-top: 0.8rem;
font-size: 0.7rem;
}
}
}
// .node-type-projet{
// .field--type-image img{
// object-fit: cover;
// width: 100%;
// }
// }
}
}
}
}
}