style(个人主页): 页眉复用桌面标准样式+退出按钮直接退出
- 身份条复用桌面Header: 56px高/glass-bg-strong毛玻璃/blur(18px)/glass-ring底边 - 页面背景复用桌面应用: #f7f7f7 + 顶部四色径向渐变光晕 - 退出按钮忽略iframe内部任何历史状态,浏览器直接replace回首页
This commit is contained in:
@@ -1,6 +1,6 @@
|
||||
.page {
|
||||
/* 应用式全屏覆盖层:像 /apps/:appId 内联页一样覆盖外层布局(MainLayout 侧边栏),
|
||||
OS 窗口内则填满窗口内容区。 */
|
||||
OS 窗口内则填满窗口内容区。背景复用桌面应用标准(#f7f7f7 + 顶部渐变光晕) */
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
@@ -10,28 +10,44 @@
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: 0;
|
||||
background: #ffffff;
|
||||
background: var(--bg, #f7f7f7);
|
||||
|
||||
&::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
z-index: 0;
|
||||
pointer-events: none;
|
||||
background:
|
||||
radial-gradient(52% 40% at 18% 4%, rgba(255, 168, 205, 0.28), transparent 62%),
|
||||
radial-gradient(50% 38% at 82% 2%, rgba(150, 198, 255, 0.30), transparent 62%),
|
||||
radial-gradient(52% 38% at 50% 0%, rgba(205, 176, 255, 0.24), transparent 62%),
|
||||
radial-gradient(96% 40% at 50% 16%, rgba(255, 255, 255, 0.45), transparent 70%);
|
||||
}
|
||||
}
|
||||
|
||||
.center {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
/* ── 顶部固定身份条:毛玻璃(半透明白 + 模糊),与应用主背景一致 ── */
|
||||
/* ── 顶部固定身份条:复用桌面应用标准页眉样式(毛玻璃)── */
|
||||
.identityBar {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
padding: 14px 108px 14px 20px;
|
||||
min-height: 56px;
|
||||
padding: 0 100px 0 28px;
|
||||
flex-shrink: 0;
|
||||
background: rgba(255, 255, 255, 0.72);
|
||||
backdrop-filter: blur(20px) saturate(160%);
|
||||
-webkit-backdrop-filter: blur(20px) saturate(160%);
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.05);
|
||||
background: var(--glass-bg-strong, rgba(255, 255, 255, 0.6));
|
||||
backdrop-filter: blur(18px) saturate(160%);
|
||||
-webkit-backdrop-filter: blur(18px) saturate(160%);
|
||||
border-bottom: 1px solid var(--glass-ring, rgba(0, 0, 0, 0.1));
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
@@ -109,6 +125,7 @@
|
||||
flex: 1;
|
||||
min-height: 0;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.frame {
|
||||
@@ -303,8 +320,8 @@
|
||||
/* ── 右上角标准胶囊(更多 + 返回):浅色玻璃 + 蓝紫点缀 ── */
|
||||
.floatingCapsule {
|
||||
position: absolute;
|
||||
top: 14px;
|
||||
right: 18px;
|
||||
top: 12px;
|
||||
right: 20px;
|
||||
z-index: 1001;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
@@ -122,13 +122,12 @@ export default function UserHomePage() {
|
||||
}, [load]);
|
||||
|
||||
const handleClose = useCallback(() => {
|
||||
// OS 桌面(/os)→ 关闭本窗口;浏览器布局 → 返回上一页(应用式页面)。
|
||||
// 直接退出:OS 桌面关闭窗口;浏览器直接回首页,忽略 iframe 内部任何导航/历史状态。
|
||||
if (isOsPath(window.location.pathname)) {
|
||||
close(HOME_ROUTE_ID);
|
||||
return;
|
||||
}
|
||||
if (window.history.length > 1) window.history.back();
|
||||
else window.history.replaceState({}, "", "/");
|
||||
window.location.replace("/");
|
||||
}, [close]);
|
||||
|
||||
/** 打开编辑弹窗,回填当前页(仅本人;无页时按新建处理)。 */
|
||||
|
||||
Reference in New Issue
Block a user