Merge pull request #420 from RedeMapas/feature/botao-aplicar-filtros-…

…eventos Coloquei botao de aplicar filtros para mobile
RedeMapas · Aug 28, 2024 · dcd297a · dcd297a
2 parents 6d16e9a + 8617e0d
commit dcd297a
Show file tree

Hide file tree

Showing 3 changed files with 29 additions and 3 deletions.
diff --git a/src/modules/Search/components/search-filter/template.php b/src/modules/Search/components/search-filter/template.php
@@ -25,9 +25,10 @@
             </button>
         </div>
         <div :class="['search-filter__filter', {'show': showMenu}]">
-            <div class="content">
-                <a href="#main-app" class="search-filter__filter--close button button--icon" @click="toggleFilter()"><?= i::_e('Fechar') ?> <mc-icon name="close"></mc-icon></a>
-                <slot><?= i::__('Filtrar'); ?></slot>
+            <div class="content button--filter--bottom">
+            <slot><?= i::__('Filtrar'); ?></slot>
+            <a href="#main-app" class="button--primary button--large button--icon button button--icon" @click="toggleFilter()"><?= i::_e('Aplicar Filtros') ?></a>
+
             </div>
         </div>
     </div>

diff --git a/src/themes/BaseV2/assets-src/sass/2.components/_button.scss b/src/themes/BaseV2/assets-src/sass/2.components/_button.scss
@@ -347,4 +347,23 @@
             color: var(--mc-warning-500);
         }
     }
+    @media (max-width: 900px){
+        &--filter--bottom{
+            top: -35px;
+            position: relative;
+            .button--primary.button--large{
+                position: relative;
+                top: 30px;
+            }
+        }
+    }
+    @media (min-width: 901px){
+        &--filter--bottom{
+            top: 0px;
+            position: relative;
+            .button--primary.button--large{
+                display: none;
+            }
+        }
+    }
 }
diff --git a/src/themes/BaseV2/assets-src/sass/2.components/_search-filter.scss b/src/themes/BaseV2/assets-src/sass/2.components/_search-filter.scss
@@ -155,6 +155,12 @@
             display: block;
         }
     }
+    @media (min-width: 901px) {
+        &__filter {
+            display: block;
+        }
+
+    }
 
     // in list
     .list {