From da5c836cd80b5a5da6feb7cc70c7418b31e02dae Mon Sep 17 00:00:00 2001
From: tblivet <thibault.blivet@prestashop.com>
Date: Wed, 12 Jun 2024 09:28:13 +0200
Subject: [PATCH] feat: harmonize left col

---
 modules/ps_facetedsearch/ps_facetedsearch.tpl    |  4 ++--
 .../views/templates/front/catalog/facets.tpl     |  2 +-
 src/scss/core/layout/_left-column.scss           |  8 ++++++++
 .../_search-filters-modules.scss                 |  8 ++++----
 .../search-filters/_search-filters.scss          | 16 ++++++----------
 5 files changed, 21 insertions(+), 17 deletions(-)

diff --git a/modules/ps_facetedsearch/ps_facetedsearch.tpl b/modules/ps_facetedsearch/ps_facetedsearch.tpl
index fd9b4da32..dff2c302f 100644
--- a/modules/ps_facetedsearch/ps_facetedsearch.tpl
+++ b/modules/ps_facetedsearch/ps_facetedsearch.tpl
@@ -3,8 +3,8 @@
  * file that was distributed with this source code.
  *}
 
-{if isset($listing.rendered_facets)}
-  <div id="search_filters_wrapper" class="d-none d-md-block">
+{if isset($listing.rendered_facets) && !empty($listing.rendered_facets)}
+  <div id="search_filters_wrapper" class="d-none d-md-block left-block">
     <div id="_desktop_faceted">
       {$listing.rendered_facets nofilter}
     </div>
diff --git a/modules/ps_facetedsearch/views/templates/front/catalog/facets.tpl b/modules/ps_facetedsearch/views/templates/front/catalog/facets.tpl
index 8777152cf..ad8cad180 100644
--- a/modules/ps_facetedsearch/views/templates/front/catalog/facets.tpl
+++ b/modules/ps_facetedsearch/views/templates/front/catalog/facets.tpl
@@ -21,7 +21,7 @@
 {if $displayedFacets|count}
   <div id="search-filters" class="{$componentName} d-flex flex-direction-column flex-wrap w-100">
     {block name='facets_title'}
-      <p class="{$componentName}-title d-none d-md-block">{l s='Filter By' d='Shop.Theme.Actions'}</p>
+      <p class="{$componentName}-title left-block__title d-none d-md-block">{l s='Filter By' d='Shop.Theme.Actions'}</p>
     {/block}
 
     {block name='facets_clearall_button'}
diff --git a/src/scss/core/layout/_left-column.scss b/src/scss/core/layout/_left-column.scss
index b3f5dae9a..36228785c 100644
--- a/src/scss/core/layout/_left-column.scss
+++ b/src/scss/core/layout/_left-column.scss
@@ -21,6 +21,14 @@ $component-name: left-block;
     font-size: var(--#{$component-name}-title-size);
     font-weight: 600;
     border: none;
+
+    &__link {
+      color: var(--#{$component-name}-link-color);
+
+      &:hover {
+        color: var(--bs-link-hover-color);
+      }
+    }
   }
 
   &__content {
diff --git a/src/scss/custom/components/search-filters-modules/_search-filters-modules.scss b/src/scss/custom/components/search-filters-modules/_search-filters-modules.scss
index 6b15a48b9..b0b487fbf 100644
--- a/src/scss/custom/components/search-filters-modules/_search-filters-modules.scss
+++ b/src/scss/custom/components/search-filters-modules/_search-filters-modules.scss
@@ -3,12 +3,12 @@ $component-name: search-filters-modules;
 .#{$component-name} {
   padding-bottom: 1rem;
   margin-bottom: 2rem;
-  border-bottom: var(--category-tree-border-bottom);
+  border-bottom: var(--left-block-border-bottom);
 
   &-title {
-    font-size: var(--category-tree-title-size);
+    font-size: var(--left-block-title-size);
     font-weight: 600;
-    color: var(--category-tree-title-color);
+    color: var(--left-block-title-color);
   }
 
   &__list {
@@ -20,7 +20,7 @@ $component-name: search-filters-modules;
       display: block;
       font-weight: 600;
       line-height: 2rem;
-      color: var(--category-tree-title-color);
+      color: var(--left-block-title-color);
     }
   }
 }
diff --git a/src/scss/custom/components/search-filters/_search-filters.scss b/src/scss/custom/components/search-filters/_search-filters.scss
index c664affbb..44a543512 100644
--- a/src/scss/custom/components/search-filters/_search-filters.scss
+++ b/src/scss/custom/components/search-filters/_search-filters.scss
@@ -1,26 +1,22 @@
 $component-name: search-filters;
 
 .#{$component-name} {
-  padding-bottom: 1rem;
-  margin-bottom: 2rem;
-  border-bottom: var(--category-tree-border-bottom);
-
   & &-title {
-    font-size: var(--category-tree-title-size);
+    font-size: var(--left-block-title-size);
     font-weight: 600;
-    color: var(--category-tree-title-color);
+    color: var(--left-block-title-color);
   }
 
   & &-subtitle {
-    font-size: var(--category-tree-subtitle-size);
+    font-size: var(--left-block-subtitle-size);
     font-weight: 600;
-    color: var(--category-tree-subtitle-color);
+    color: var(--left-block-subtitle-color);
   }
 
   & &-link {
-    font-size: var(--category-tree-subtitle-size);
+    font-size: var(--left-block-subtitle-size);
     font-weight: 300;
-    color: var(--category-tree-subtitle-color);
+    color: var(--left-block-subtitle-color);
   }
 
   & &-label {