home + responsive

This commit is contained in:
2022-03-10 10:53:52 +01:00
parent d8632851a9
commit 3f4ffd88de
10 changed files with 2190 additions and 78 deletions
@@ -23,6 +23,11 @@
display: grid;
grid-template-columns: 1fr repeat(8, 2fr) 1fr;
@media (max-width: 810px){
display: flex;
flex-direction: column;
}
/// carte
.block-views-blockprojets-block-2{
grid-column: 1 / span 10;
@@ -30,6 +35,7 @@
//texte de présentation
.block-config-pages-block{
grid-column: 3 / span 5;
// width: 60%;
margin: auto;
@@ -43,50 +49,65 @@
}
}
}
@media (max-width: 810px){
padding: 2rem;
}
}
// bouton projets incubés
.block-block-contentaffaf220-dd27-4c9d-ae02-8044c2662220{
grid-column: 8 / span 9;
margin-top: 4rem;
background-color: $blue-light;
height: fit-content;
width: 60%;
margin-left: 2rem;
grid-row: 2;
.display{
grid-column: 8 / span 9;
margin-top: 4rem;
background-color: $blue-light;
height: fit-content;
width: 60%;
margin-left: 2rem;
grid-row: 2;
.display{
display: block;
}
.field--name-field-lien{
display: flex;
flex-direction: column;
margin-top: 2rem;
margin-bottom: 2rem;
margin-left: 1.5rem;
margin-right: 1.5rem;
text-align: center;
a{
font-weight: 800;
color: $white;
font-size: 1.3rem;
}
&:after{
margin-left: auto;
padding-top: 1rem;
display: block;
content:url("../images/pictos/noun_Arrow_3771902.svg")
}
.field--name-field-lien{
display: flex;
flex-direction: column;
margin-top: 2rem;
margin-bottom: 2rem;
margin-left: 1.5rem;
margin-right: 1.5rem;
text-align: center;
a{
font-weight: 800;
color: $white;
font-size: 1.3rem;
}
&:after{
margin-left: auto;
padding-top: 1rem;
display: block;
content:url("../images/pictos/noun_Arrow_3771902.svg")
}
}
}
@media (max-width: 810px){
margin: auto;
}
}
//partie projets
.block-views-blockprojets-block-1{
grid-column: 3 / span 8;
// width: 80%;
@media (max-width: 810px){
padding: 2rem;
}
.view-projets{
// width: 80%;
@@ -120,9 +141,17 @@
margin-top: 2rem;
display: flex;
flex-direction: row;
@media (max-width: 810px){
flex-direction: column;
}
.views-row{
width: 25%;
flex: 0 0 25%;
// flex: 0 0 25%;
@media (max-width: 810px){
width: 100%;
}
}
}