FIX Corrections all post lables

resources/css/components/post-card.css

@@ -4,6 +4,13 @@
   @screen lg {
     grid-template-columns: 1fr 40px;
   }
+
+  &:has(.issue-number-group) {
+    @screen lg {
+      grid-template-columns: 1fr 86px;
+    }
+  }
+
   &.has-cover {
     .post-card__cover {
       @apply col-span-1;
@@ -14,6 +21,12 @@
         @apply col-span-1;
       }
     }
+
+    &:has(.issue-number-group) {
+      @screen lg {
+        grid-template-columns: 1fr 3fr 86px;
+      }
+    }
   }
 
   .content-meta {
@@ -61,8 +74,17 @@
     @apply order-2 lg:order-1;
   }
 
+  .issue-number-group {
+    @apply flex h-auto gap-2;
+    .issue-number {
+      @apply h-[40px];
+    }
+  }
+  .issue-number-group,
   .issue-number {
     @apply order-1 lg:order-1;
+  }
+  .issue-number {
     @apply bg-primary text-white w-[40px] h-auto flex items-center justify-center;
     aspect-ratio: 1/1;
   }

resources/css/components/post-grid.css

@@ -19,6 +19,7 @@
       @apply md:justify-self-end text-primary;
       input {
         @apply w-full md:w-auto py-2 px-4 border border-primary rounded-full;
+        padding-right: 33px;
         &::placeholder {
           @apply text-base font-normal text-carhop-green-700;
         }
@@ -30,6 +31,22 @@
 
     select {
       @apply w-full md:w-auto border border-carhop-green-700 text-carhop-green-700 rounded-full py-2 px-4 max-w-full text-base;
+
+      appearance: none; /* Disable the default arrow */
+      -webkit-appearance: none; /* For WebKit-based browsers */
+      -moz-appearance: none; /* For Firefox */
+      /* width: 100%;
+      padding: 10px 35px 10px 10px;
+      font-size: 16px;
+      border: 1px solid #ccc;
+      border-radius: 4px; */
+      background-color: #fff;
+      background-image: url('../resources/img/elements/select-drop-button.svg');
+
+      background-repeat: no-repeat;
+      background-position: right 10px center;
+      background-size: 30px;
+      cursor: pointer;
     }
 
     select[name='etiquettes'] {
@@ -41,7 +58,7 @@
     }
 
     select[name='sort_by'] {
-      @apply md:ml-auto;
+      @apply md:ml-auto pr-12;
     }
   }
 

resources/img/elements/select-drop-button.svg

@@ -0,0 +1,4 @@
+<svg width="36" height="36" viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="18" cy="18" r="17" transform="rotate(-90 18 18)" stroke="#136F63" stroke-width="2"/>
+<path d="M10.7992 14.76L17.8006 21.6L25.1992 14.76" stroke="#136F63" stroke-width="2"/>
+</svg>

resources/js/filter-articles.ts

