From abddafa3cf8d2700e6cb9a83ae87afc2c9c5f130 Mon Sep 17 00:00:00 2001
From: wanglin2 <1013335014@qq.com>
Date: Wed, 18 Oct 2023 13:45:42 +0800
Subject: [PATCH] =?UTF-8?q?Demo=EF=BC=9A=E8=B0=83=E6=95=B4=E7=95=8C?=
 =?UTF-8?q?=E9=9D=A2=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 web/src/pages/Edit/components/Count.vue       |  2 +-
 .../Edit/components/NavigatorToolbar.vue      |  4 +++-
 web/src/pages/Edit/components/ShortcutKey.vue | 19 ++++++++++++-------
 3 files changed, 16 insertions(+), 9 deletions(-)

diff --git a/web/src/pages/Edit/components/Count.vue b/web/src/pages/Edit/components/Count.vue
index 359c1b6e..0c276aba 100644
--- a/web/src/pages/Edit/components/Count.vue
+++ b/web/src/pages/Edit/components/Count.vue
@@ -116,7 +116,7 @@ export default {
   }
 }
 
-@media screen and (max-width: 635px) {
+@media screen and (max-width: 740px) {
   .countContainer {
     display: none;
   }
diff --git a/web/src/pages/Edit/components/NavigatorToolbar.vue b/web/src/pages/Edit/components/NavigatorToolbar.vue
index 1ed9bdc3..c8a764bc 100644
--- a/web/src/pages/Edit/components/NavigatorToolbar.vue
+++ b/web/src/pages/Edit/components/NavigatorToolbar.vue
@@ -233,10 +233,12 @@ export default {
   }
 }
 
-@media screen and (max-width: 502px) {
+@media screen and (max-width: 590px) {
   .navigatorContainer {
     left: 20px;
     overflow-x: auto;
+    overflow-y: hidden;
+    height: 60px;
   }
 }
 </style>
diff --git a/web/src/pages/Edit/components/ShortcutKey.vue b/web/src/pages/Edit/components/ShortcutKey.vue
index 7359af3f..61d3a6d0 100644
--- a/web/src/pages/Edit/components/ShortcutKey.vue
+++ b/web/src/pages/Edit/components/ShortcutKey.vue
@@ -10,8 +10,8 @@
               class="icon iconfont"
               :class="[item2.icon]"
             ></span>
-            <span class="name">{{ item2.name }}</span>
-            <div class="value">{{ item2.value }}</div>
+            <span class="name" :title="item2.name">{{ item2.name }}</span>
+            <div class="value" :title="item2.value">{{ item2.value }}</div>
           </div>
         </div>
       </div>
@@ -67,16 +67,15 @@ export default {
 
     .list {
       .item {
-
         .icon {
-          color: hsla(0,0%,100%,.6);
+          color: hsla(0, 0%, 100%, 0.6);
         }
         .name {
-          color: hsla(0,0%,100%,.6);
+          color: hsla(0, 0%, 100%, 0.6);
         }
-        
+
         .value {
-          color: hsla(0,0%,100%,.3);
+          color: hsla(0, 0%, 100%, 0.3);
         }
       }
     }
@@ -104,11 +103,17 @@ export default {
 
       .name {
         color: #333;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
       }
 
       .value {
         color: #909090;
         margin-left: auto;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
       }
     }
   }