fix: 修复“设置”侧栏双重展开的问题
This commit is contained in:
@@ -1086,7 +1086,15 @@ body {
|
|||||||
background: rgba(10, 10, 15, 0.5);
|
background: rgba(10, 10, 15, 0.5);
|
||||||
backdrop-filter: blur(4px);
|
backdrop-filter: blur(4px);
|
||||||
-webkit-backdrop-filter: blur(4px);
|
-webkit-backdrop-filter: blur(4px);
|
||||||
animation: fadeIn 0.25s var(--transition-smooth);
|
cursor: pointer;
|
||||||
|
opacity: 0;
|
||||||
|
pointer-events: none;
|
||||||
|
transition: opacity 0.25s var(--transition-smooth);
|
||||||
|
}
|
||||||
|
|
||||||
|
.drawer-overlay--visible {
|
||||||
|
opacity: 1;
|
||||||
|
pointer-events: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
.drawer {
|
.drawer {
|
||||||
@@ -1099,8 +1107,18 @@ body {
|
|||||||
border-left: 1px solid var(--color-border);
|
border-left: 1px solid var(--color-border);
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
animation: slideInRight 0.35s var(--transition-smooth);
|
|
||||||
box-shadow: -8px 0 40px rgba(10, 10, 15, 0.5);
|
box-shadow: -8px 0 40px rgba(10, 10, 15, 0.5);
|
||||||
|
transition: transform 0.35s var(--transition-smooth);
|
||||||
|
}
|
||||||
|
|
||||||
|
.drawer--collapsed {
|
||||||
|
transform: translateX(100%);
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.drawer--open {
|
||||||
|
transform: translateX(0);
|
||||||
|
pointer-events: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
.drawer__header {
|
.drawer__header {
|
||||||
@@ -1371,11 +1389,6 @@ body {
|
|||||||
to { opacity: 1; }
|
to { opacity: 1; }
|
||||||
}
|
}
|
||||||
|
|
||||||
@keyframes slideInRight {
|
|
||||||
from { transform: translateX(100%); }
|
|
||||||
to { transform: translateX(0); }
|
|
||||||
}
|
|
||||||
|
|
||||||
/* ---- Scrollbar ---- */
|
/* ---- Scrollbar ---- */
|
||||||
|
|
||||||
::-webkit-scrollbar {
|
::-webkit-scrollbar {
|
||||||
|
|||||||
@@ -323,12 +323,12 @@ function AppContent() {
|
|||||||
onRenameSession={renameSession}
|
onRenameSession={renameSession}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
{showConfig && (
|
|
||||||
<ConfigPanel
|
<ConfigPanel
|
||||||
config={config}
|
config={config}
|
||||||
theme={theme}
|
theme={theme}
|
||||||
username={user?.username}
|
username={user?.username}
|
||||||
allScenarios={allScenarios}
|
allScenarios={allScenarios}
|
||||||
|
open={showConfig}
|
||||||
onUpdate={updateConfig}
|
onUpdate={updateConfig}
|
||||||
onThemeChange={handleThemeChange}
|
onThemeChange={handleThemeChange}
|
||||||
onLogout={logout}
|
onLogout={logout}
|
||||||
@@ -343,7 +343,6 @@ function AppContent() {
|
|||||||
}}
|
}}
|
||||||
onDeleteScenario={deleteScenario}
|
onDeleteScenario={deleteScenario}
|
||||||
/>
|
/>
|
||||||
)}
|
|
||||||
|
|
||||||
{/* 创建情景 Modal */}
|
{/* 创建情景 Modal */}
|
||||||
{showCreateScenario && (
|
{showCreateScenario && (
|
||||||
|
|||||||
@@ -14,6 +14,7 @@ interface ConfigPanelProps {
|
|||||||
theme: Theme;
|
theme: Theme;
|
||||||
username?: string;
|
username?: string;
|
||||||
allScenarios: ExtendedScenario[];
|
allScenarios: ExtendedScenario[];
|
||||||
|
open: boolean;
|
||||||
onUpdate: (partial: Partial<SessionConfig>) => void;
|
onUpdate: (partial: Partial<SessionConfig>) => void;
|
||||||
onThemeChange: (theme: Theme) => void;
|
onThemeChange: (theme: Theme) => void;
|
||||||
onLogout?: () => void;
|
onLogout?: () => void;
|
||||||
@@ -28,6 +29,7 @@ export function ConfigPanel({
|
|||||||
theme,
|
theme,
|
||||||
username,
|
username,
|
||||||
allScenarios,
|
allScenarios,
|
||||||
|
open,
|
||||||
onUpdate,
|
onUpdate,
|
||||||
onThemeChange,
|
onThemeChange,
|
||||||
onLogout,
|
onLogout,
|
||||||
@@ -59,8 +61,14 @@ export function ConfigPanel({
|
|||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="drawer-overlay" onClick={onClose}>
|
<div
|
||||||
<div className="drawer" onClick={(e) => e.stopPropagation()}>
|
className={`drawer-overlay ${open ? 'drawer-overlay--visible' : ''}`}
|
||||||
|
onClick={onClose}
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
className={`drawer ${open ? 'drawer--open' : 'drawer--collapsed'}`}
|
||||||
|
onClick={(e) => e.stopPropagation()}
|
||||||
|
>
|
||||||
<div className="drawer__header">
|
<div className="drawer__header">
|
||||||
<span className="drawer__title">{t("settings.title")}</span>
|
<span className="drawer__title">{t("settings.title")}</span>
|
||||||
<button className="drawer__close" onClick={onClose}>
|
<button className="drawer__close" onClick={onClose}>
|
||||||
|
|||||||
Reference in New Issue
Block a user