mirror of
https://github.com/SECTL/SecScore.git
synced 2026-07-21 18:19:03 +08:00
优化竖屏导航展开样式与左上角收起按钮
This commit is contained in:
@@ -100,6 +100,7 @@ export function ContentArea({
|
|||||||
: t("permissions.view")}
|
: t("permissions.view")}
|
||||||
</Tag>
|
</Tag>
|
||||||
)
|
)
|
||||||
|
const useFloatingSidebarToggle = floatingExpand && sidebarCollapsed
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Layout
|
<Layout
|
||||||
@@ -128,14 +129,20 @@ export function ContentArea({
|
|||||||
<div
|
<div
|
||||||
style={
|
style={
|
||||||
{
|
{
|
||||||
paddingLeft: "8px",
|
paddingLeft: useFloatingSidebarToggle ? 0 : "8px",
|
||||||
display: "flex",
|
display: "flex",
|
||||||
alignItems: "center",
|
alignItems: "center",
|
||||||
height: "100%",
|
height: useFloatingSidebarToggle ? "auto" : "100%",
|
||||||
WebkitAppRegion: "no-drag",
|
WebkitAppRegion: "no-drag",
|
||||||
flexShrink: 0,
|
flexShrink: 0,
|
||||||
position: "relative",
|
position: useFloatingSidebarToggle ? "fixed" : "relative",
|
||||||
zIndex: floatingExpand && sidebarCollapsed && floatingExpanded ? 1301 : 1,
|
left: useFloatingSidebarToggle ? "8px" : undefined,
|
||||||
|
top: useFloatingSidebarToggle ? "4px" : undefined,
|
||||||
|
zIndex: useFloatingSidebarToggle
|
||||||
|
? 1402
|
||||||
|
: floatingExpand && sidebarCollapsed && floatingExpanded
|
||||||
|
? 1301
|
||||||
|
: 1,
|
||||||
} as React.CSSProperties
|
} as React.CSSProperties
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
|
|||||||
@@ -194,6 +194,7 @@ export function Sidebar({
|
|||||||
|
|
||||||
const renderSidebarBody = (isCollapsedView: boolean, hideMenu = false) => (
|
const renderSidebarBody = (isCollapsedView: boolean, hideMenu = false) => (
|
||||||
<>
|
<>
|
||||||
|
{!(isCollapsedView && floatingExpand && collapsed) && (
|
||||||
<div
|
<div
|
||||||
data-tauri-drag-region
|
data-tauri-drag-region
|
||||||
style={
|
style={
|
||||||
@@ -239,6 +240,7 @@ export function Sidebar({
|
|||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
{!hideMenu && (
|
{!hideMenu && (
|
||||||
<div style={{ flex: 1, overflowY: "auto", display: "flex", flexDirection: "column" }}>
|
<div style={{ flex: 1, overflowY: "auto", display: "flex", flexDirection: "column" }}>
|
||||||
@@ -352,7 +354,10 @@ export function Sidebar({
|
|||||||
top: 0,
|
top: 0,
|
||||||
bottom: 0,
|
bottom: 0,
|
||||||
width: "200px",
|
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)",
|
borderRight: "1px solid var(--ss-border-color)",
|
||||||
boxShadow: "6px 0 18px rgba(0, 0, 0, 0.12)",
|
boxShadow: "6px 0 18px rgba(0, 0, 0, 0.12)",
|
||||||
zIndex: 1200,
|
zIndex: 1200,
|
||||||
|
|||||||
Reference in New Issue
Block a user