page ressource css

This commit is contained in:
2024-05-30 11:31:52 +02:00
parent e1b69fc5ac
commit d397966190
2 changed files with 176 additions and 169 deletions
+65 -99
View File
@@ -2110,6 +2110,7 @@ a {
.page-node-type-ressource .layout__region--top { .page-node-type-ressource .layout__region--top {
padding-top: 4rem; padding-top: 4rem;
/* Hide empty blocks */
} }
.page-node-type-ressource .layout__region--top .block-region-top { .page-node-type-ressource .layout__region--top .block-region-top {
display: flex; display: flex;
@@ -2118,8 +2119,8 @@ a {
@media screen and (min-width: 1100px) { @media screen and (min-width: 1100px) {
.page-node-type-ressource .layout__region--top .block-region-top { .page-node-type-ressource .layout__region--top .block-region-top {
display: grid; display: grid;
grid-template-columns: 1fr repeat(8, 1fr) 1fr; grid-template-columns: 1fr 2fr; /* 1/3 pour l'image, 2/3 pour le contenu */
grid-template-rows: auto; gap: 1rem;
} }
} }
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-images { .page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-images {
@@ -2129,8 +2130,59 @@ a {
} }
@media screen and (min-width: 1100px) { @media screen and (min-width: 1100px) {
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-images { .page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-images {
grid-column: 2/span 4; grid-column: 1/2;
grid-row: 1/span 5; grid-row: 1/span 7; /* Prendre toutes les lignes disponibles */
align-self: start; /* S'assurer qu'il commence en haut */
}
}
.page-node-type-ressource .layout__region--top .block-region-top .block-block-content4e5df355-e76c-4e44-bec0-e211d94f2640,
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-type-de-ressource,
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodetitle,
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-sous-titre,
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-edition,
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-auteur-s-,
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-date-de-parution,
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-mots-clefs {
width: 100%;
margin-left: 13%;
}
@media (max-width: 810px) {
.page-node-type-ressource .layout__region--top .block-region-top .block-block-content4e5df355-e76c-4e44-bec0-e211d94f2640,
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-type-de-ressource,
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodetitle,
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-sous-titre,
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-edition,
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-auteur-s-,
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-date-de-parution,
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-mots-clefs {
margin-left: 9%;
margin-right: 9%;
}
}
@media screen and (min-width: 1100px) {
.page-node-type-ressource .layout__region--top .block-region-top .block-block-content4e5df355-e76c-4e44-bec0-e211d94f2640,
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-type-de-ressource,
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodetitle,
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-sous-titre,
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-edition,
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-auteur-s-,
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-date-de-parution,
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-mots-clefs {
width: auto;
margin-left: 0;
grid-column: 2/3;
align-self: start; /* S'assurer qu'il commence en haut */
height: fit-content;
}
.page-node-type-ressource .layout__region--top .block-region-top .block-block-content4e5df355-e76c-4e44-bec0-e211d94f2640 p,
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-type-de-ressource p,
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodetitle p,
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-sous-titre p,
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-edition p,
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-auteur-s- p,
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-date-de-parution p,
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-mots-clefs p {
margin: 0;
} }
} }
.page-node-type-ressource .layout__region--top .block-region-top .block-block-content4e5df355-e76c-4e44-bec0-e211d94f2640 { .page-node-type-ressource .layout__region--top .block-region-top .block-block-content4e5df355-e76c-4e44-bec0-e211d94f2640 {
@@ -2146,13 +2198,6 @@ a {
padding-bottom: 0.5rem; padding-bottom: 0.5rem;
vertical-align: middle; vertical-align: middle;
} }
@media screen and (min-width: 1100px) {
.page-node-type-ressource .layout__region--top .block-region-top .block-block-content4e5df355-e76c-4e44-bec0-e211d94f2640 {
width: 50%;
grid-column: 5/span 7;
grid-row: 1;
}
}
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-type-de-ressource { .page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-type-de-ressource {
margin-top: 2rem; margin-top: 2rem;
margin-left: 13%; margin-left: 13%;
@@ -2160,75 +2205,23 @@ a {
text-transform: uppercase; text-transform: uppercase;
font-weight: 800; font-weight: 800;
} }
@media (max-width: 810px) {
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-type-de-ressource {
margin-left: 9%;
margin-right: 9%;
}
}
@media screen and (min-width: 1100px) {
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-type-de-ressource {
width: 50%;
grid-column: 5/span 7;
grid-row: 1;
}
}
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodetitle { .page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodetitle {
margin-left: 13%; margin-left: 13%;
font-size: 2rem; font-size: 2rem;
font-weight: 600; font-weight: 600;
} }
@media (max-width: 810px) {
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodetitle {
margin-left: 9%;
margin-right: 9%;
}
}
@media screen and (min-width: 1100px) {
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodetitle {
width: 50%;
grid-column: 5/span 7;
grid-row: 2;
}
}
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-sous-titre { .page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-sous-titre {
margin-left: 13%; margin-left: 13%;
} }
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-sous-titre .field--name-field-edition p { .page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-sous-titre .field--name-field-edition p {
margin-bottom: 0; margin-bottom: 0;
} }
@media (max-width: 810px) {
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-sous-titre {
margin-left: 9%;
margin-right: 9%;
}
}
@media screen and (min-width: 1100px) {
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-sous-titre {
width: 50%;
grid-column: 5/span 7;
grid-row: 3;
}
}
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-edition { .page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-edition {
margin-left: 13%; margin-left: 13%;
} }
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-edition .field--name-field-edition p { .page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-edition .field--name-field-edition p {
margin-bottom: 0; margin-bottom: 0;
} }
@media (max-width: 810px) {
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-edition {
margin-left: 9%;
margin-right: 9%;
}
}
@media screen and (min-width: 1100px) {
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-edition {
width: 50%;
grid-column: 5/span 7;
grid-row: 4;
}
}
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-auteur-s- { .page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-auteur-s- {
margin-left: 13%; margin-left: 13%;
} }
@@ -2239,35 +2232,9 @@ a {
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-auteur-s- .field--name-field-auteur-s- p { .page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-auteur-s- .field--name-field-auteur-s- p {
margin: 0; margin: 0;
} }
@media (max-width: 810px) {
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-auteur-s- {
margin-left: 9%;
margin-right: 9%;
}
}
@media screen and (min-width: 1100px) {
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-auteur-s- {
width: 50%;
grid-column: 5/span 7;
grid-row: 5;
}
}
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-date-de-parution { .page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-date-de-parution {
margin-left: 13%; margin-left: 13%;
} }
@media (max-width: 810px) {
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-date-de-parution {
margin-left: 9%;
margin-right: 9%;
}
}
@media screen and (min-width: 1100px) {
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-date-de-parution {
width: 50%;
grid-column: 5/span 7;
grid-row: 6;
}
}
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-mots-clefs { .page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-mots-clefs {
margin-left: 13%; margin-left: 13%;
} }
@@ -2285,10 +2252,6 @@ a {
vertical-align: middle; vertical-align: middle;
} }
@media (max-width: 810px) { @media (max-width: 810px) {
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-mots-clefs {
margin-left: 9%;
margin-right: 9%;
}
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-mots-clefs .field--name-field-mots-clefs { .page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-mots-clefs .field--name-field-mots-clefs {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
@@ -2298,12 +2261,15 @@ a {
margin-bottom: 0.5rem; margin-bottom: 0.5rem;
} }
} }
@media screen and (min-width: 800px) { .page-node-type-ressource .layout__region--top .block-block-content4e5df355-e76c-4e44-bec0-e211d94f2640:empty,
.page-node-type-ressource .layout__region--top .block-region-top .block-entity-fieldnodefield-mots-clefs { .page-node-type-ressource .layout__region--top .block-entity-fieldnodefield-type-de-ressource:empty,
width: 50%; .page-node-type-ressource .layout__region--top .block-entity-fieldnodetitle:empty,
grid-column: 5/span 7; .page-node-type-ressource .layout__region--top .block-entity-fieldnodefield-sous-titre:empty,
grid-row: 7; .page-node-type-ressource .layout__region--top .block-entity-fieldnodefield-edition:empty,
} .page-node-type-ressource .layout__region--top .block-entity-fieldnodefield-auteur-s-:empty,
.page-node-type-ressource .layout__region--top .block-entity-fieldnodefield-date-de-parution:empty,
.page-node-type-ressource .layout__region--top .block-entity-fieldnodefield-mots-clefs:empty {
display: none;
} }
.page-node-type-ressource .layout__region--first { .page-node-type-ressource .layout__region--first {
margin-top: 3rem; margin-top: 3rem;
+111 -70
View File
@@ -9,8 +9,10 @@
flex-direction: column; flex-direction: column;
@media screen and (min-width:1100px) { @media screen and (min-width:1100px) {
display: grid; display: grid;
grid-template-columns: 1fr repeat(8, 1fr) 1fr; // grid-template-columns: 1fr repeat(8, 1fr) 1fr;
grid-template-rows: auto; // grid-template-rows: auto;
grid-template-columns: 1fr 2fr; /* 1/3 pour l'image, 2/3 pour le contenu */
gap: 1rem;
} }
// &div:not(.block-entity-fieldnodefield-images){ // &div:not(.block-entity-fieldnodefield-images){
// @media screen and (min-width:800px) { // @media screen and (min-width:800px) {
@@ -23,11 +25,39 @@
margin: auto; margin: auto;
padding-right: 2rem; padding-right: 2rem;
@media screen and (min-width:1100px) { @media screen and (min-width:1100px) {
grid-column: 2/span 4; // grid-column: 2/span 4;
grid-row: 1 /span 5; // grid-row: 1 /span 5;
grid-column: 1 / 2;
grid-row: 1 /span 7; /* Prendre toutes les lignes disponibles */
align-self: start; /* S'assurer qu'il commence en haut */
} }
} }
.block-block-content4e5df355-e76c-4e44-bec0-e211d94f2640,
.block-entity-fieldnodefield-type-de-ressource,
.block-entity-fieldnodetitle,
.block-entity-fieldnodefield-sous-titre,
.block-entity-fieldnodefield-edition,
.block-entity-fieldnodefield-auteur-s-,
.block-entity-fieldnodefield-date-de-parution,
.block-entity-fieldnodefield-mots-clefs {
width: 100%;
margin-left: 13%;
@media (max-width: 810px) {
margin-left: 9%;
margin-right: 9%;
}
@media screen and (min-width: 1100px) {
width: auto;
margin-left: 0;
grid-column: 2 / 3;
align-self: start; /* S'assurer qu'il commence en haut */
height: fit-content ;
p{margin: 0;}
}
}
.block-block-content4e5df355-e76c-4e44-bec0-e211d94f2640{ .block-block-content4e5df355-e76c-4e44-bec0-e211d94f2640{
width: 100%; width: 100%;
font-family: 'Source Code Pro'; font-family: 'Source Code Pro';
@@ -40,11 +70,11 @@
padding-top: 1rem; padding-top: 1rem;
padding-bottom: 0.5rem; padding-bottom: 0.5rem;
vertical-align: middle; vertical-align: middle;
@media screen and (min-width:1100px) { // @media screen and (min-width:1100px) {
width: 50%; // // width: 50%;
grid-column: 5/span 7; // // grid-column: 5/span 7;
grid-row: 1; // // grid-row: 1;
} // }
} }
@@ -54,32 +84,32 @@
color: $blue-light; color: $blue-light;
text-transform: uppercase; text-transform: uppercase;
font-weight: 800; font-weight: 800;
@media (max-width: 810px){ // @media (max-width: 810px){
margin-left:9%; // margin-left:9%;
margin-right: 9%; // margin-right: 9%;
} // }
@media screen and (min-width:1100px) { // @media screen and (min-width:1100px) {
width: 50%; // width: 50%;
grid-column: 5/span 7; // grid-column: 5/span 7;
grid-row: 1; // grid-row: 1;
} // }
} }
.block-entity-fieldnodetitle{ .block-entity-fieldnodetitle{
margin-left: 13%; margin-left: 13%;
font-size: 2rem; font-size: 2rem;
font-weight: 600; font-weight: 600;
@media (max-width: 810px){ // @media (max-width: 810px){
margin-left:9%; // margin-left:9%;
margin-right: 9%; // margin-right: 9%;
} // }
@media screen and (min-width:1100px) { // @media screen and (min-width:1100px) {
width: 50%; // width: 50%;
grid-column: 5/span 7; // grid-column: 5/span 7;
grid-row: 2; // grid-row: 2;
} // }
} }
.block-entity-fieldnodefield-sous-titre{ .block-entity-fieldnodefield-sous-titre{
@@ -89,16 +119,16 @@
margin-bottom: 0; margin-bottom: 0;
} }
} }
@media (max-width: 810px){ // @media (max-width: 810px){
margin-left:9%; // margin-left:9%;
margin-right: 9%; // margin-right: 9%;
} // }
@media screen and (min-width:1100px) { // @media screen and (min-width:1100px) {
width: 50%; // width: 50%;
grid-column: 5/span 7; // grid-column: 5/span 7;
grid-row: 3; // grid-row: 3;
} // }
} }
.block-entity-fieldnodefield-edition{ .block-entity-fieldnodefield-edition{
margin-left: 13%; margin-left: 13%;
@@ -107,16 +137,16 @@
margin-bottom: 0; margin-bottom: 0;
} }
} }
@media (max-width: 810px){ // @media (max-width: 810px){
margin-left:9%; // margin-left:9%;
margin-right: 9%; // margin-right: 9%;
} // }
@media screen and (min-width:1100px) { // @media screen and (min-width:1100px) {
width: 50%; // width: 50%;
grid-column: 5/span 7; // grid-column: 5/span 7;
grid-row: 4; // grid-row: 4;
} // }
} }
.block-entity-fieldnodefield-auteur-s-{ .block-entity-fieldnodefield-auteur-s-{
@@ -128,30 +158,30 @@
margin: 0; margin: 0;
} }
} }
@media (max-width: 810px){ // @media (max-width: 810px){
margin-left:9%; // margin-left:9%;
margin-right: 9%; // margin-right: 9%;
} // }
@media screen and (min-width:1100px) { // @media screen and (min-width:1100px) {
width: 50%; // width: 50%;
grid-column: 5/span 7; // grid-column: 5/span 7;
grid-row: 5; // grid-row: 5;
} // }
} }
.block-entity-fieldnodefield-date-de-parution{ .block-entity-fieldnodefield-date-de-parution{
margin-left: 13%; margin-left: 13%;
@media (max-width: 810px){ // @media (max-width: 810px){
margin-left:9%; // margin-left:9%;
margin-right: 9%; // margin-right: 9%;
} // }
@media screen and (min-width:1100px) { // @media screen and (min-width:1100px) {
width: 50%; // width: 50%;
grid-column: 5/span 7; // grid-column: 5/span 7;
grid-row: 6; // grid-row: 6;
} // }
} }
.block-entity-fieldnodefield-mots-clefs{ .block-entity-fieldnodefield-mots-clefs{
margin-left: 13%; margin-left: 13%;
@@ -173,8 +203,8 @@
} }
} }
@media (max-width: 810px){ @media (max-width: 810px){
margin-left:9%; // margin-left:9%;
margin-right: 9%; // margin-right: 9%;
.field--name-field-mots-clefs{ .field--name-field-mots-clefs{
display: flex; display: flex;
flex-direction: row; flex-direction: row;
@@ -186,13 +216,24 @@
} }
} }
@media screen and (min-width:800px) { // @media screen and (min-width:800px) {
width: 50%; // width: 50%;
grid-column: 5/span 7; // grid-column: 5/span 7;
grid-row: 7; // grid-row: 7;
} // }
} }
}
/* Hide empty blocks */
.block-block-content4e5df355-e76c-4e44-bec0-e211d94f2640:empty,
.block-entity-fieldnodefield-type-de-ressource:empty,
.block-entity-fieldnodetitle:empty,
.block-entity-fieldnodefield-sous-titre:empty,
.block-entity-fieldnodefield-edition:empty,
.block-entity-fieldnodefield-auteur-s-:empty,
.block-entity-fieldnodefield-date-de-parution:empty,
.block-entity-fieldnodefield-mots-clefs:empty {
display: none;
} }
} }
.layout__region--first{ // menu ancres a gauche .layout__region--first{ // menu ancres a gauche