fix: collection filter background color

This commit is contained in:
Justin Edmund 2025-12-19 16:40:01 -08:00
parent 66c8094346
commit 306ae711ab
2 changed files with 12 additions and 5 deletions

View file

@ -48,6 +48,8 @@
element?: string element?: string
/** Use neutral gray styling for view toggle */ /** Use neutral gray styling for view toggle */
neutralViewToggle?: boolean neutralViewToggle?: boolean
/** Whether to show contained background styling (default: true) */
contained?: boolean
} }
export interface CollectionFilterState { export interface CollectionFilterState {
@ -110,7 +112,8 @@
onViewModeChange, onViewModeChange,
showViewToggle = false, showViewToggle = false,
element, element,
neutralViewToggle = false neutralViewToggle = false,
contained = true
}: Props = $props() }: Props = $props()
// Compute effective filter visibility (explicit showFilters overrides entityType defaults) // Compute effective filter visibility (explicit showFilters overrides entityType defaults)
@ -287,7 +290,7 @@
) )
</script> </script>
<div class="filters-container"> <div class="filters-container" class:contained>
<div class="filters"> <div class="filters">
{#if effectiveShowFilters.element} {#if effectiveShowFilters.element}
<MultiSelect <MultiSelect
@ -393,10 +396,13 @@
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
gap: $unit-2x; gap: $unit-2x;
padding: $unit;
background: var(--button-contained-bg);
border-radius: $card-corner;
width: 100%; width: 100%;
&.contained {
padding: $unit;
background: var(--button-contained-bg);
border-radius: $card-corner;
}
} }
.filters { .filters {

View file

@ -233,6 +233,7 @@
bind:seasonFilters bind:seasonFilters
onFiltersChange={handleFiltersChange} onFiltersChange={handleFiltersChange}
showSort={false} showSort={false}
contained={false}
/> />
<div class="controls-right"> <div class="controls-right">