From 970a99e8695d68c186d18a4b91c75fe041020981 Mon Sep 17 00:00:00 2001
From: JSR <pandajsr72@gmail.com>
Date: Wed, 18 Mar 2026 21:31:31 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E7=A7=AF=E5=88=86=E6=93=8D?=
 =?UTF-8?q?=E4=BD=9C=E9=A1=B5=E6=A8=AA=E5=90=91=E6=BB=9A=E5=8A=A8=E5=B9=B6?=
 =?UTF-8?q?=E6=94=AF=E6=8C=81=E9=A1=B6=E9=83=A8=E6=8B=96=E5=8A=A8=E7=AA=97?=
 =?UTF-8?q?=E5=8F=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/main.css     | 10 ++++++++++
 src/components/Home.tsx | 35 +++++++++++++++++++++++++++++------
 2 files changed, 39 insertions(+), 6 deletions(-)

diff --git a/src/assets/main.css b/src/assets/main.css
index ee5a122..718a001 100644
--- a/src/assets/main.css
+++ b/src/assets/main.css
@@ -64,3 +64,13 @@ textarea {
 .ss-table-center .ant-table td {
   text-align: center;
 }
+
+.ss-operation-drawer .ant-drawer-header {
+  -webkit-app-region: drag;
+  user-select: none;
+}
+
+.ss-operation-drawer .ant-drawer-header .ant-drawer-close,
+.ss-operation-drawer .ant-drawer-header button {
+  -webkit-app-region: no-drag;
+}
diff --git a/src/components/Home.tsx b/src/components/Home.tsx
index 9b0e41b..749ff89 100644
--- a/src/components/Home.tsx
+++ b/src/components/Home.tsx
@@ -1181,18 +1181,28 @@ export const Home: React.FC<HomeProps> = ({ canEdit, isPortraitMode = false }) =
   }
 
   const operationPanelContent = selectedStudent && (
-    <div style={{ display: "flex", flexDirection: "column", gap: "20px", padding: "8px 0" }}>
+    <div
+      style={{
+        display: "flex",
+        flexDirection: "column",
+        gap: "20px",
+        padding: "8px 0",
+        overflowX: "hidden",
+      }}
+    >
       <div
         style={{
           display: "flex",
           alignItems: "center",
           justifyContent: "space-between",
+          flexWrap: "wrap",
+          gap: "8px",
           padding: "12px 16px",
           backgroundColor: "var(--ss-bg-color)",
           borderRadius: "8px",
         }}
       >
-        <div style={{ display: "flex", alignItems: "center", gap: "12px" }}>
+        <div style={{ display: "flex", alignItems: "center", gap: "12px", minWidth: 0, flex: 1 }}>
           {selectedStudent.avatarUrl ? (
             <img
               src={selectedStudent.avatarUrl}
@@ -1223,9 +1233,19 @@ export const Home: React.FC<HomeProps> = ({ canEdit, isPortraitMode = false }) =
               {getDisplayText(selectedStudent.name)}
             </div>
           )}
-          <span style={{ fontWeight: 600 }}>{selectedStudent.name}</span>
+          <span
+            style={{
+              fontWeight: 600,
+              minWidth: 0,
+              overflow: "hidden",
+              textOverflow: "ellipsis",
+              whiteSpace: "nowrap",
+            }}
+          >
+            {selectedStudent.name}
+          </span>
         </div>
-        <div style={{ display: "flex", alignItems: "center", gap: "8px" }}>
+        <div style={{ display: "flex", alignItems: "center", gap: "8px", flexShrink: 0 }}>
           <span style={{ color: "var(--ss-text-secondary)", fontSize: "13px" }}>
             {t("home.currentScore")}：
           </span>
@@ -1358,7 +1378,7 @@ export const Home: React.FC<HomeProps> = ({ canEdit, isPortraitMode = false }) =
             0
           </Button>
         </div>
-        <div style={{ display: "flex", gap: "12px", alignItems: "center" }}>
+        <div style={{ display: "flex", gap: "12px", alignItems: "center", flexWrap: "wrap" }}>
           <InputNumber
             value={customScore}
             onChange={(v) => setCustomScore(v as number)}
@@ -1610,12 +1630,15 @@ export const Home: React.FC<HomeProps> = ({ canEdit, isPortraitMode = false }) =
       {isPortraitMode ? (
         <Drawer
           title={t("home.operationTitle", { name: selectedStudent?.name })}
+          className="ss-operation-drawer"
           placement="bottom"
           height="100%"
           open={operationVisible}
           onClose={() => setOperationVisible(false)}
           destroyOnClose
-          styles={{ body: { padding: "12px 16px 24px" } }}
+          styles={{
+            body: { padding: "12px 16px 24px", overflowX: "hidden" },
+          }}
           footer={
             <Space style={{ width: "100%", justifyContent: "flex-end" }}>
               <Button onClick={() => setOperationVisible(false)}>{t("common.cancel")}</Button>