Feedback autocomplete

Roene-JustBetter · Oct 1, 2024 · 4c230d6 · 4c230d6
1 parent 298e857
commit 4c230d6
Show file tree

Hide file tree

Showing 6 changed files with 13 additions and 31 deletions.
diff --git a/config/rapidez/frontend.php b/config/rapidez/frontend.php
@@ -83,10 +83,12 @@
 
     // Z-Index per element
     'z-indexes' => [
-        'header-dropdowns' => 'z-20',
-        'lightbox'         => 'z-30',
-        'notification'     => 'z-20',
-        'slideover'        => 'z-50',
+        'header-dropdowns'      => 'z-20',
+        'search-autocomplete'   => 'z-20',
+        'button-autocomplete'   => 'z-30',
+        'lightbox'              => 'z-30',
+        'notification'          => 'z-20',
+        'slideover'             => 'z-50',
     ],
 
     // Add to cart settings to automaticly select configurable- or product options (true/false)

diff --git a/resources/views/components/input.blade.php b/resources/views/components/input.blade.php
@@ -1,19 +1 @@
-@props(['name', 'label', 'wrapperClass', 'labelClass'])
-
-<div class="{{ $wrapperClass ?? '' }}">
-    @if (!isset($label) || (isset($label) && $label))
-        <x-rapidez::label for="{{ $name }}" class="{{ $labelClass ?? '' }}">
-            @lang($label ?? ucfirst($name))
-        </x-rapidez::label>
-    @endif
-    <input
-        {{ $attributes->merge([
-            'id' => $name,
-            'name' => $name,
-            'type' => 'text',
-            'placeholder' => __($placeholder ?? ''),
-            'dusk' => $attributes->get('v-bind:dusk') ? null : $name,
-            'class' => 'w-full py-2 px-3 border-border rounded !ring-0 focus:!border-inactive sm:text-sm text-neutral',
-        ]) }}
-    >
-</div>
+<input {{ $attributes->twMerge('w-full py-3 px-5 border rounded-md border-border outline-0 ring-0 text-sm transition-colors focus:ring-transparent focus:border-neutral disabled:cursor-not-allowed disabled:bg-disabled disabled:border-disabled placeholder:text-inactive [&::-webkit-inner-spin-button]:appearance-none [&:user-invalid:not(:placeholder-shown)]:border-red-500') }} />
diff --git a/resources/views/components/label.blade.php b/resources/views/components/label.blade.php
@@ -1,3 +1,3 @@
-<label {{ $attributes->merge(['class' => 'font-semibold text-inactive text-sm block mb-2']) }}>
+<span {{ $attributes->twMerge("font-medium text-inactive text-sm block mb-2 has-[~_*_:required,~:required]:after:content-['*']") }}>
     {{ $slot }}
-</label>
+</span>
diff --git a/resources/views/layouts/partials/footer/navigation.blade.php b/resources/views/layouts/partials/footer/navigation.blade.php
@@ -7,6 +7,7 @@
         <li><a href="/gear.html">Gear</a></li>
         <li><a href="/training.html">Training</a></li>
         <li><a href="/sale.html">Sale</a></li>
+        <li><a href="/kemrkemrkemrkmekmr.html">404</a></li>
     </ul>
     <ul>
         <li><strong>Support</strong></li>

diff --git a/resources/views/layouts/partials/header/autocomplete.blade.php b/resources/views/layouts/partials/header/autocomplete.blade.php
@@ -27,21 +27,18 @@ class="relative w-full"
             class="pointer-events-none fixed z-10 inset-0 cursor-pointer bg-black/40 opacity-0 transition duration-500"
             :class="{ 'pointer-events-auto opacity-100': overlay, 'opacity-0 pointer-events-none': !overlay }"
         ></div>
-        <div class="rounded-r-xl border-l absolute right-0 inset-y-0 w-14 pointer-events-none flex items-center justify-center {{ config('rapidez.frontend.z-indexes.lightbox') }}">
+        <div class="rounded-r-xl border-l absolute right-0 inset-y-0 w-14 pointer-events-none flex items-center justify-center {{ config('rapidez.frontend.z-indexes.button-autocomplete') }}">
             <x-heroicon-o-magnifying-glass class="size-5 text-neutral" />
         </div>
         <data-search
             placeholder="@lang('Search')"
             v-on:value-selected="search"
             component-id="autocomplete"
             :inner-class="{ input: '{{ $inputClasses }}' }"
-            {{-- These classes are only used when you come from a page with a product listing, --}}
-            {{-- click on a link that leads to a 404 page and try to use the search there --}}
             class="relative [&_*]:!m-0"
             :data-field="Object.keys(config.searchable)"
             :field-weights="Object.values(config.searchable)"
             :show-icon="false"
-            icon-position="right"
             fuzziness="AUTO"
             :debounce="debounce"
             @blur="showOverlay(false)"
@@ -55,7 +52,7 @@ class="relative [&_*]:!m-0"
                 slot-scope="{ downshiftProps: { isOpen }, data: suggestions, value }"
             >
                 <div
-                    class="{{ config('rapidez.frontend.z-indexes.header-dropdowns') }} absolute -inset-x-5 top-14 max-h-svh overflow-x-hidden overflow-y-auto md:top-14 md:max-h-[600px] md:rounded-xl md:border bg-white shadow-xl max-md:pt-0 p-5 md:pt-0 md:inset-x-0 md:w-full md:-translate-y-px"
+                    class="{{ config('rapidez.frontend.z-indexes.search-autocomplete') }} absolute -inset-x-5 top-14 max-h-svh overflow-x-hidden overflow-y-auto md:top-14 md:max-h-[600px] md:rounded-xl md:border bg-white shadow-xl max-md:pt-0 p-5 md:pt-0 md:inset-x-0 md:w-full md:-translate-y-px"
                     v-if="isOpen && (suggestions.length || resultsCount)"
                 >
                     @include('rapidez::layouts.partials.header.autocomplete.all-results')

diff --git a/resources/views/layouts/partials/header/autocomplete/products.blade.php b/resources/views/layouts/partials/header/autocomplete/products.blade.php
@@ -10,7 +10,7 @@
                         @{{ suggestion.source.price | price }}
                     </div>
                     <div class="text-base font-base text-primary font-sans font-bold">
-                        @{{ suggestion.source.price | price }}
+                        @{{ (suggestion.source.special_price || suggestion.source.price) | price }}
                     </div>
                 </div>
             </div>