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

Redesign header: single row with unified search block
All checks were successful
Build Docker Image / build (push) Successful in 3m6s
Details

Browse Source 
- Merge two rows into one: logo + search block + icons
- Search block now contains input and chips together
- Input is bigger with larger tokens
- Remove hero section from landing page
- Update padding to match new header height
This commit is contained in:
Ruslan Bakiev
2026-01-22 11:38:32 +07:00
parent 31f3c622eb
commit c468bd8679
3 changed files with 71 additions and 100 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
app/layouts/topnav.vue
View File

@@ -60,7 +60,7 @@ const {
} = useCatalogSearch()
// Collapsible header for catalog pages
const { headerOffset, isCollapsed } = useScrollCollapse(118)
const { headerOffset, isCollapsed } = useScrollCollapse(130)
// Theme state
const theme = useState<'cupcake' | 'night'>('theme', () => 'cupcake')
@@ -131,10 +131,10 @@ const headerStyle = computed(() => {
})
// Main content padding-top to compensate for fixed header
// 90px = MainNav with search (2 rows: top 56px + chips 34px)
// 144px = MainNav + SubNav (orders, seller, settings)
// 130px = MainNav with search block (input + chips in one block)
// 184px = MainNav + SubNav (orders, seller, settings)
const mainStyle = computed(() => ({
paddingTop: (isHomePage.value || isCatalogSection.value) ? '90px' : '144px'
paddingTop: (isHomePage.value || isCatalogSection.value) ? '130px' : '184px'
}))
// Provide collapsed state to child components (CatalogPage needs it for map positioning)