Merge pull request #414 from NeOMakinG/issue409

Fix QA feedbacks
PrestaShop · Jan 5, 2023 · cc4e596 · cc4e596
2 parents a514114 + 03ac364
commit cc4e596
Show file tree

Hide file tree

Showing 10 changed files with 73 additions and 51 deletions.
diff --git a/src/scss/core/components/_search.scss b/src/scss/core/components/_search.scss
@@ -4,12 +4,18 @@ $component-name: search;
   margin: 0.5rem 0;
 
   &__product {
-    margin: 0.5rem 0;
+    margin: 0.25rem 0;
   }
 
   &__link {
     display: flex;
     align-items: center;
+    padding: 0.25rem 0.5rem;
+    border-radius: $border-radius;
+
+    &:hover {
+      background: var(--bs-gray-100);
+    }
   }
 
   &__name {
@@ -93,8 +99,7 @@ $component-name: search;
 
     &__results {
       max-height: 20rem;
-      padding: 0.5rem 1rem;
-      padding-right: 1.5rem;
+      padding: 0.5rem 1.5rem 0.5rem 0.5rem;
       margin: 0;
       overflow-y: scroll;
     }

diff --git a/src/scss/core/layout/_header.scss b/src/scss/core/layout/_header.scss
@@ -13,8 +13,15 @@ $component-name: header;
   max-width: 100vw;
   background-color: var(--header-bg);
 
-  a:not(.dropdown-item) {
+  a:not(.dropdown-item):not(.btn) {
     color: var(--header-color);
+
+    &:hover {
+      &,
+      i {
+        color: var(--bs-primary);
+      }
+    }
   }
 
   &__top {

diff --git a/src/scss/custom/components/_language-selector.scss b/src/scss/custom/components/_language-selector.scss
@@ -1,20 +1,7 @@
 $component-name: language-selector;
 
-.#{$component-name} {
-  display: flex;
-  align-items: center;
-
-  > span {
-    margin-right: 0.5rem;
-  }
-
-  i.expand-more {
-    color: $default-icon-color;
-  }
-
-  @include media-breakpoint-down(md) {
-    &__wrapper {
-      margin-bottom: 1rem;
-    }
+.#{$component-name}__wrapper {
+  select {
+    cursor: pointer;
   }
 }
diff --git a/src/scss/custom/modules/_mainmenu.scss b/src/scss/custom/modules/_mainmenu.scss
@@ -38,6 +38,13 @@
             font-weight: 600;
             color: $dropdown-link-color;
 
+            &:hover {
+              &,
+              i {
+                color: var(--bs-primary);
+              }
+            }
+
             &::after {
               display: none;
             }

diff --git a/src/scss/custom/pages/product/_product.scss b/src/scss/custom/pages/product/_product.scss
@@ -92,6 +92,22 @@
       border: 1px $gray-200 solid;
     }
   }
+
+  @include media-breakpoint-down(md) {
+    .carousel-control-next {
+      right: 1rem;
+    }
+
+    .carousel-control-prev {
+      left: 1rem;
+    }
+
+    .carousel-control-prev,
+    .carousel-control-next {
+      width: 3rem;
+      height: 3rem;
+    }
+  }
 }
 
 // Needs to be outside of the .page-product scope because it can be inside a modal

diff --git a/templates/_partials/form-fields.tpl b/templates/_partials/form-fields.tpl
@@ -10,9 +10,9 @@
 
 {else}
 
-  <div class="mb-3 {if !empty($field.errors)}has-error{/if}">
+  <div class="mb-3{if !empty($field.errors)} has-error{/if}">
     {if ($field.type !== 'checkbox')}
-      <label class="form-label{if $field.required} required{/if}">
+      <label class="form-label{if $field.required} required{/if}" for="field-{$field.name}">
         {if $field.type !== 'checkbox'}
           {$field.label}
         {/if}
@@ -55,13 +55,12 @@
                 class="form-check-input"
                 type="radio"
                 name="{$field.name}"
-                id="{$field.name}_{$value}"
+                id="field-{$field.name}_{$value}"
                 value="{$value}"
-                checked
                 {if $field.required}required{/if}
                 {if $value eq $field.value} checked {/if}
               >
-              <label class="form-check-label" for="{$field.name}_{$value}">
+              <label class="form-check-label" for="field-{$field.name}_{$value}">
                 {$label}
               </label>
             </div>
@@ -78,11 +77,11 @@
             name="{$field.name}"
             type="checkbox"
             value="1"
-            id="{$field.name}"
+            id="field-{$field.name}"
             value="1" {if $field.value}checked="checked"{/if}
             {if $field.required}required{/if}
           >
