optovia/webapp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Move expand button from separate bar to SearchBar area
All checks were successful
Build Docker Image / build (push) Successful in 4m4s
Details

Browse Source
This commit is contained in:
Ruslan Bakiev
2026-01-15 11:55:41 +07:00
parent 46b1a17a23
commit ea7c0b460a
3 changed files with 16 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
app/components/page/CatalogPage.vue
View File

@@ -14,7 +14,20 @@
<template v-else>
<!-- Search bar slot (sticky third bar - like navigation) -->
<div v-if="$slots.searchBar" class="sticky z-20 -mx-3 lg:-mx-6 px-3 lg:px-6 pt-4 pb-2 bg-base-100 border-b border-base-300" :style="searchBarStyle">
<slot name="searchBar" :displayed-count="displayItems.length" :total-count="totalCount" />
<div class="flex items-center gap-2">
<!-- Expand button - appears when header collapsed -->
<button
v-if="isCollapsed"
class="btn btn-ghost btn-sm gap-1 flex-shrink-0"
@click="expand"
>
<span class="font-bold text-primary text-lg">O</span>
<Icon name="lucide:chevron-up" size="14" />
</button>
<div class="flex-1">
<slot name="searchBar" :displayed-count="displayItems.length" :total-count="totalCount" />
</div>
</div>
</div>
<!-- With Map: Split Layout -->
@@ -215,7 +228,7 @@ const props = withDefaults(defineProps<{
// Smooth scroll collapse - pixel values for smooth animation
// MainNav: 64px, SubNav: 54px, Header total: 118px, SearchBar: 56px
const { searchBarTop, mapTop } = useScrollCollapse(118, 56)
const { searchBarTop, mapTop, isCollapsed, expand } = useScrollCollapse(118, 56)
const slots = useSlots()
const hasSearchBar = computed(() => !!slots.searchBar)