css ressource

This commit is contained in:
Ouidade Soussi Chiadmi 2025-04-04 10:36:53 +02:00
parent dfc9bc3c91
commit 57a99ee386
2 changed files with 152 additions and 187 deletions

View File

@ -4195,7 +4195,7 @@ main {
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .views-field-body-1 { #ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .views-field-body-1 {
font-family: "gilroy-light"; font-family: "gilroy-light";
} }
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row p { #ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .views-field-body-1 p {
font-size: 0.5rem; font-size: 0.5rem;
} }
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .views-field-field-mots-clefs { #ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .views-field-field-mots-clefs {
@ -4238,99 +4238,57 @@ main {
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .views-field-field-documents { #ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .views-field-field-documents {
margin-top: 0.5rem; margin-top: 0.5rem;
} }
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-documentation .field_body, #ressources .layout-content .content_container .views-element-container .view-rows-wrapper.type-Podcast .views-row {
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-documentation .field_field_images {
display: none;
}
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-podcast .content-ressource {
display: grid; display: grid;
grid-template-columns: 1fr 1.2fr; grid-template-columns: 1fr 1.2fr;
grid-template-rows: repeat(5 1fr); grid-template-rows: repeat(5 1fr);
margin-top: 1rem; margin-top: 1rem;
} }
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-podcast .content-ressource .field_field_images { #ressources .layout-content .content_container .views-element-container .view-rows-wrapper.type-Podcast .views-row .views-field-field-images,
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper.type-Podcast .views-row .views-field-field-video {
grid-column: 1; grid-column: 1;
grid-row: 1/span 5; grid-row: 1/span 5;
padding: 0 1rem 1rem 1rem; padding: 0 1rem 1rem 1rem;
} }
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-podcast .content-ressource .field_field_images img { #ressources .layout-content .content_container .views-element-container .view-rows-wrapper.type-Podcast .views-row .views-field-field-images iframe,
width: 100%; #ressources .layout-content .content_container .views-element-container .view-rows-wrapper.type-Podcast .views-row .views-field-field-video iframe {
width: 80%;
height: auto; height: auto;
aspect-ratio: 1/1; aspect-ratio: 1/1;
object-fit: cover;
border-radius: 9px; border-radius: 9px;
} }
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-podcast .content-ressource .field_title, #ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-podcast .content-ressource h2 { #ressources .layout-content .content_container .views-element-container .view-rows-wrapper.type-Podcast .views-row .views-field-title-1 {
margin-top: 0; margin-top: 0;
} }
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-podcast .content-ressource .field_title, #ressources .layout-content .content_container .views-element-container .view-rows-wrapper.type-Podcast .views-row .views-field-title-1,
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-podcast .content-ressource .field_field_sous_titre, #ressources .layout-content .content_container .views-element-container .view-rows-wrapper.type-Podcast .views-row .views-field-field-sous-titre-1,
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-podcast .content-ressource .field_field_author, #ressources .layout-content .content_container .views-element-container .view-rows-wrapper.type-Podcast .views-row .views-field-field-author,
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-podcast .content-ressource .field_field_date_ressource, #ressources .layout-content .content_container .views-element-container .view-rows-wrapper.type-Podcast .views-row .views-field-field-date-ressource,
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-podcast .content-ressource .field_body, #ressources .layout-content .content_container .views-element-container .view-rows-wrapper.type-Podcast .views-row .views-field-body-1,
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-podcast .content-ressource .field_field_mots_clefs, #ressources .layout-content .content_container .views-element-container .view-rows-wrapper.type-Podcast .views-row .views-field-field-mots-clefs,
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-podcast .content-ressource .field_field_site, #ressources .layout-content .content_container .views-element-container .view-rows-wrapper.type-Podcast .views-row .views-field-field-site,
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-podcast .content-ressource .field_field_documents, #ressources .layout-content .content_container .views-element-container .view-rows-wrapper.type-Podcast .views-row .views-field-field-documents,
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-podcast .content-ressource .field_field_liens { #ressources .layout-content .content_container .views-element-container .view-rows-wrapper.type-Podcast .views-row .views-field-field-liens {
grid-column: 2; grid-column: 2;
} }
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-vidéo .content-ressource { #ressources .layout-content .content_container .views-element-container .view-rows-wrapper.type-Vidéo .views-row {
width: 43%;
margin: 1rem; margin: 1rem;
justify-content: space-between;
} }
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-vidéo .field_body { @media (max-width: 810px) {
opacity: 1 !important; #ressources .layout-content .content_container .views-element-container .view-rows-wrapper.type-Vidéo .views-row {
transform: none !important; width: 100%;
}
} }
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-vidéo a img { #ressources .layout-content .content_container .views-element-container .view-rows-wrapper.type-Vidéo .views-row img {
max-width: 100%; max-width: 100%;
height: auto; height: auto;
object-fit: cover; object-fit: cover;
border-radius: 9px; border-radius: 9px;
} }
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-kit-de-communication div.content-ressource { #ressources .layout-content .content_container .views-element-container .view-rows-wrapper.type-Vidéo .views-row iframe {
display: flex; border-radius: 9px;
flex-direction: column;
align-items: center;
background-color: rgb(7, 50, 194);
color: white;
padding: 1rem 3rem;
}
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-kit-de-communication div.content-ressource .field_title {
display: none;
}
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-kit-de-communication div.content-ressource .field_field_sous_titre {
text-align: center;
font-size: 0.9rem;
font-family: "gilroy-light";
color: white;
}
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-kit-de-communication div.content-ressource .field_body {
text-align: center;
font-size: 0.7rem;
font-family: "gilroy-light";
}
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-kit-de-communication div.content-ressource .field_field_liens {
width: fit-content;
}
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-kit-de-communication div.content-ressource .field_field_liens a {
display: flex;
flex-direction: row;
padding-left: 0.5rem;
display: inline-flex;
align-items: center;
color: white;
background: black;
text-transform: uppercase;
font-size: 0.6rem;
}
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-kit-de-communication div.content-ressource .field_field_liens a svg {
display: none;
}
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-kit-de-communication div.content-ressource .field_field_liens a::after {
display: inline-flex;
content: url("../img/noun-arrow-to-right.svg");
padding-right: 0.2rem;
padding-left: 0.2rem;
} }
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row:has(.type-podcast) { #ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row:has(.type-podcast) {
width: 50%; width: 50%;
@ -4348,18 +4306,16 @@ main {
width: 50%; width: 50%;
} }
} }
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row:has(.type-vidéo) {
width: 50%;
}
@media (max-width: 810px) {
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row:has(.type-vidéo) {
width: 100%;
}
}
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row:has(.type-Kit-de-communication) { #ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row:has(.type-Kit-de-communication) {
width: 100%; width: 100%;
} }
.type-documentation .views-field-body-1,
.type-documentation .views-field-field-images,
.type-documentation .views-field-field-video {
display: none;
}
#actualites main { #actualites main {
background-color: white; background-color: white;
padding-bottom: 0; padding-bottom: 0;

