Skip to content

Commit 078eb08

Browse files
Roene-JustBetterRoene-JustBetter
authored
Filter focus state style fixes (#1060)
1 parent daf63b5 commit 078eb08

17 files changed

+82
-75
lines changed

‎resources/views/listing/partials/filter/boolean.blade.php‎

Lines changed: 28 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -2,35 +2,38 @@
22
v-if="filter.input == 'boolean'"
33
:attribute="filter.code"
44
operator="and"
5+
class="relative -mx-1 -mt-1"
56
>
67
<template v-slot="{ items, refine }">
7-
<x-rapidez::accordion.filter v-show="items.length">
8-
<x-slot:content>
9-
<div class="flex flex-col *:py-1 first:*:pt-0 last:*:pb-0 items-start">
10-
<template v-for="item in items">
11-
<x-rapidez::input.checkbox
12-
v-bind:checked="item.isRefined"
13-
v-on:change="refine(item.value)"
14-
>
15-
<span
16-
class="items-baseline flex text-base/5"
17-
:class="item.isRefined ? 'text' : 'text-muted hover:text'"
8+
<div class="overflow-clip">
9+
<x-rapidez::accordion.filter v-show="items.length" class="details-content:overflow-visible px-1 py-1">
10+
<x-slot:content>
11+
<div class="flex flex-col *:py-1 first:*:pt-0 last:*:pb-0 items-start">
12+
<template v-for="item in items">
13+
<x-rapidez::input.checkbox
14+
v-bind:checked="item.isRefined"
15+
v-on:change="refine(item.value)"
1816
>
19-
<template v-if="item.value == '1'">
20-
@lang('Yes')
21-
</template>
22-
<template v-if="item.value == '0'">
23-
@lang('No')
24-
</template>
25-
<span class="block ml-0.5 text-xs">
26-
(@{{ item.count }})
17+
<span
18+
class="items-baseline flex text-base/5"
19+
:class="item.isRefined ? 'text' : 'text-muted hover:text'"
20+
>
21+
<template v-if="item.value == '1'">
22+
@lang('Yes')
23+
</template>
24+
<template v-if="item.value == '0'">
25+
@lang('No')
26+
</template>
27+
<span class="block ml-0.5 text-xs">
28+
(@{{ item.count }})
29+
</span>
2730
</span>
28-
</span>
29-
</x-rapidez::input.checkbox>
30-
</template>
31-
</div>
32-
</x-slot:content>
33-
</x-rapidez::accordion.filter>
31+
</x-rapidez::input.checkbox>
32+
</template>
33+
</div>
34+
</x-slot:content>
35+
</x-rapidez::accordion.filter>
36+
</div>
3437
</template>
3538
</ais-refinement-list>
3639

‎resources/views/listing/partials/filter/price.blade.php‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,11 @@
11
<ais-range-input
22
v-if="listingSlotProps.rangeAttributes.includes(filter.code)"
33
:attribute="filter.code"
4+
class="relative -mx-1 -mt-1"
45
>
56
<template v-slot="{ currentRefinement, range, canRefine, refine, sendEvent }">
6-
<div v-show="range.max">
7-
<x-rapidez::accordion.filter>
7+
<div class="overflow-clip" v-show="range.max">
8+
<x-rapidez::accordion.filter class="details-content:overflow-visible px-1 py-1">
89
<x-slot:content>
910
<div class="flex flex-col">
1011
<div class="flex flex-1">

‎resources/views/listing/partials/filter/select.blade.php‎

Lines changed: 23 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -4,29 +4,32 @@
44
:attribute="filter.code"
55
:limit="6"
66
show-more
7+
class="relative -mx-1 -mt-1"
78
>
89
<template v-slot="{ items, refine, isShowingMore, toggleShowMore, canToggleShowMore }">
9-
<x-rapidez::accordion.filter v-show="items.length" canToggleShowMore>
10-
<x-slot:content>
11-
<div class="flex flex-col *:py-1 first:*:pt-0 last:*:pb-0 items-start">
12-
<template v-for="item in items">
13-
<x-rapidez::input.checkbox
14-
v-bind:checked="item.isRefined"
15-
v-on:change="refine(item.value)"
16-
>
17-
<span
18-
class="items-baseline flex text-base/5"
19-
:class="item.isRefined ? 'text' : 'text-muted hover:text'"
10+
<div class="overflow-clip">
11+
<x-rapidez::accordion.filter v-show="items.length" class="details-content:overflow-visible px-1 py-1" canToggleShowMore>
12+
<x-slot:content>
13+
<div class="flex flex-col *:py-1 first:*:pt-0 last:*:pb-0 items-start">
14+
<template v-for="item in items">
15+
<x-rapidez::input.checkbox
16+
v-bind:checked="item.isRefined"
17+
v-on:change="refine(item.value)"
2018
>
21-
@{{ item.label }}
22-
<span class="block ml-0.5 text-xs" data-testid="listing-filter-count">
23-
(@{{ item.count }})
19+
<span
20+
class="items-baseline flex text-base/5"
21+
:class="item.isRefined ? 'text' : 'text-muted hover:text'"
22+
>
23+
@{{ item.label }}
24+
<span class="block ml-0.5 text-xs" data-testid="listing-filter-count">
25+
(@{{ item.count }})
26+
</span>
2427
</span>
25-
</span>
26-
</x-rapidez::input.checkbox>
27-
</template>
28-
</div>
29-
</x-slot:content>
30-
</x-rapidez::accordion.filter>
28+
</x-rapidez::input.checkbox>
29+
</template>
30+
</div>
31+
</x-slot:content>
32+
</x-rapidez::accordion.filter>
33+
</div>
3134
</template>
3235
</ais-refinement-list>

‎tests/playwright/category.spec.js-snapshots/category-filter-1-Mobile-Chrome-linux.png‎

Lines changed: 2 additions & 2 deletions
Loading

‎tests/playwright/category.spec.js-snapshots/category-filter-1-Mobile-Safari-linux.png‎

Lines changed: 2 additions & 2 deletions
Loading

‎tests/playwright/category.spec.js-snapshots/category-filter-1-chromium-linux.png‎

Lines changed: 2 additions & 2 deletions
Loading

‎tests/playwright/category.spec.js-snapshots/category-filter-1-firefox-linux.png‎

Lines changed: 2 additions & 2 deletions
Loading

‎tests/playwright/category.spec.js-snapshots/category-filter-1-webkit-linux.png‎

Lines changed: 2 additions & 2 deletions
Loading

‎tests/playwright/category.spec.js-snapshots/category-pagination-1-chromium-linux.png‎

Lines changed: 2 additions & 2 deletions
Loading

‎tests/playwright/category.spec.js-snapshots/category-pagination-1-firefox-linux.png‎

Lines changed: 2 additions & 2 deletions
Loading

0 commit comments

Comments
 (0)