Skip to content

Commit cb4414e

Browse files
committed
fix(float-window): align activity banner bar and collapse affordance
Use a fixed h-8 bar for the collapsed “Latest” control and expanded header. Replace the minimise control icon with ChevronDown (collapse) and expand with ChevronUp on the teaser. Tighten chevron sizing and add shrink-0 on header icons so layout stays stable.
1 parent 58b68ce commit cb4414e

1 file changed

Lines changed: 6 additions & 6 deletions

File tree

app/components/float-window/FloatWindow.tsx

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import { usePathname } from "next/navigation";
55
import { motion, AnimatePresence } from "motion/react";
66
import type { HomepageEvent } from "@/lib/events-fetch";
77
import { cn } from "@/lib/utils";
8-
import { X, ChevronUp, ExternalLink, Play } from "lucide-react";
8+
import { X, ChevronDown, ChevronUp, ExternalLink, Play } from "lucide-react";
99
import styles from "./FloatWindow.module.css";
1010

1111
/**
@@ -63,7 +63,7 @@ export function FloatWindow({ event }: FloatWindowProps) {
6363
exit={{ opacity: 0 }}
6464
onClick={handleToggle}
6565
className={cn(
66-
"group flex items-center gap-2 px-4 py-2",
66+
"group flex h-8 items-center gap-2 px-4",
6767
// Newsprint 风格:锐利边角,纯黑实线边框
6868
"bg-[#111111] text-[#F9F9F7] border border-[#111111]",
6969
"hover:bg-[#F9F9F7] hover:text-[#111111]", // 悬停时反色
@@ -74,7 +74,7 @@ export function FloatWindow({ event }: FloatWindowProps) {
7474
>
7575
<span className="w-2 h-2 bg-[#CC0000] animate-pulse" />
7676
<span className="font-bold">Latest</span>
77-
<ChevronUp className="w-4 h-4 rotate-180 group-hover:-translate-y-0.5 transition-transform" />
77+
<ChevronUp className="w-3.5 h-3.5 shrink-0 group-hover:-translate-y-0.5 transition-transform" />
7878
</motion.button>
7979
) : (
8080
/* 展开状态 - 报纸卡片 */
@@ -91,7 +91,7 @@ export function FloatWindow({ event }: FloatWindowProps) {
9191
)}
9292
>
9393
{/* Header Bar */}
94-
<div className="flex items-center justify-between px-3 py-2 border-b border-[#111111] dark:border-[#F9F9F7] bg-[#111111] dark:bg-[#F9F9F7]">
94+
<div className="flex h-8 items-center justify-between px-3 border-b border-[#111111] dark:border-[#F9F9F7] bg-[#111111] dark:bg-[#F9F9F7]">
9595
<span className="font-mono text-[10px] uppercase tracking-widest font-bold text-[#F9F9F7] dark:text-[#111111]">
9696
The Daily Feed
9797
</span>
@@ -102,15 +102,15 @@ export function FloatWindow({ event }: FloatWindowProps) {
102102
className="text-[#F9F9F7] dark:text-[#111111] hover:text-[#CC0000] transition-colors"
103103
aria-label="Minimize"
104104
>
105-
<ChevronUp className="w-3.5 h-3.5" />
105+
<ChevronDown className="w-3.5 h-3.5 shrink-0" />
106106
</button>
107107
<button
108108
onClick={handleDismiss}
109109
onPointerDown={(e) => e.stopPropagation()}
110110
className="text-[#F9F9F7] dark:text-[#111111] hover:text-[#CC0000] transition-colors"
111111
aria-label="Close"
112112
>
113-
<X className="w-3.5 h-3.5" />
113+
<X className="w-3.5 h-3.5 shrink-0" />
114114
</button>
115115
</div>
116116
</div>

0 commit comments

Comments
 (0)