View File

@ -107,7 +107,6 @@
.views-row{ .views-row{
// width: 30%;
font-size: 0.5rem; font-size: 0.5rem;
margin-bottom: 1rem; margin-bottom: 1rem;
.views-field-title-1, .views-field-title-1,
@ -119,11 +118,8 @@
} }
.views-field-body-1{ .views-field-body-1{
font-family: "gilroy-light"; font-family: "gilroy-light";
p{font-size: 0.5rem;}
} }
p{
font-size: 0.5rem;
}
.views-field-field-mots-clefs{ .views-field-field-mots-clefs{
margin-top: 0.5rem; margin-top: 0.5rem;
display: flex; display: flex;
@ -176,117 +172,71 @@
} }
.type-documentation{
.field_body, }
.field_field_images{ &.type-Podcast{
display: none; .views-row{
display: grid;
grid-template-columns: 1fr 1.2fr;
grid-template-rows: repeat(5 1fr);
margin-top: 1rem;
.views-field-field-images,
.views-field-field-video {
grid-column: 1;
grid-row: 1 /span 5;
padding: 0 1rem 1rem 1rem;
iframe{
width: 80%;
height: auto;
aspect-ratio: 1 / 1;
border-radius: 9px;
}
// img{
// width: 100%;
// height: auto;
// aspect-ratio: 1 / 1;
// object-fit: cover;
// border-radius: 9px;
// }
} }
.views-field-title-1{
margin-top: 0;
}
.views-field-title-1,
.views-field-field-sous-titre-1,
.views-field-field-author,
.views-field-field-date-ressource,
.views-field-body-1,
.views-field-field-mots-clefs,
.views-field-field-site,
.views-field-field-documents,
.views-field-field-liens{
grid-column: 2;
}
} }
}
.type-podcast{ &.type-Vidéo{
.content-ressource{ .views-row{
display: grid; width: 43%;
grid-template-columns: 1fr 1.2fr; margin: 1rem;
grid-template-rows: repeat(5 1fr); justify-content: space-between;
margin-top: 1rem; @media(max-width: 810px){
.field_field_images{ width: 100%;
grid-column: 1;
grid-row: 1 /span 5;
padding: 0 1rem 1rem 1rem;
img{
width: 100%;
height: auto;
aspect-ratio: 1 / 1;
object-fit: cover;
border-radius: 9px;
}
}
.field_title, h2{
margin-top: 0;
}
.field_title,
.field_field_sous_titre,
.field_field_author,
.field_field_date_ressource,
.field_body,
.field_field_mots_clefs,
.field_field_site,
.field_field_documents,
.field_field_liens{
grid-column: 2;
}
} }
img{
}
.type-vidéo{
.content-ressource{
margin: 1rem;
}
.field_body{
opacity: 1 !important;
transform: none !important;
}
a img{
max-width: 100%; max-width: 100%;
height: auto; height: auto;
object-fit: cover; object-fit: cover;
border-radius: 9px; border-radius: 9px;
} }
} iframe{
.type-kit-de-communication{ border-radius: 9px;
div.content-ressource{
display: flex;
flex-direction: column;
align-items: center;
background-color: $blue_QDD;
color: white;
padding: 1rem 3rem;
.field_title{
display: none;
}
.field_field_sous_titre{
text-align: center;
font-size: 0.9rem;
font-family: 'gilroy-light';
color: white;
}
.field_body{
text-align: center;
font-size: 0.7rem;
font-family: 'gilroy-light';
}
.field_field_liens{
width: fit-content;
a{
display: flex;
flex-direction: row;
padding-left: 0.5rem;
display: inline-flex;
align-items: center;
color: white;
background: black;
text-transform: uppercase;
font-size: 0.6rem;
svg{
display: none;
}
&::after{
display: inline-flex;
content: url("../img/noun-arrow-to-right.svg");
padding-right: 0.2rem;
padding-left: 0.2rem;
}
}
}
} }
} }
} }
.views-row:has(.type-podcast){ .views-row:has(.type-podcast){
width: 50%; width: 50%;
@media(max-width: 810px){ @media(max-width: 810px){
@ -299,11 +249,8 @@
width: 50%; width: 50%;
} }
} }
.views-row:has(.type-vidéo){ .type-vidéo{
width: 50%;
@media(max-width: 810px){
width: 100%;
}
} }
.views-row:has(.type-Kit-de-communication){ .views-row:has(.type-Kit-de-communication){
width: 100%; width: 100%;
@ -320,3 +267,65 @@
} }
} }
} }
.type-documentation{
.views-field-body-1,
.views-field-field-images,
.views-field-field-video {
display: none;
}
}
// .type-kit-de-communication{
// div.content-ressource{
// display: flex;
// flex-direction: column;
// align-items: center;
// background-color: $blue_QDD;
// color: white;
// padding: 1rem 3rem;
// .field_title{
// display: none;
// }
// .field_field_sous_titre{
// text-align: center;
// font-size: 0.9rem;
// font-family: 'gilroy-light';
// color: white;
// }
// .field_body{
// text-align: center;
// font-size: 0.7rem;
// font-family: 'gilroy-light';
// }
// .field_field_liens{
// width: fit-content;
// a{
// display: flex;
// flex-direction: row;
// padding-left: 0.5rem;
// display: inline-flex;
// align-items: center;
// color: white;
// background: black;
// text-transform: uppercase;
// font-size: 0.6rem;
// svg{
// display: none;
// }
// &::after{
// display: inline-flex;
// content: url("../img/noun-arrow-to-right.svg");
// padding-right: 0.2rem;
// padding-left: 0.2rem;
// }
// }
// }
// }
// }