Redesign header: single row with unified search block
All checks were successful
Build Docker Image / build (push) Successful in 3m6s
All checks were successful
Build Docker Image / build (push) Successful in 3m6s
- 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:
@@ -1,38 +1,5 @@
|
||||
<template>
|
||||
<Stack gap="12">
|
||||
<!-- Hero with search -->
|
||||
<Section variant="plain">
|
||||
<Stack gap="6" align="center">
|
||||
<Heading :level="1">{{ $t('searchPage.hero.title') }}</Heading>
|
||||
<Text tone="muted" align="center" class="max-w-lg">
|
||||
{{ $t('searchPage.hero.subtitle') }}
|
||||
</Text>
|
||||
<div class="flex flex-wrap justify-center gap-4 mt-4">
|
||||
<button
|
||||
class="btn btn-lg btn-primary gap-2"
|
||||
@click="startSelect('product')"
|
||||
>
|
||||
<Icon name="lucide:package" size="24" />
|
||||
{{ $t('catalog.filters.product') }}
|
||||
</button>
|
||||
<button
|
||||
class="btn btn-lg btn-outline gap-2"
|
||||
@click="startSelect('supplier')"
|
||||
>
|
||||
<Icon name="lucide:factory" size="24" />
|
||||
{{ $t('catalog.filters.supplier') }}
|
||||
</button>
|
||||
<button
|
||||
class="btn btn-lg btn-outline gap-2"
|
||||
@click="startSelect('hub')"
|
||||
>
|
||||
<Icon name="lucide:map-pin" size="24" />
|
||||
{{ $t('catalog.filters.hub') }}
|
||||
</button>
|
||||
</div>
|
||||
</Stack>
|
||||
</Section>
|
||||
|
||||
<!-- How it works -->
|
||||
<Section variant="plain">
|
||||
<Stack gap="6" align="center">
|
||||
@@ -123,6 +90,4 @@
|
||||
definePageMeta({
|
||||
layout: 'topnav'
|
||||
})
|
||||
|
||||
const { startSelect } = useCatalogSearch()
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user