fix: remove overflow-hidden from header, add mx-auto wrapper like logistics
All checks were successful
Build Docker Image / build (push) Successful in 6m25s
All checks were successful
Build Docker Image / build (push) Successful in 6m25s
This commit is contained in:
@@ -1,14 +1,14 @@
|
|||||||
<template>
|
<template>
|
||||||
<header
|
<header
|
||||||
class="relative overflow-hidden"
|
class="relative"
|
||||||
:style="{ height: `${height}px` }"
|
:style="{ height: `${height}px` }"
|
||||||
>
|
>
|
||||||
<!-- Single row: Logo + Search + Icons -->
|
<div class="relative mx-auto max-w-[2200px] px-3 py-2 md:px-4">
|
||||||
<div
|
<div
|
||||||
class="relative z-10 flex px-3 lg:px-4 gap-2"
|
class="flex items-center gap-2"
|
||||||
:class="isHeroLayout ? 'items-start pt-2' : 'items-center'"
|
:class="isHeroLayout ? 'items-start' : ''"
|
||||||
:style="rowStyle"
|
:style="rowStyle"
|
||||||
>
|
>
|
||||||
<!-- Left: Logo + AI button + Nav links (top aligned) -->
|
<!-- Left: Logo + AI button + Nav links (top aligned) -->
|
||||||
<div class="flex items-center flex-shrink-0 rounded-full pill-glass">
|
<div class="flex items-center flex-shrink-0 rounded-full pill-glass">
|
||||||
<div class="flex items-center gap-2 px-4 py-2">
|
<div class="flex items-center gap-2 px-4 py-2">
|
||||||
@@ -355,6 +355,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
</header>
|
</header>
|
||||||
</template>
|
</template>
|
||||||
@@ -523,13 +524,6 @@ const rowStyle = computed(() => {
|
|||||||
return { height: `${props.height}px` }
|
return { height: `${props.height}px` }
|
||||||
})
|
})
|
||||||
|
|
||||||
const glassStyle = computed(() => {
|
|
||||||
if (isHeroLayout.value) {
|
|
||||||
return { height: `${topRowHeight}px` }
|
|
||||||
}
|
|
||||||
return { height: '100%' }
|
|
||||||
})
|
|
||||||
|
|
||||||
const centerStyle = computed(() => {
|
const centerStyle = computed(() => {
|
||||||
if (!isHeroLayout.value) return {}
|
if (!isHeroLayout.value) return {}
|
||||||
const heroHeight = props.height || topRowHeight
|
const heroHeight = props.height || topRowHeight
|
||||||
@@ -540,9 +534,6 @@ const centerStyle = computed(() => {
|
|||||||
return { marginTop: `${top}px` }
|
return { marginTop: `${top}px` }
|
||||||
})
|
})
|
||||||
|
|
||||||
// Header background classes — two-layer glass is handled by .header-glass + .header-glass-backdrop
|
|
||||||
const headerClasses = computed(() => '')
|
|
||||||
|
|
||||||
// Use white text on dark backgrounds (collapsed or home page with animation)
|
// Use white text on dark backgrounds (collapsed or home page with animation)
|
||||||
const useWhiteText = computed(() => props.isCollapsed || props.isHomePage)
|
const useWhiteText = computed(() => props.isCollapsed || props.isHomePage)
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
Reference in New Issue
Block a user