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 {
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;
}
#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 {
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 .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 {
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper.type-Podcast .views-row {
display: grid;
grid-template-columns: 1fr 1.2fr;
grid-template-rows: repeat(5 1fr);
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-row: 1/span 5;
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 {
width: 100%;
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper.type-Podcast .views-row .views-field-field-images iframe,
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper.type-Podcast .views-row .views-field-field-video iframe {
width: 80%;
height: auto;
aspect-ratio: 1/1;
object-fit: cover;
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;
}
#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 .field_field_sous_titre,
#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 .views-row .type-podcast .content-ressource .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 .views-row .type-podcast .content-ressource .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 .views-row .type-podcast .content-ressource .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-title-1,
#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.type-Podcast .views-row .views-field-field-author,
#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.type-Podcast .views-row .views-field-body-1,
#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.type-Podcast .views-row .views-field-field-site,
#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.type-Podcast .views-row .views-field-field-liens {
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;
justify-content: space-between;
}
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-vidéo .field_body {
opacity: 1 !important;
transform: none !important;
@media (max-width: 810px) {
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper.type-Vidéo .views-row {
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%;
height: auto;
object-fit: cover;
border-radius: 9px;
}
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-kit-de-communication div.content-ressource {
display: flex;
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.type-Vidéo .views-row iframe {
border-radius: 9px;
}
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row:has(.type-podcast) {
width: 50%;
@ -4348,18 +4306,16 @@ main {
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) {
width: 100%;
}
.type-documentation .views-field-body-1,
.type-documentation .views-field-field-images,
.type-documentation .views-field-field-video {
display: none;
}
#actualites main {
background-color: white;
padding-bottom: 0;

View File

@ -107,7 +107,6 @@
.views-row{
// width: 30%;
font-size: 0.5rem;
margin-bottom: 1rem;
.views-field-title-1,
@ -119,11 +118,8 @@
}
.views-field-body-1{
font-family: "gilroy-light";
p{font-size: 0.5rem;}
}
p{
font-size: 0.5rem;
}
.views-field-field-mots-clefs{
margin-top: 0.5rem;
display: flex;
@ -176,117 +172,71 @@
}
.type-documentation{
.field_body,
.field_field_images{
display: none;
}
&.type-Podcast{
.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{
.content-ressource{
display: grid;
grid-template-columns: 1fr 1.2fr;
grid-template-rows: repeat(5 1fr);
margin-top: 1rem;
.field_field_images{
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;
}
}
&.type-Vidéo{
.views-row{
width: 43%;
margin: 1rem;
justify-content: space-between;
@media(max-width: 810px){
width: 100%;
}
}
.type-vidéo{
.content-ressource{
margin: 1rem;
}
.field_body{
opacity: 1 !important;
transform: none !important;
}
a img{
img{
max-width: 100%;
height: auto;
object-fit: cover;
border-radius: 9px;
}
}
.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;
}
}
}
iframe{
border-radius: 9px;
}
}
}
.views-row:has(.type-podcast){
width: 50%;
@media(max-width: 810px){
@ -299,11 +249,8 @@
width: 50%;
}
}
.views-row:has(.type-vidéo){
width: 50%;
@media(max-width: 810px){
width: 100%;
}
.type-vidéo{
}
.views-row:has(.type-Kit-de-communication){
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;
// }
// }
// }
// }
// }