@@ -14,13 +14,6 @@ export default function filterArticlesInit() {
     const sortByValue = sortBySelect.value;
     const rechercheValue = rechercheInput.value;
 
-    console.table({
-      etiquettes: etiquetteValue,
-      auteurs: auteurValue,
-      sort_by: sortByValue,
-      recherche: rechercheValue,
-    });
-
     try {
       const response = await fetch(
         `/wp-json/dynamiques-datas/v1/build/articles?etiquette=${etiquetteValue}&auteur=${auteurValue}&sort_by=${sortByValue}&recherche=${rechercheValue}`
@@ -32,6 +25,8 @@ export default function filterArticlesInit() {
       const articlesContainer = document.querySelector('.post-grid__list');
       if (!articlesContainer) return;
       articlesContainer.innerHTML = data.html_template;
+
+      updatePostCount(data.post_count);
     } catch (error) {
       console.error('Erreur lors de la récupération des articles:', error);
     }
@@ -46,3 +41,9 @@ export default function filterArticlesInit() {
     hydrateArticles();
   });
 }
+
+function updatePostCount(count: number) {
+  const postCount = document.querySelector('.post-count__count');
+  if (!postCount) return;
+  postCount.innerHTML = count.toString();
+}

template-parts/articles/articles-grid.php

@@ -35,13 +35,13 @@ $thematiques = get_terms(array(
 			<div class="post-grid__toolbar-actions">
 
 				<select name="etiquettes">
-					<option value="1"><?php _e('Thématiques', 'dynamiques'); ?></option>
+					<option value="1"><?php _e('Tous les tags', 'dynamiques'); ?></option>
 					<?php foreach ($thematiques as $thematique) : ?>
 						<option value="<?php echo $thematique->term_id; ?>"><?php echo $thematique->name; ?></option>
 					<?php endforeach; ?>
 				</select>
 				<select name="auteurs">
-					<option value="1"><?php _e('Auteur·e·s', 'dynamiques'); ?></option>
+					<option value="1"><?php _e('Tous·tes les auteur·e·s', 'dynamiques'); ?></option>
 					<?php foreach ($authors as $author) : ?>
 						<option value="<?php echo $author->ID; ?>"><?php echo $author->post_title; ?></option>
 					<?php endforeach; ?>

template-parts/articles/card-article.php

@@ -7,7 +7,7 @@ $link = get_the_permalink($ID);
 
 $related_revue = get_field('related_revue', $ID);
 $related_revue_issue_number = $related_revue ? get_field('issue_number', $related_revue) : null;
-
+$is_multiple_issue_number = $related_revue_issue_number && is_numeric($related_revue_issue_number) && strpos($related_revue_issue_number, '.') !== false;
 $showAuthors = $args['showAuthors'] ?? false;
 $authors = get_field('authors', $ID);
 
@@ -44,11 +44,26 @@ $authors = get_field('authors', $ID);
 		<?php endif; ?>
 	</div>
 
-	<div class="issue-number">
+	<?php if ($is_multiple_issue_number) : ?>
-		<?php if (isset($related_revue_issue_number) && is_numeric($related_revue_issue_number)) : ?>
+		<!-- Contenu pour les numéros d'issue à virgule -->
-			<span><?php echo $related_revue_issue_number; ?></span>
+		<div class="issue-number-group">
-		<?php endif; ?>
+			<?php
-	</div>
+			$issue_number_parts = explode('.', $related_revue_issue_number);
-
+			?>
+			<?php foreach ($issue_number_parts as $issue_number) : ?>
+				<div class="issue-number">
+					<?php if (isset($issue_number) && is_numeric($issue_number)) : ?>
+						<span><?php echo $issue_number; ?></span>
+					<?php endif; ?>
+				</div>
+			<?php endforeach; ?>
+		</div>
+	<?php else: ?>
+		<div class="issue-number">
+			<?php if (isset($related_revue_issue_number) && is_numeric($related_revue_issue_number)) : ?>
+				<span><?php echo $related_revue_issue_number; ?></span>
+			<?php endif; ?>
+		</div>
+	<?php endif; ?>
 
 </a>

template-parts/revues/card-revue.php

@@ -5,6 +5,7 @@ $date = get_the_date('F Y', $ID);
 $cover = get_the_post_thumbnail_url($ID);
 $link = get_the_permalink($ID);
 $issue_number = get_field('issue_number', $ID);
+$is_multiple_issue_number = $issue_number && is_numeric($issue_number) && strpos($issue_number, '.') !== false;
 ?>
 
 <a href="<?php echo $link; ?>" class="post-card post-card--revue <?php echo $cover ? 'has-cover' : ''; ?>">
@@ -22,11 +23,26 @@ $issue_number = get_field('issue_number', $ID);
 		<time class="post-card__date" datetime="<?php echo $date; ?>"><?php echo $date; ?></time>
 	</div>
 
-	<div class="issue-number">
+	<?php if ($is_multiple_issue_number) : ?>
-		<?php if (isset($issue_number) && is_numeric($issue_number)) : ?>
+		<!-- Contenu pour les numéros d'issue à virgule -->
-			<span><?php echo $issue_number; ?></span>
+		<div class="issue-number-group">
-		<?php endif; ?>
+			<?php
-	</div>
+			$issue_number_parts = explode('.', $issue_number);
-
+			?>
+			<?php foreach ($issue_number_parts as $issue_number) : ?>
+				<div class="issue-number">
+					<?php if (isset($issue_number) && is_numeric($issue_number)) : ?>
+						<span><?php echo $issue_number; ?></span>
+					<?php endif; ?>
+				</div>
+			<?php endforeach; ?>
+		</div>
+	<?php else: ?>
+		<div class="issue-number">
+			<?php if (isset($issue_number) && is_numeric($issue_number)) : ?>
+				<span><?php echo $issue_number; ?></span>
+			<?php endif; ?>
+		</div>
+	<?php endif; ?>
 
 </a>