优化竖屏导航展开样式与左上角收起按钮

This commit is contained in:
JSR
2026-03-18 22:06:43 +08:00
parent f2985c2b83
commit c10a719438
2 changed files with 62 additions and 50 deletions
+11 -4
View File
@@ -100,6 +100,7 @@ export function ContentArea({
: t("permissions.view")}
</Tag>
)
const useFloatingSidebarToggle = floatingExpand && sidebarCollapsed
return (
<Layout
@@ -128,14 +129,20 @@ export function ContentArea({
<div
style={
{
paddingLeft: "8px",
paddingLeft: useFloatingSidebarToggle ? 0 : "8px",
display: "flex",
alignItems: "center",
height: "100%",
height: useFloatingSidebarToggle ? "auto" : "100%",
WebkitAppRegion: "no-drag",
flexShrink: 0,
position: "relative",
zIndex: floatingExpand && sidebarCollapsed && floatingExpanded ? 1301 : 1,
position: useFloatingSidebarToggle ? "fixed" : "relative",
left: useFloatingSidebarToggle ? "8px" : undefined,
top: useFloatingSidebarToggle ? "4px" : undefined,
zIndex: useFloatingSidebarToggle
? 1402
: floatingExpand && sidebarCollapsed && floatingExpanded
? 1301
: 1,
} as React.CSSProperties
}
>
+6 -1
View File
@@ -194,6 +194,7 @@ export function Sidebar({
const renderSidebarBody = (isCollapsedView: boolean, hideMenu = false) => (
<>
{!(isCollapsedView && floatingExpand && collapsed) && (
<div
data-tauri-drag-region
style={
@@ -239,6 +240,7 @@ export function Sidebar({
</>
)}
</div>
)}
{!hideMenu && (
<div style={{ flex: 1, overflowY: "auto", display: "flex", flexDirection: "column" }}>
@@ -352,7 +354,10 @@ export function Sidebar({
top: 0,
bottom: 0,
width: "200px",
background: "var(--ss-sidebar-bg)",
background:
"linear-gradient(0deg, rgba(250, 250, 250, 0.72), rgba(250, 250, 250, 0.72)), var(--ss-sidebar-bg)",
backdropFilter: "blur(14px)",
WebkitBackdropFilter: "blur(14px)",
borderRight: "1px solid var(--ss-border-color)",
boxShadow: "6px 0 18px rgba(0, 0, 0, 0.12)",
zIndex: 1200,