From 8b435b48448b1a290488e59aabe6180302d355a4 Mon Sep 17 00:00:00 2001
From: baiqing <lbx12309@icloud.com>
Date: Mon, 4 May 2026 18:19:22 +0800
Subject: [PATCH] =?UTF-8?q?fix(overview):=20=E5=BA=95=E9=83=A8=E8=A1=8C=20?=
 =?UTF-8?q?flex:1=20+=20=E4=BB=85=E6=9C=80=E8=BF=91=E8=AF=86=E5=88=AB?=
 =?UTF-8?q?=E5=8C=BA=E5=9F=9F=E6=BB=9A=E5=8A=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

#243 第一版给外层 wrapper 加了 overflow:hidden 让概览不滚，但底部「近 7 天 +
最近识别」grid 仍按自然高度展开 → 内容超出 wrapper 时被硬裁，看不到底部
圆角；最近识别第 5 行只露半截。

修法（Overview.tsx 底部 grid）：
- grid 自身 flex:1, minHeight:0，撑满父 flex:column 的剩余高度
- 两张 Card 都加 display:flex/column + minHeight:0；最近识别 Card 还加
  overflow:hidden，让内层行严格剪裁到 Card 的圆角
- 最近识别的 list <div> 加 .ol-thinscroll + flex:1 + overflow:auto，自己
  独立滚动；其他区域按需求保持不滚

视觉效果：底部圆角现在完整显示并与上方 metrics / providers 对齐；只有最
近识别区域出现细滚动条，整体仍是 dashboard「一眼看完」节奏。
---
 openless-all/app/src/pages/Overview.tsx | 13 ++++++++-----
 1 file changed, 8 insertions(+), 5 deletions(-)

diff --git a/openless-all/app/src/pages/Overview.tsx b/openless-all/app/src/pages/Overview.tsx
index 32ac32f0..98794751 100644
--- a/openless-all/app/src/pages/Overview.tsx
+++ b/openless-all/app/src/pages/Overview.tsx
@@ -94,8 +94,11 @@ export function Overview({ onOpenHistory }: OverviewProps) {
         <Metric icon="bolt" label={t('overview.metricTotal')} value={String(history.length)} trend={t('overview.metricTotalTrend')} accent />
       </div>
 
-      <div style={{ display: 'grid', gridTemplateColumns: '1fr 1.4fr', gap: 12 }}>
-        <Card padding={18}>
+      {/* 底部一行 = flex:1 撑满剩余高度（父 wrapper 是 display:flex/column）。
+          只有「最近识别」内部允许滚动；其他卡片按内容自然高度，不破裂底部圆角。
+          issue #243 follow-up：去掉外层 overflow 后底部圆角被裁的视觉问题。 */}
+      <div style={{ display: 'grid', gridTemplateColumns: '1fr 1.4fr', gap: 12, flex: 1, minHeight: 0 }}>
+        <Card padding={18} style={{ display: 'flex', flexDirection: 'column', minHeight: 0 }}>
           <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', marginBottom: 14 }}>
             <span style={{ fontSize: 12, fontWeight: 600, color: 'var(--ol-ink-2)' }}>{t('overview.weekTitle')}</span>
             <span style={{ fontSize: 11, color: 'var(--ol-ink-4)' }}>{t('overview.weekUnit')}</span>
@@ -106,12 +109,12 @@ export function Overview({ onOpenHistory }: OverviewProps) {
           </div>
         </Card>
 
-        <Card padding={0}>
-          <div style={{ padding: '14px 18px', borderBottom: '0.5px solid var(--ol-line)', display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
+        <Card padding={0} style={{ display: 'flex', flexDirection: 'column', minHeight: 0, overflow: 'hidden' }}>
+          <div style={{ padding: '14px 18px', borderBottom: '0.5px solid var(--ol-line)', display: 'flex', alignItems: 'center', justifyContent: 'space-between', flexShrink: 0 }}>
             <span style={{ fontSize: 12, fontWeight: 600, color: 'var(--ol-ink-2)' }}>{t('overview.recentTitle')}</span>
             <Btn size="sm" variant="ghost" onClick={onOpenHistory}>{t('overview.recentAll')}</Btn>
           </div>
-          <div>
+          <div className="ol-thinscroll" style={{ flex: 1, minHeight: 0, overflow: 'auto' }}>
             {history.length === 0 && (
               <div style={{ padding: 24, textAlign: 'center', fontSize: 12, color: 'var(--ol-ink-4)' }}>
                 {t('overview.recentEmpty', { trigger: getHotkeyTriggerLabel(hotkey?.trigger) })}