bachir/materio-d9
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

refactored home database materials

Browse Source
This commit is contained in:
Bachir Soussi Chiadmi
2020-12-27 11:09:03 +01:00
parent 0fc6347585
commit a2773b1b20
10 changed files with 294 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files

70
web/themes/custom/materiotheme/assets/styles/main.scss
View File

@ -510,14 +510,35 @@ article.node--type-frontpage{
}
}
// %part-columned-layout{
// display:grid;
// grid-template-columns: 300px 1fr;
// grid-column-gap: 2em;
// padding:2em 1em;
// >div:nth-child(1){
// color: #fff;
// grid-column: 1;
// .field__label{
// @extend %front-col-field__label;
// }
// .field__item{
// @extend %front-col-descritpion;
// }
// }
// >div:nth-child(2){
// grid-column: 2;
// }
// }
%part-columned-layout{
display:grid;
grid-template-columns: 300px 1fr;
grid-column-gap: 2em;
padding:2em 1em;
display:flex;
flex-direction: row;
flex-wrap: nowrap;
>div:nth-child(1){
flex: 0 0 $column_width * 2 + $column_goutiere;
box-sizing: border-box;
padding: 1em;
color: #fff;
grid-column: 1;
.field__label{
@extend %front-col-field__label;
}
@ -526,7 +547,9 @@ article.node--type-frontpage{
}
}
>div:nth-child(2){
grid-column: 2;
flex: 1 1 auto;
box-sizing: border-box;
padding: 1em 0.5em;
}
}
@ -574,25 +597,32 @@ article.node--type-frontpage{
ul{
width:100%;
margin:0; padding:0;
display: grid;
grid-template-columns: repeat(auto-fill, minmax(50px, 130px));
grid-template-rows: 1fr;
grid-gap: 1em;
justify-content:start;
// display: grid;
// grid-template-columns: repeat(auto-fill, minmax(50px, 130px));
// grid-template-rows: 1fr;
// grid-gap: 1em;
// justify-content:start;
display: flex;
flex-flow: row wrap;
justify-content: space-between;
li{
position: relative;
list-style: none;
margin:0; padding:0;
padding-top: 140%;
margin:0;
padding:0 0 $column_goutiere / 2 0;
box-sizing: border-box;
// padding-top: 140%;
width: $column_width / 2;
height: $card_height / 2;
.card{
position:absolute;
top:0; bottom:0;
left:0; right:0;
width: auto;
height: auto;
// position:absolute;
// top:0; bottom:0;
// left:0; right:0;
width: 100%;
height: 100%;
.field--name-field-short-description{
font-size: 0.756em;
line-height: 0.9;
font-size: 0.656em;
line-height: 1.2;
}
}
}