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

fix: stabilize quote flow header and step cards

Browse Source
This commit is contained in:
Ruslan Bakiev
2026-03-12 18:12:40 +07:00
parent a962d04ed1
commit ab3fee82f4
4 changed files with 11 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
app/components/navigation/MainNavigation.vue
View File

@@ -34,7 +34,7 @@
<nav class="flex items-center gap-1">
<button
class="px-3 py-1 text-sm font-medium rounded-full transition-colors"
:class="showActiveMode && catalogMode === 'explore' && !isClientArea
:class="showActiveMode && isExploreModeActive && !isClientArea
? (useWhiteText ? 'bg-white/20 text-white' : 'bg-base-300 text-base-content')
: (useWhiteText ? 'text-white/70 hover:text-white hover:bg-white/10' : 'text-base-content/70 hover:text-base-content hover:bg-base-200')"
@click="$emit('set-catalog-mode', 'explore')"
@@ -44,7 +44,7 @@
<NuxtLink
:to="localePath('/catalog/product')"
class="px-3 py-1 text-sm font-medium rounded-full transition-colors"
:class="isQuoteStepPage
:class="isQuoteModeActive
? (useWhiteText ? 'bg-white/20 text-white' : 'bg-base-300 text-base-content')
: (useWhiteText ? 'text-white/70 hover:text-white hover:bg-white/10' : 'text-base-content/70 hover:text-base-content hover:bg-base-200')"
>
@@ -134,7 +134,7 @@
</template>
<!-- Quote mode: Step-based capsule navigation (like logistics) -->
<template v-else-if="catalogMode === 'quote'">
<template v-else-if="isQuoteModeActive">
<div
class="flex items-center rounded-full pill-glass overflow-hidden"
:class="searchCapsuleClass"
@@ -456,6 +456,8 @@ const isQuoteStepPage = computed(() => {
path.includes('/catalog/quantity') ||
path.includes('/catalog/results')
})
const isQuoteModeActive = computed(() => isQuoteStepPage.value || props.catalogMode === 'quote')
const isExploreModeActive = computed(() => !isQuoteStepPage.value && props.catalogMode === 'explore')
// Navigate to search results (quote mode step flow)
const navigateToSearch = () => {