includes/api.php

@@ -128,6 +128,8 @@ function like_post($request)
 {
 
 	$post_id = $request->get_param('post_id');
+	write_log($request);
+	write_log($post_id);
 	if (!$post_id) {
 		return new WP_Error('post_id_required', 'Post ID is required', array('status' => 400));
 	}
@@ -155,7 +157,7 @@ function like_post($request)
 		'likes_count' => $new_likes,
 		'message' => 'Like ajouté avec succès'
 	);
-
+	write_log($response_data);
 	$response = new WP_REST_Response($response_data);
 
 	$response->set_status(200);

resources/css/components/post-card--article.css

@@ -2,7 +2,7 @@
   &.has-cover {
     @apply gap-2;
     .post-card__content {
-      @apply md:pl-6;
+      @apply pl-6;
     }
   }
   .post-card__title {

resources/css/components/post-card.css

@@ -1,19 +1,9 @@
 .post-card {
-  @apply p-8 border border-primary relative grid gap-y-4 gap-12 bg-white;
-  grid-template-columns: 1fr;
-  @screen lg {
-    grid-template-columns: 1fr 40px;
-  }
+  @apply p-8 border border-primary relative grid gap-12 bg-white;
+  grid-template-columns: 1fr 40px;
+
   &.has-cover {
-    .post-card__cover {
-      @apply col-span-1;
-    }
-    @screen lg {
-      grid-template-columns: 1fr 3fr 40px;
-      .post-card__cover {
-        @apply col-span-1;
-      }
-    }
+    grid-template-columns: 1fr 3fr 40px;
   }
 
   .content-meta {
@@ -30,9 +20,8 @@
   }
 
   &__cover {
-    @apply order-3 lg:order-1 p-2  object-cover w-full h-36 md:h-56 lg:h-36 md:mt-6 lg:mt-0  relative mb-6 lg:mb-0;
+    @apply p-2  object-cover w-full h-36  relative;
     z-index: 10;
-
     img {
       @apply w-full h-full object-cover;
     }
@@ -57,13 +46,8 @@
     }
   }
 
-  &__content {
-    @apply order-2 lg:order-1;
-  }
-
   .issue-number {
-    @apply order-1 lg:order-1;
-    @apply bg-primary text-white w-[40px] h-auto flex items-center justify-center;
+    @apply bg-primary text-white w-full h-auto flex items-center justify-center;
     aspect-ratio: 1/1;
   }
 }

resources/css/components/post-grid.css

@@ -1,6 +1,6 @@
 .post-grid {
   &__toolbar {
-    @apply flex flex-col md:grid  md:grid-cols-2 gap-4 md:items-center justify-between pb-12;
+    @apply grid grid-cols-1 md:grid-cols-2 gap-4 items-center justify-between pb-12;
 
     h2.post-count {
       @apply flex items-end gap-2;
@@ -16,20 +16,20 @@
     }
 
     .search-bar {
-      @apply md:justify-self-end text-primary;
+      @apply justify-self-end;
       input {
-        @apply w-full md:w-auto py-2 px-4 border border-primary rounded-full;
+        @apply py-2 px-4 border border-primary rounded-full;
         &::placeholder {
-          @apply text-base font-normal text-carhop-green-700;
+          @apply text-sm text-carhop-green-700;
         }
       }
     }
   }
   &__toolbar-actions {
-    @apply col-span-2 flex flex-wrap items-center gap-4;
+    @apply col-span-2 flex items-center gap-4;
 
     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;
+      @apply border border-carhop-green-700 rounded-full py-2 px-4;
     }
 
     select[name='etiquettes'] {
@@ -41,7 +41,7 @@
     }
 
     select[name='sort_by'] {
-      @apply md:ml-auto;
+      @apply ml-auto;
     }
   }
 

resources/css/components/post-header.css

@@ -1,5 +1,5 @@
 .post-header {
-  @apply bg-primary text-white py-32 px-2 lg:px-4 md:px-8 overflow-x-hidden;
+  @apply bg-primary text-white py-32 px-2 lg:px-4 md:px-8;
 
   h1.post-header__title,
   h2.post-header__title {
@@ -25,13 +25,12 @@
   }
   .thumbnail-wrapper {
     @apply order-2 lg:order-1 relative z-20 h-fit;
-    width: calc(100% - 40px);
     padding: 1.2rem;
     /* max-width: calc(70% - 40px);
     @apply mx-auto; */
 
     @screen lg {
-      /* transform: translateX(-10px); */
+      transform: translateX(-40px);
     }
 
     &:before {
@@ -42,17 +41,15 @@
     img {
       aspect-ratio: 4/5;
       /* max-height: 200px; */
-      @apply max-h-[200px] lg:max-h-full  h-full relative z-10;
+      @apply max-h-[200px] lg:max-h-full w-full h-full relative z-10;
       @apply object-cover;
-
       /* width: calc(100% - 2rem);
       height: calc(100% - 2rem);
       margin: 0 auto; */
     }
     .thumbnail-overlay {
       @apply absolute z-0 rotate-3 top-6 left-6 w-full h-full border border-primary bg-white flex items-center justify-center;
-      transform: translate(2px, 2px) rotate(2deg);
-      /* transform: translate(12px, 12px) rotate(3deg); */
+      transform: translate(12px, 12px) rotate(3deg);
       background-image: linear-gradient(#efe8ff, #efe8ff);
       background-size: calc(100% - 12px) calc(100% - 12px);
       background-repeat: no-repeat;
@@ -79,10 +76,7 @@
 
   .socials-buttons {
     @apply flex flex-wrap justify-start xl:justify-end gap-4 h-fit shrink-0;
-    @screen xl {
-      min-width: 570px;
-    }
-
+    min-width: 570px;
     &__button {
       @apply bg-white text-carhop-green-700 px-4 lg:px-6 md:px-8 !py-3 lg:!py-4 font-normal rounded-full w-max flex items-center gap-2;
       transition: transform 0.3s ease-in-out;

template-parts/post-header.php

@@ -70,6 +70,7 @@ $likes_count = get_post_likes_count($post_id);
 				<div class="socials-buttons">
 					<?php
 					$shareUrls = build_share_urls();
+					write_log($shareUrls);
 					?>
 					<button class="socials-buttons__button socials-buttons__button--cite" <?php echo empty($citeReference) ? 'disabled' : ''; ?> title="<?php echo empty($citeReference) ? 'Citation non disponible' : 'Copier la citation'; ?>">
 						<img src="<?php echo get_template_directory_uri(); ?>/resources/img/icons/carhop-citer-article.svg" alt="">