diff --git a/src/lib/components/collection/CollectionFilters.svelte b/src/lib/components/collection/CollectionFilters.svelte index e04b6279..0b2faa19 100644 --- a/src/lib/components/collection/CollectionFilters.svelte +++ b/src/lib/components/collection/CollectionFilters.svelte @@ -359,19 +359,13 @@ ]) // Active filters based on visibility settings - const activeFilters = $derived( - filterConfigs.filter((f) => effectiveShowFilters[f.key]) - ) + const activeFilters = $derived(filterConfigs.filter((f) => effectiveShowFilters[f.key])) // Filters visible in the main row (not in moreFilterKeys) - const visibleFilters = $derived( - activeFilters.filter((f) => !moreFilterKeys.includes(f.key)) - ) + const visibleFilters = $derived(activeFilters.filter((f) => !moreFilterKeys.includes(f.key))) // Filters in the "More" dropdown - const moreFilters = $derived( - activeFilters.filter((f) => moreFilterKeys.includes(f.key)) - ) + const moreFilters = $derived(activeFilters.filter((f) => moreFilterKeys.includes(f.key))) const showMoreButton = $derived(moreFilters.length > 0) @@ -406,7 +400,12 @@ - + {#each moreFilters as filter (filter.key)} @@ -461,7 +460,12 @@ {/if} {#if showViewToggle} - + {/if} @@ -539,9 +543,11 @@ color: var(--text-tertiary); background-color: var(--input-bg); border-radius: $input-corner; - border: 1px solid var(--border-color, transparent); + border: 1px solid transparent; cursor: pointer; - transition: background-color 0.15s ease, border-color 0.15s ease; + transition: + background-color 0.15s ease, + border-color 0.15s ease; &:hover { background-color: var(--input-bg-hover); diff --git a/src/lib/components/ui/MultiSelect.svelte b/src/lib/components/ui/MultiSelect.svelte index b45aac7c..22a8f09a 100644 --- a/src/lib/components/ui/MultiSelect.svelte +++ b/src/lib/components/ui/MultiSelect.svelte @@ -127,7 +127,7 @@ align-items: center; background-color: var(--input-bg); border-radius: $input-corner; - border: 1px solid var(--border-color, transparent); + border: 1px solid transparent; color: var(--text-primary); cursor: pointer; display: inline-flex; diff --git a/src/lib/components/ui/Select.svelte b/src/lib/components/ui/Select.svelte index 58c77011..c5191ad0 100644 --- a/src/lib/components/ui/Select.svelte +++ b/src/lib/components/ui/Select.svelte @@ -323,7 +323,7 @@ align-items: center; background-color: var(--input-bg); border-radius: $input-corner; - border: 1px solid var(--border-color, transparent); + border: 1px solid transparent; color: var(--text-primary); cursor: pointer; display: inline-flex;