feat: harmonize left col

PrestaShop · Jun 12, 2024 · da5c836 · da5c836
1 parent a10cba3
commit da5c836
Show file tree

Hide file tree

Showing 5 changed files with 21 additions and 17 deletions.
diff --git 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
@@ -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
@@ -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
@@ -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
@@ -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 {