bachir/drupal-quartiersdedemain
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

debugg actualité home

Browse Source
This commit is contained in:
Ouidade Soussi Chiadmi
2025-03-13 12:24:43 +01:00
parent 3212219618
commit 36928232d6
6 changed files with 76 additions and 73 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
web/themes/custom/quartiers_de_demain/dist/assets/bundle.js vendored
View File

File diff suppressed because one or more lines are too long

56
web/themes/custom/quartiers_de_demain/dist/assets/css/bundle.css vendored
View File

@@ -1527,7 +1527,7 @@ footer {
padding-bottom: 0rem;
}
}
#actus-caroussel .content-actus .view {
#actus-caroussel .content-actus .view .view-rows-wrapper {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
@@ -3882,29 +3882,29 @@ main {
display: flex;
margin: auto;
}
#ressources .layout-content .content_container .views-element-container .view-rows-ressources {
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper {
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
#ressources .layout-content .content_container .views-element-container .view-rows-ressources .views-row {
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row {
width: 30%;
font-size: 0.5rem;
margin-bottom: 1rem;
}
#ressources .layout-content .content_container .views-element-container .view-rows-ressources .views-row h2 {
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row h2 {
font-family: "gilroy-semibold";
color: rgb(7, 50, 194);
font-size: 0.6rem;
}
#ressources .layout-content .content_container .views-element-container .view-rows-ressources .views-row p {
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row p {
font-size: 0.5rem;
}
#ressources .layout-content .content_container .views-element-container .view-rows-ressources .views-row .field_field_mots_clefs div {
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .field_field_mots_clefs div {
display: flex;
flex-direction: row !important;
}
#ressources .layout-content .content_container .views-element-container .view-rows-ressources .views-row .field_field_mots_clefs div div {
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .field_field_mots_clefs div div {
border: solid 1px rgb(7, 50, 194);
margin-right: 0.2rem;
padding: 1.3%;
@@ -3913,16 +3913,16 @@ main {
font-size: 0.4rem;
font-family: "gilroy-semibold";
}
#ressources .layout-content .content_container .views-element-container .view-rows-ressources .views-row .field_field_mots_clefs div div a {
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .field_field_mots_clefs div div a {
color: rgb(7, 50, 194);
}
#ressources .layout-content .content_container .views-element-container .view-rows-ressources .views-row .field_field_site div a {
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .field_field_site div a {
position: relative;
padding-left: 20px;
color: rgb(247, 0, 43);
font-family: "gilroy-semibold";
}
#ressources .layout-content .content_container .views-element-container .view-rows-ressources .views-row .field_field_site div a:before {
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .field_field_site div a:before {
content: "";
position: absolute;
left: 0;
@@ -3934,48 +3934,48 @@ main {
background-size: contain;
background-repeat: no-repeat;
}
#ressources .layout-content .content_container .views-element-container .view-rows-ressources .views-row .type-documentation .field_body,
#ressources .layout-content .content_container .views-element-container .view-rows-ressources .views-row .type-documentation .field_field_images {
#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-ressources .views-row .type-podcast .content-ressource {
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-podcast .content-ressource {
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-ressources .views-row .type-podcast .content-ressource .field_field_images {
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-podcast .content-ressource .field_field_images {
grid-column: 1;
grid-row: 1/span 5;
padding: 0 1rem 1rem 1rem;
}
#ressources .layout-content .content_container .views-element-container .view-rows-ressources .views-row .type-podcast .content-ressource .field_field_images img {
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-podcast .content-ressource .field_field_images img {
width: 100%;
height: auto;
aspect-ratio: 1/1;
object-fit: cover;
border-radius: 9px;
}
#ressources .layout-content .content_container .views-element-container .view-rows-ressources .views-row .type-podcast .content-ressource .field_title, #ressources .layout-content .content_container .views-element-container .view-rows-ressources .views-row .type-podcast .content-ressource h2 {
#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 {
margin-top: 0;
}
#ressources .layout-content .content_container .views-element-container .view-rows-ressources .views-row .type-podcast .content-ressource .field_title,
#ressources .layout-content .content_container .views-element-container .view-rows-ressources .views-row .type-podcast .content-ressource .field_field_sous_titre,
#ressources .layout-content .content_container .views-element-container .view-rows-ressources .views-row .type-podcast .content-ressource .field_field_author,
#ressources .layout-content .content_container .views-element-container .view-rows-ressources .views-row .type-podcast .content-ressource .field_field_date_ressource,
#ressources .layout-content .content_container .views-element-container .view-rows-ressources .views-row .type-podcast .content-ressource .field_body,
#ressources .layout-content .content_container .views-element-container .view-rows-ressources .views-row .type-podcast .content-ressource .field_field_mots_clefs,
#ressources .layout-content .content_container .views-element-container .view-rows-ressources .views-row .type-podcast .content-ressource .field_field_site,
#ressources .layout-content .content_container .views-element-container .view-rows-ressources .views-row .type-podcast .content-ressource .field_field_documents,
#ressources .layout-content .content_container .views-element-container .view-rows-ressources .views-row .type-podcast .content-ressource .field_field_liens {
#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 {
grid-column: 2;
}
#ressources .layout-content .content_container .views-element-container .view-rows-ressources .views-row:has(.type-podcast) {
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row:has(.type-podcast) {
width: 50%;
}
#ressources .layout-content .content_container .views-element-container .view-rows-ressources .views-row:has(.type-documentation) {
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row:has(.type-documentation) {
width: 25%;
}
#ressources .layout-content .content_container .views-element-container .view-rows-ressources .views-row:has(.type-vidéo) {
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row:has(.type-vidéo) {
width: 50%;
}

81
web/themes/custom/quartiers_de_demain/src/assets/js/quartiers_de_demain.js
View File

@@ -376,7 +376,7 @@ document.addEventListener('DOMContentLoaded', function() {
$(document).ready(function(){
let actuview = $('.content-actus .view ')
let actuview = $('.content-actus .view .view-rows-wrapper')
if (actuview) {
actuview.slick({
slidesToShow: 3,
@@ -685,59 +685,62 @@ window.addEventListener("resize", moveLanguageSwitcher);
/////////////// start class à view-rows-ressources ////////
$(document).ready(function () {
$(".view-rows-ressources").each(function () {
$(".view-rows-wrapper").each(function () {
let h3Container = $(this).prev("h3").find("div[class^='type-']");
let classToAdd = h3Container.attr("class"); // Récupère la classe complète (ex: "type-Documentation")
if (classToAdd) {
$(this).addClass(classToAdd); // Ajoute cette classe à .view-rows-ressources
$(this).addClass(classToAdd); // Ajoute cette classe à .view-rows-wrapper
}
});
});
////////////////// end class à view-rows-ressources ////////////////
////////////////// end class à view-rows-wrapper ////////////////
/////////////////// start voir plus... ressources ////////////////////
$(document).ready(function () {
$(".view-rows-ressources").each(function () {
let container = $(this); // Cible uniquement cette section
let items = container.find(".views-row"); // Les éléments à afficher progressivement
let visibleCount = 4; // Nombre d'éléments visibles au départ
// Vérifier si on est sur la page avec l'ID #ressources
if ($("#ressources").length > 0) {
$(".view-rows-wrapper").each(function () {
let container = $(this); // Cible uniquement cette section
let items = container.find(".views-row"); // Les éléments à afficher progressivement
let visibleCount = 4; // Nombre d'éléments visibles au départ
// Récupérer la classe `type-XXX`
let typeClass = container.attr("class").split(" ").find(cls => cls.startsWith("type-"));
let typeName = typeClass ? typeClass.replace("type-", "").replace(/-/g, " ") : "contenu"; // Nettoyer le nom
// Récupérer la classe `type-XXX`
let typeClass = container.attr("class").split(" ").find(cls => cls.startsWith("type-"));
let typeName = typeClass ? typeClass.replace("type-", "").replace(/-/g, " ") : "contenu"; // Nettoyer le nom
if (typeClass === "type-podcast" || typeClass === "type-video") {
visibleCount = 2; // Pour Podcast et Vidéo
}
// Ajouter un bouton dynamiquement après chaque `.view-rows-ressources`
let button = $("<button>")
.addClass("voir-plus")
.text("Voir plus de " + typeName)
.insertAfter(container);
// Cacher tous les éléments sauf les 4 premiers
items.hide().slice(0, visibleCount).show();
// Action sur le bouton
button.on("click", function () {
let hiddenItems = container.find(".views-row:hidden").slice(0, 4); // Prochains éléments à afficher
if ($(this).text().includes("Voir plus")) {
hiddenItems.slideDown(); // Afficher avec un effet de glissement
if (container.find(".views-row:hidden").length === 0) {
$(this).text("Voir moins de " + typeName); // Changer le texte du bouton si tout est affiché
}
} else {
container.find(".views-row").slice(visibleCount).slideUp(); // Replier les éléments
$(this).text("Voir plus de " + typeName); // Revenir à l'état initial
if (typeClass === "type-podcast" || typeClass === "type-video") {
visibleCount = 2; // Pour Podcast et Vidéo
}
// Ajouter un bouton dynamiquement après chaque `.view-rows-ressources`
let button = $("<button>")
.addClass("voir-plus")
.text("Voir plus de " + typeName)
.insertAfter(container);
// Cacher tous les éléments sauf les 4 premiers
items.hide().slice(0, visibleCount).show();
// Action sur le bouton
button.on("click", function () {
let hiddenItems = container.find(".views-row:hidden").slice(0, 4); // Prochains éléments à afficher
if ($(this).text().includes("Voir plus")) {
hiddenItems.slideDown(); // Afficher avec un effet de glissement
if (container.find(".views-row:hidden").length === 0) {
$(this).text("Voir moins de " + typeName); // Changer le texte du bouton si tout est affiché
}
} else {
container.find(".views-row").slice(visibleCount).slideUp(); // Replier les éléments
$(this).text("Voir plus de " + typeName); // Revenir à l'état initial
}
});
});
});
}
});

2
web/themes/custom/quartiers_de_demain/src/assets/scss/pages/ressources.scss
View File

@@ -71,7 +71,7 @@
display: flex;
margin: auto;
}
.view-rows-ressources{
.view-rows-wrapper{
display: flex;
flex-direction: row;
flex-wrap: wrap;

2
web/themes/custom/quartiers_de_demain/src/assets/scss/partials/actu-caroussel-home.scss
View File

@@ -27,7 +27,7 @@
padding-bottom: 0rem;
}
}
.view{
.view .view-rows-wrapper{
display: flex;
flex-direction: row;
flex-wrap: nowrap;

6
web/themes/custom/quartiers_de_demain/templates/views-view-unformatted.html.twig
View File

@@ -30,8 +30,8 @@
{%
set view_ressource_class = [
'view-rows-ressources',
set view_wrapper_class = [
'view-rows-wrapper',
]
%}
@@ -39,7 +39,7 @@
{% if title %}
<h3>{{ title }} </h3>
{% endif %}
<div {{ attributes.addClass(view_ressource_class) }}>
<div {{ attributes.addClass(view_wrapper_class) }}>
{% for row in rows %}
{%
set row_classes = [