From 3f860def0be429bd340b1af5259343c0642c5c62 Mon Sep 17 00:00:00 2001
From: lnormandon <lnormandon@openstudio.fr>
Date: Thu, 4 Jul 2024 14:18:10 +0200
Subject: [PATCH] fixs review anais

---
 .../ItemHeader/ItemHeader.stories.js          |  9 ++++----
 components/Molecules/OrderTag/OrderTag.css    |  6 +++++
 .../Molecules/OrderTag/OrderTag.stories.js    | 23 +++++++++++++------
 components/Molecules/OrderTag/OrderTag.twig   |  2 ++
 components/Molecules/Tooltip/tooltip.css      |  1 -
 .../Card/PickupPoint/pickupPoint.css          |  1 +
 .../ProductCard/ProductCard.stories.js        |  3 ++-
 .../SimilarContentCard/similarContentCard.css |  1 +
 8 files changed, 33 insertions(+), 13 deletions(-)

diff --git a/components/Molecules/ItemHeader/ItemHeader.stories.js b/components/Molecules/ItemHeader/ItemHeader.stories.js
index 29eeef9..c491fad 100644
--- a/components/Molecules/ItemHeader/ItemHeader.stories.js
+++ b/components/Molecules/ItemHeader/ItemHeader.stories.js
@@ -5,9 +5,10 @@ export default {
 };
 
 export const Base = {
-  render: (args) => ItemHeader(args),
+  render: (args) =>
+    `<div class='h-[78px]'><ul class="flex h-full">${ItemHeader(args)}</ul></div>`,
   args: {
-    customText: "Item menu",
-    href: "",
-  },
+    customText: 'Item menu',
+    href: ''
+  }
 };
diff --git a/components/Molecules/OrderTag/OrderTag.css b/components/Molecules/OrderTag/OrderTag.css
index 5bcdce4..52160d1 100644
--- a/components/Molecules/OrderTag/OrderTag.css
+++ b/components/Molecules/OrderTag/OrderTag.css
@@ -15,6 +15,12 @@
     margin-right: rem-convert(6px);
   }
 
+  &--withoutChip {
+    &:before {
+      content: none;
+    }
+  }
+
   &--informative {
     background-color: var(--informative-lightest);
     border: 1px solid var(--informative);
diff --git a/components/Molecules/OrderTag/OrderTag.stories.js b/components/Molecules/OrderTag/OrderTag.stories.js
index d07a84e..1ef681d 100644
--- a/components/Molecules/OrderTag/OrderTag.stories.js
+++ b/components/Molecules/OrderTag/OrderTag.stories.js
@@ -7,21 +7,30 @@ export default {
 export const Base = {
   render: (args) => OrderTag(args),
   args: {
-    customText: "Commande validée",
+    customText: 'Commande validée',
+    withoutChip: false
   },
   argTypes: {
     variant: {
-      options: ['informative', 'success', 'validated', 'grey', 'error', 'processing', 'warning', 'vermillon'],
-      control: { type: 'select' },
+      options: [
+        'informative',
+        'success',
+        'validated',
+        'grey',
+        'error',
+        'processing',
+        'warning',
+        'vermillon'
+      ],
+      control: { type: 'select' }
     },
     type: {
       options: ['outline', 'minimal'],
-      control: { type: 'select' },
+      control: { type: 'select' }
     }
-  },
+  }
 };
 
-
 export const Variants = {
   render: () => `
     <h2 class="font-bold text-lg">Status Commande</h2>
@@ -62,4 +71,4 @@ export const Variants = {
     validated : 
     ${OrderTag({ customText: 'Epuisé', variant: 'error', type: 'minimal' })}</div>
   `
-}
+};
diff --git a/components/Molecules/OrderTag/OrderTag.twig b/components/Molecules/OrderTag/OrderTag.twig
index fbc80f5..76faba4 100644
--- a/components/Molecules/OrderTag/OrderTag.twig
+++ b/components/Molecules/OrderTag/OrderTag.twig
@@ -1,10 +1,12 @@
 {% set customText = customText|default('') %}
 {% set variant = variant|default('informative') %}
 {% set type = type|default('outline') %}
+{% set withoutChip = withoutChip|default(false) %}
 
 
 {% set classes = '' %}
 {% set classes = classes ~ ' OrderTag--' ~ variant %}
 {% set classes = classes ~ ' OrderTag--' ~ type %}
+{% if withoutChip %}{% set classes = classes ~ ' OrderTag--withoutChip' %}{% endif %}
 
 <span class="OrderTag{{ classes }}">{{ customText }}</span>
diff --git a/components/Molecules/Tooltip/tooltip.css b/components/Molecules/Tooltip/tooltip.css
index ba65a40..4251a6c 100644
--- a/components/Molecules/Tooltip/tooltip.css
+++ b/components/Molecules/Tooltip/tooltip.css
@@ -17,7 +17,6 @@
     width: max-content;
     background-color: var(--black);
     color: var(--white);
-    text-align: center;
     padding: rem-convert(22px) rem-convert(34px) rem-convert(22px)
       rem-convert(20px);
     border-radius: 8px;
diff --git a/components/Organisms/Card/PickupPoint/pickupPoint.css b/components/Organisms/Card/PickupPoint/pickupPoint.css
index 433874e..861b746 100644
--- a/components/Organisms/Card/PickupPoint/pickupPoint.css
+++ b/components/Organisms/Card/PickupPoint/pickupPoint.css
@@ -97,6 +97,7 @@
     @apply h4;
     font-weight: 700;
     color: var(--black);
+    margin-bottom: rem-convert(16px);
   }
   &-address {
     @apply paragraph-2;
diff --git a/components/Organisms/ProductCard/ProductCard.stories.js b/components/Organisms/ProductCard/ProductCard.stories.js
index 180cee5..f3061cb 100644
--- a/components/Organisms/ProductCard/ProductCard.stories.js
+++ b/components/Organisms/ProductCard/ProductCard.stories.js
@@ -11,7 +11,8 @@ export default {
 };
 
 export const standard = {
-  render: (args) => Standard(args),
+  render: (args) =>
+    `<div class='max-w-[187px] sm:max-w-[340px] lg:max-w-[400px]'>${Standard(args)}</div>`,
   args: {
     productTitle: 'Nom du produit',
     secondaryTitle: 'Titre secondaire',
diff --git a/components/Organisms/SimilarContentCard/similarContentCard.css b/components/Organisms/SimilarContentCard/similarContentCard.css
index b34130d..7fedecb 100644
--- a/components/Organisms/SimilarContentCard/similarContentCard.css
+++ b/components/Organisms/SimilarContentCard/similarContentCard.css
@@ -16,6 +16,7 @@
     @apply paragraph-2;
     font-weight: 700;
     color: var(--black);
+    margin-bottom: rem-convert(8px);
   }
   &-footer {
     @apply paragraph-6;