-          <label class="form-check-label" for="{$field.name}">
+          <label class="form-check-label" for="field-{$field.name}">
             {$field.label nofilter}
           </label>
         </div>
@@ -129,6 +128,7 @@
           <input
             class="form-control js-child-focus js-visible-password"
             name="{$field.name}"
+            id="field-{$field.name}"
             type="password"
             {if $field.autocomplete}autocomplete="{$field.autocomplete}"{/if}
             value=""
@@ -159,13 +159,14 @@
         <input
           class="form-control"
           name="{$field.name}"
+          id="field-{$field.name}"
           type="{$field.type}"
           value="{$field.value}"
           {if $field.autocomplete}autocomplete="{$field.autocomplete}"{/if}
           {if isset($field.availableValues.placeholder)}placeholder="{$field.availableValues.placeholder}"{/if}
           {if $field.maxLength}maxlength="{$field.maxLength}"{/if}
-          {if $field.required}required{/if}
           aria-label="{$field.name}"
+          {if $field.required}required{/if}
         >
         {if isset($field.availableValues.comment)}
           <span class="form-text">
@@ -180,13 +181,10 @@
       {include file='_partials/form-errors.tpl' errors=$field.errors}
     {/block}
 
-    <div class="form-text">
-      {block name='form_field_comment'}
-        {if (!$field.required && !in_array($field.type, ['radio-buttons', 'checkbox']))}
-         {l s='Optional' d='Shop.Forms.Labels'}
-        {/if}
-      {/block}
-    </div>
+    {block name='form_field_comment'}
+      {if (!$field.required && !in_array($field.type, ['radio-buttons', 'checkbox']))}
+        <div class="form-text">{l s='Optional' d='Shop.Forms.Labels'}</div>
+      {/if}
+    {/block}
   </div>
-
 {/if}
diff --git a/templates/catalog/_partials/product-cover-thumbnails.tpl b/templates/catalog/_partials/product-cover-thumbnails.tpl
@@ -6,7 +6,7 @@
 <div class="product__images js-images-container">
   {if $product.images|@count > 0}
     <div id="product-images" class="carousel slide js-product-carousel"
-      data-bs-ride="carousel" data-bs-interval="false">
+      data-bs-ride="carousel">
 
       <div class="carousel-inner">
         {include file='catalog/_partials/product-flags.tpl'}

diff --git a/templates/checkout/_partials/cart-summary-product-line.tpl b/templates/checkout/_partials/cart-summary-product-line.tpl
@@ -96,9 +96,11 @@
       {/if}
     </div>
 
-    <div class="cart-summary__product__basic">
-      <span class="cart-summary__product__regular text-decoration-line-through">{$product.regular_price}</span>
-    </div>
+    {if $product.has_discount}
+      <div class="cart-summary__product__basic">
+        <span class="cart-summary__product__regular text-decoration-line-through">{$product.regular_price}</span>
+      </div>
+    {/if}
 
     {hook h='displayProductPriceBlock' product=$product type="unit_price"}
   </div>

diff --git a/templates/checkout/_partials/cart-voucher.tpl b/templates/checkout/_partials/cart-voucher.tpl
@@ -45,7 +45,7 @@
               {/block}
 
               {block name='cart_voucher_notifications'}
-                <div class="alert alert-danger js-error d-none" role="alert">
+                <div class="alert alert-danger js-error mt-2" role="alert" style="display: none;">
                   <i class="material-icons">&#xE001;</i><span class="ml-1 js-error-text"></span>
                 </div>
               {/block}

diff --git a/templates/customer/_partials/order-messages.tpl b/templates/customer/_partials/order-messages.tpl
@@ -4,17 +4,17 @@
  *}
 {block name='order_messages_table'}
   {if $order.messages}
-    <div class="box messages">
-      <h3>{l s='Messages' d='Shop.Theme.Customeraccount'}</h3>
+    <div class="customer__messages mb-3">
+      <h3 class="mb-3">{l s='Messages' d='Shop.Theme.Customeraccount'}</h3>
       {foreach from=$order.messages item=message}
-        <div class="message row">
-          <div class="col-sm-4">
-            {$message.name}<br />
-            {$message.message_date}
-          </div>
-          <div class="col-sm-8">
-            {$message.message nofilter}
-          </div>
+        <div class="customer__message border rounded p-3 my-2">
+          <div class="customer__message__content row">
+            <div class="col-sm-4 mb-2 mb-sm-0">
+              <p class="fw-bold mb-0">{$message.name}</p>
+              <p class="fs-6 mb-0">{$message.message_date}</p>
+            </div>
+            <div class="col-sm-8">{$message.message nofilter}</div>
+          </div> 
         </div>
       {/foreach}
     </div>