grid bandeau actu home

This commit is contained in:
2021-11-20 21:50:15 +01:00
parent f054bbc577
commit 56541059f2
2 changed files with 23 additions and 16 deletions
@@ -219,16 +219,13 @@ a {
font-size: 2rem; } font-size: 2rem; }
.block-views-blockactus-blocks-pages-block-1 { .block-views-blockactus-blocks-pages-block-1 {
background-color: #09398b; background-color: #09398b; }
padding: 1rem; }
.block-views-blockactus-blocks-pages-block-1 .view-content { .block-views-blockactus-blocks-pages-block-1 .view-content {
display: flex; display: grid;
flex-direction: row; grid-template-columns: 1fr repeat(4, 2fr) 1fr;
padding-left: 8rem;
padding-right: 4rem;
margin: auto; } margin: auto; }
.block-views-blockactus-blocks-pages-block-1 .view-content .views-row { .block-views-blockactus-blocks-pages-block-1 .view-content .views-row:nth-of-type(1) {
width: 25%; } grid-column: 2; }
.block-views-blockactus-blocks-pages-block-1 .view-content .node-type-actualite { .block-views-blockactus-blocks-pages-block-1 .view-content .node-type-actualite {
color: white; color: white;
line-height: 1.5rem; line-height: 1.5rem;
+18 -8
View File
@@ -29,20 +29,30 @@
.block-views-blockactus-blocks-pages-block-1{ .block-views-blockactus-blocks-pages-block-1{
background-color: $blue-dark; background-color: $blue-dark;
padding: 1rem; // padding: 1rem;
.view-content{ .view-content{
display: flex; // display: flex;
flex-direction: row; // flex-direction: row;
display: grid;
grid-template-columns: 1fr repeat(4, 2fr) 1fr;
// grid-template-areas: "margin-left actu1 actu2 actu3 actu4 margin-right";
// justify-content: space-between; // justify-content: space-between;
padding-left: 8rem; // padding-left: 8rem;
padding-right: 4rem; // padding-right: 4rem;
margin: auto; margin: auto;
.views-row{ .views-row:nth-of-type(1) { grid-column: 2; }
width: 25%; // {
} // width: 25%;
// :nth-of-type(1) { grid-column: 2; } // marche pas, la première actu se mets dans la 1re colu
// :nth-of-type(2) { grid-area: actu2; }
// :nth-of-type(3) { grid-area: actu3; }
// :nth-of-type(4) { grid-area: actu4; }
// }
.node-type-actualite{ .node-type-actualite{
// grid-column: 2 / span 5;
color: $white; color: $white;
line-height: 1.5rem; line-height: 1.5rem;
padding: 0.5rem; padding: 0.5rem;