Skip to content

Commit 25df0ec

Browse files
committed
style(settings): 桌面端改为居中大弹窗,不铺满整屏
- 桌面端尺寸改为视口比例:92vw 宽、86vh 高(上限 1120px/760px), 四周保留背景与圆角,参考 Notion Explore plans 的弹窗观感 - 移动端仍全屏
1 parent 7483b05 commit 25df0ec

1 file changed

Lines changed: 4 additions & 3 deletions

File tree

packages/core/src/components/settings/SeetingDlg.tsx

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -322,9 +322,10 @@ export const SettingDlg: React.FC<PropsWithChildren> = ({ children }) => {
322322
// 覆盖 DialogContent 默认的 grid/gap/padding,改为 flex 列布局,
323323
// 让内部 body 拿到确定高度(否则 grid auto 行会按内容撑高,ScrollArea 失效)。
324324
"flex flex-col gap-0 overflow-hidden p-0",
325-
"h-[100dvh] max-w-full rounded-none border-0 pt-safe pb-safe",
326-
"md:h-[720px] md:max-w-[1080px] md:rounded-xl md:border",
327-
"lg:h-[760px] lg:max-w-[1240px]",
325+
// 移动端全屏;桌面端是「居中大弹窗」——按视口留白(92vw / 86vh),
326+
// 四周可见背景与圆角,不铺满整屏(参考 Notion Explore plans)。
327+
"h-[100dvh] w-full max-w-full rounded-none border-0 pt-safe pb-safe",
328+
"md:h-[86vh] md:max-h-[760px] md:w-[92vw] md:max-w-[1120px] md:rounded-xl md:border",
328329
)}
329330
>
330331
{isMobile ? MobileBody : DesktopBody}

0 commit comments

Comments
 (0)