fix: eliminate layout shift in recipe search by reserving filter panel space

Changed FilterPanel from conditional rendering to always-rendered with visibility control. This prevents layout shift when JavaScript loads by reserving the space upfront while keeping it visually hidden for non-JS users.
This commit is contained in:
2026-01-05 23:19:39 +01:00
parent 5f5b1e828f
commit 8a5deeedac
+2 -2
View File
@@ -345,7 +345,7 @@ scale: 0.8 0.8;
</button>
</form>
{#if showFilters}
<div style="visibility: {showFilters ? 'visible' : 'hidden'}; pointer-events: {showFilters ? 'auto' : 'none'};">
<FilterPanel
availableCategories={categories}
{availableTags}
@@ -363,4 +363,4 @@ scale: 0.8 0.8;
onSeasonChange={handleSeasonChange}
onFavoritesToggle={handleFavoritesToggle}
/>
{/if}
</div>