Mina Choi
db07a60cfa
- 채팅 링크로 바로 진입하면 세션이 협상생성(1)에 머물러 오프닝 메시지가 seed 되지 않던 문제: chat init/messages 에서 participate 와 동일하게 협상중(2)으로 전이(마감 견적·마감시간 초과는 제외) - 부가정보 저장이 1301 로 실패하던 문제: '협상완료' 요약은 chat_end=false 라 세션이 아직 협상중이므로, 마지막 말풍선이 summaryRSP/CM 이면 협상중 세션도 저장 허용 - 채팅 언마운트 시 messages 캐시도 제거 — staleTime:Infinity 라 빈 목록이 남아 재진입해도 빈 화면이던 문제 - 채팅 스크롤을 컨테이너 기준 scrollTo 로 변경(rAF 후 실행) — 요약·폼이 뒤늦게 레이아웃되면 중간에 멈추던 문제 - 모바일 채팅 상단 여백 제거(pt-[64px] 는 우측 협상절차 카드가 있는 lg 이상만) - 노치 대응: viewport-fit=cover + safe-t/b/x 유틸 신설, 헤더·하단 액션 덱·드로어·랜딩 헤더에 적용, h-screen→100dvh
52 lines
1.7 KiB
TypeScript
52 lines
1.7 KiB
TypeScript
import { useEffect, useState } from "react"
|
|
import { ArrowUpRight } from "lucide-react"
|
|
|
|
import { Button } from "@/components/ui/button"
|
|
import { Logo } from "@/components/ui/logo"
|
|
|
|
export function Header() {
|
|
const [scrolled, setScrolled] = useState(false)
|
|
|
|
// 스크롤 시 헤더를 반투명 블러 배경으로 전환
|
|
useEffect(() => {
|
|
const handleScroll = () => setScrolled(window.scrollY > 40)
|
|
window.addEventListener("scroll", handleScroll, { passive: true })
|
|
handleScroll()
|
|
return () => window.removeEventListener("scroll", handleScroll)
|
|
}, [])
|
|
|
|
return (
|
|
<header
|
|
className={`fixed top-0 left-0 right-0 z-40 safe-t safe-x transition-all duration-300 ${
|
|
scrolled ? "py-4 bg-white/80 backdrop-blur-xl border-b border-line" : "py-6 bg-transparent border-b border-transparent"
|
|
}`}
|
|
>
|
|
<div className="max-w-5xl mx-auto px-6 flex items-center justify-between">
|
|
<a href="#">
|
|
<Logo />
|
|
</a>
|
|
|
|
<nav className="hidden md:flex items-center gap-8 text-[15px] font-semibold text-ink-soft">
|
|
{NAV_LINKS.map(({ href, label }) => (
|
|
<a key={href} href={href} className="hover:text-ink transition-colors">
|
|
{label}
|
|
</a>
|
|
))}
|
|
</nav>
|
|
|
|
<Button href="#contact-section" size="pill" className="gap-1.5">
|
|
<span>상담 신청</span>
|
|
<ArrowUpRight className="w-4 h-4" />
|
|
</Button>
|
|
</div>
|
|
</header>
|
|
)
|
|
}
|
|
|
|
const NAV_LINKS = [
|
|
{ href: "#how-it-works", label: "협상 데모" },
|
|
{ href: "#how-it-works-demo", label: "이용 가이드" },
|
|
{ href: "#comparison", label: "도입 전후 비교" },
|
|
{ href: "#faq", label: "자주 묻는 질문" },
|
|
]
|