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

new twig et css teaser actus home

Browse Source
This commit is contained in:
ouidade
2025-07-24 16:53:14 +02:00
parent c5d0df7d39
commit 4a8f57a0fd
3 changed files with 141 additions and 144 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/themes/custom/eql/scss/pages/_home.scss
+76 -74
View File
@@ -47,80 +47,82 @@
height: auto;
margin: auto;
margin-bottom: 2rem;
@media (max-width: 810px){
width: 65%;
height: auto;
}
div:first-child{ // block actu dans le bandeau
display: grid;
grid-template-columns: 1fr repeat(9, 1fr) 1fr;
column-gap: 30px;
.actus-teaser-home{ // block actu dans le bandeau
// display: grid;
// grid-template-columns: 1fr repeat(9, 1fr) 1fr;
// column-gap: 30px;
display: flex;
flex-direction: row;
justify-content: space-between;
margin-left: 2rem;
@media (max-width: 810px){
display: flex;
flex-direction: column;
height: auto;
}
.field--name-field-images {
order: 1;
grid-column: 1 /span 8;
grid-row: 1 / span 6;
.field__item{
display: flex;
max-height: 420px;
}
.field__item img{
max-width: 100%;
max-height: 456px;
object-fit: cover;
object-position: center;
@media(max-width:810px){
max-height: 310px;
max-width: 100%;
object-fit: cover;
padding-left: 0;
margin-bottom: 1rem;
}
@media(max-width:724px){
max-height: 400px;
}
@media (max-width: 680px){
height: 200px;
object-fit: cover;
max-width: 70vw;
margin: auto;
padding-left: 0;
padding-bottom: 1rem;
.home_actu_photo{
width: 50%;
.field--name-field-images {
.field__item{
display: flex;
max-height: 420px;
}
.field__item img{
max-width: 100%;
max-height: 456px;
object-fit: cover;
object-position: center;
@media(max-width:810px){
max-height: 310px;
max-width: 100%;
object-fit: cover;
padding-left: 0;
margin-bottom: 1rem;
}
@media(max-width:724px){
max-height: 400px;
}
@media (max-width: 680px){
height: 200px;
object-fit: cover;
max-width: 70vw;
margin: auto;
padding-left: 0;
padding-bottom: 1rem;
}
}
}
}
.home_actu_infos{
width: 45%;
align-content: center;
color: $blue-dark !important;
.field--name-field-date,
.field--name-field-lieu,
.field--name-title,
.field--name-field-sous-titre,
.field--name-field-actu-type {
}
}
.field--name-field-date,
.field--name-field-lieu,
.field--name-title,
.field--name-field-sous-titre,
.field--name-field-actu-type {
display: inline-block;
block-size: fit-content;
grid-column: 9 / span 9;
order: auto;
@media (min-width: 811px) {
margin-top: 1rem;
.field--name-field-date:empty,
.field--name-field-lieu:empty,
.field--name-title:empty,
.field--name-field-sous-titre:empty,
.field--name-field-actu-type:empty,
.ul:empty{
display: none;
}
}
.field--name-field-date:empty,
.field--name-field-lieu:empty,
.field--name-title:empty,
.field--name-field-sous-titre:empty,
.field--name-field-actu-type:empty,
.ul:empty{
display: none;
}
.field--name-field-date{
order: 2;
font-size: 1.3rem;
@media (min-width: 811px) {
// margin-top: 5rem;
}
@@ -131,7 +133,7 @@
time{
display: flex;
flex-direction: row;
font-size: 0.9rem;
font-size: 1.3rem;
font-weight: 800;
padding-right: 1rem;
width: fit-content;
@@ -139,23 +141,28 @@
}
.field--name-field-lieu{
font-size: 1.3rem;
padding-top: 1rem;
.field__label{
display: none;
}
@media (max-width: 811px){
display: inline-flex;
order: 3;
}
}
.field--name-title {
line-height: 1.1;
font-size: 1.5rem;
padding-top: 1rem;
h2 a {
color: $blue-light !important;
color: $blue-dark !important;
}
}
.field--name-field-sous-titre {
display: none;
font-weight: 800;
@media (min-width: 811px) {
font-size: 1.5rem;
@@ -163,7 +170,8 @@
}
.field--name-field-actu-type {
order: 6;
padding-top: 2rem;
font-size: 1.3rem;
}
.field:not(.field--name-field-images) {
@@ -175,20 +183,14 @@
}
a {
color: $black;
grid-column: 1 / span 8;
color: $black;
}
.inline.links {
padding-top: none !important;
list-style: none;
width: fit-content;
align-self: flex-end;
padding-right: 1rem;
a {
display: none;
}
display: none;
}
}
}
}
}