Soften glass gradient and round capsules
All checks were successful
Build Docker Image / build (push) Successful in 4m57s

This commit is contained in:
Ruslan Bakiev
2026-02-06 16:09:00 +07:00
parent ca7c6fa8a5
commit 981500ec5d

View File

@@ -1,14 +1,14 @@
<template> <template>
<header <header
class="shadow-lg relative overflow-hidden" class="relative overflow-hidden"
:class="headerClasses" :class="headerClasses"
:style="{ height: `${height}px` }" :style="{ height: `${height}px` }"
> >
<div class="absolute inset-0 pointer-events-none bg-gradient-to-b from-white/35 via-white/15 to-transparent" /> <div class="absolute inset-0 pointer-events-none bg-gradient-to-b from-white/45 via-white/20 to-transparent" />
<!-- Single row: Logo + Search + Icons --> <!-- Single row: Logo + Search + Icons -->
<div class="relative z-10 flex items-center h-full px-4 lg:px-6 gap-4"> <div class="relative z-10 flex items-center h-full px-4 lg:px-6 gap-4">
<!-- Left: Logo + Nav links (top aligned) --> <!-- Left: Logo + Nav links (top aligned) -->
<div class="flex items-center gap-6 flex-shrink-0 px-4 py-3 rounded-2xl border border-white/20 bg-white/15 backdrop-blur-md shadow-lg"> <div class="flex items-center gap-6 flex-shrink-0 px-5 py-3 rounded-full border border-white/15 bg-white/12 backdrop-blur-md">
<NuxtLink :to="localePath('/')" class="flex items-center gap-2"> <NuxtLink :to="localePath('/')" class="flex items-center gap-2">
<span class="font-bold text-xl" :class="useWhiteText ? 'text-white' : 'text-base-content'">Optovia</span> <span class="font-bold text-xl" :class="useWhiteText ? 'text-white' : 'text-base-content'">Optovia</span>
</NuxtLink> </NuxtLink>
@@ -84,7 +84,7 @@
<!-- Client Area tabs --> <!-- Client Area tabs -->
<template v-if="isClientArea"> <template v-if="isClientArea">
<div class="flex items-center gap-1 rounded-full border border-white/35 bg-white/75 backdrop-blur-md shadow-lg p-1"> <div class="flex items-center gap-1 rounded-full border border-white/35 bg-white/70 backdrop-blur-md p-1">
<!-- BUYER tabs --> <!-- BUYER tabs -->
<template v-if="currentRole !== 'SELLER'"> <template v-if="currentRole !== 'SELLER'">
<NuxtLink <NuxtLink
@@ -118,7 +118,7 @@
<!-- Quote mode: Simple segmented input with search inside (white glass) --> <!-- Quote mode: Simple segmented input with search inside (white glass) -->
<template v-else-if="catalogMode === 'quote'"> <template v-else-if="catalogMode === 'quote'">
<div class="flex items-center w-full rounded-full border border-white/50 bg-white/85 backdrop-blur-md shadow-lg divide-x divide-base-300/30"> <div class="flex items-center w-full rounded-full border border-white/45 bg-white/55 backdrop-blur-md divide-x divide-base-300/30">
<!-- Product segment --> <!-- Product segment -->
<button <button
class="flex-1 px-4 py-2 text-left hover:bg-base-200/50 rounded-l-full transition-colors min-w-0" class="flex-1 px-4 py-2 text-left hover:bg-base-200/50 rounded-l-full transition-colors min-w-0"
@@ -167,7 +167,7 @@
<template v-else> <template v-else>
<!-- Big pill input --> <!-- Big pill input -->
<div <div
class="flex items-center gap-3 w-full px-5 py-3 rounded-full border border-white/50 bg-white/85 backdrop-blur-md shadow-lg focus-within:border-primary focus-within:ring-2 focus-within:ring-primary/20 transition-all cursor-text" class="flex items-center gap-3 w-full px-5 py-3 rounded-full border border-white/45 bg-white/55 backdrop-blur-md focus-within:border-primary focus-within:ring-2 focus-within:ring-primary/20 transition-all cursor-text"
@click="focusInput" @click="focusInput"
> >
<Icon name="lucide:search" size="22" class="text-primary flex-shrink-0" /> <Icon name="lucide:search" size="22" class="text-primary flex-shrink-0" />
@@ -212,7 +212,7 @@
</div> </div>
<!-- Right: AI + Globe + Team + User (top aligned like logo) --> <!-- Right: AI + Globe + Team + User (top aligned like logo) -->
<div class="flex items-center gap-1 flex-shrink-0 px-3 py-2 rounded-2xl border border-white/20 bg-white/15 backdrop-blur-md shadow-lg"> <div class="flex items-center gap-1 flex-shrink-0 px-4 py-2 rounded-full border border-white/15 bg-white/12 backdrop-blur-md">
<!-- AI Assistant button --> <!-- AI Assistant button -->
<NuxtLink <NuxtLink
:to="localePath('/clientarea/ai')" :to="localePath('/clientarea/ai')"