Fix z-index slideover and place it from the left instead of right

rapidez · Feb 21, 2025 · a62dde8 · a62dde8
1 parent e585838
commit a62dde8
Showing 1 changed file with 20 additions and 18 deletions.
diff --git a/resources/views/listing/filters.blade.php b/resources/views/listing/filters.blade.php
@@ -1,22 +1,24 @@
 @php($id = uniqid('filters-'))
-<x-rapidez::slideover.mobile :$id :title="__('Filters')" position="right">
-    <div class="w-full p-2 max-lg:bg-white max-lg:p-5">
-        {{-- On mobile the filters aren't immedately visible so we should defer loading --}}
-        <lazy>
-            @include('rapidez::listing.partials.filter.selected')
-            @include('rapidez::listing.partials.filter.category')
-            <template v-for="filter in filters">
-                @include('rapidez::listing.partials.filter.price')
-                @include('rapidez::listing.partials.filter.swatch')
-                @include('rapidez::listing.partials.filter.boolean')
-                @include('rapidez::listing.partials.filter.select')
-            </template>
-        </lazy>
-        <x-rapidez::button.primary for="{{ $id }}" class="w-full text-sm lg:hidden">
-            @lang('Show results')
-        </x-rapidez::button.primary>
-    </div>
-</x-rapidez::slideover.mobile>
+<div class="max-lg:relative max-lg:z-slideover">
+    <x-rapidez::slideover.mobile :$id :title="__('Filters')">
+        <div class="w-full p-2 max-lg:bg-white max-lg:p-5">
+            {{-- On mobile the filters aren't immedately visible so we should defer loading --}}
+            <lazy>
+                @include('rapidez::listing.partials.filter.selected')
+                @include('rapidez::listing.partials.filter.category')
+                <template v-for="filter in filters">
+                    @include('rapidez::listing.partials.filter.price')
+                    @include('rapidez::listing.partials.filter.swatch')
+                    @include('rapidez::listing.partials.filter.boolean')
+                    @include('rapidez::listing.partials.filter.select')
+                </template>
+            </lazy>
+            <x-rapidez::button.primary for="{{ $id }}" class="w-full text-sm lg:hidden">
+                @lang('Show results')
+            </x-rapidez::button.primary>
+        </div>
+    </x-rapidez::slideover.mobile>
+</div>
 
 <x-rapidez::button.secondary :for="$id" class="w-full lg:hidden">
     @lang('Filters')