From e316d1a153f82abae344021be1e6cb9656d80048 Mon Sep 17 00:00:00 2001
From: tk <szdot@live.com>
Date: Wed, 24 Jul 2024 20:02:42 +0800
Subject: [PATCH] =?UTF-8?q?=E3=80=90=E7=B1=BB=20=20=E5=9E=8B=E3=80=91?=
 =?UTF-8?q?=EF=BC=9Afix=20=E6=89=8B=E6=9C=BA=E7=AB=96=E5=B1=8F=20=E6=97=A5?=
 =?UTF-8?q?=E5=BF=97=E8=B6=85=E5=87=BA=E5=AE=BD=E5=BA=A6=20=E4=B8=8D?=
 =?UTF-8?q?=E6=98=BE=E7=A4=BA=20=E3=80=90=E5=8E=9F=20=20=E5=9B=A0=E3=80=91?=
 =?UTF-8?q?=EF=BC=9Acss=E6=A0=B7=E5=BC=8F=E5=AF=BC=E8=87=B4=20=E3=80=90?=
 =?UTF-8?q?=E8=BF=87=20=20=E7=A8=8B=E3=80=91=EF=BC=9Adisplay:=20inline-blo?=
 =?UTF-8?q?ck;=E5=B9=B6=E8=AE=BE=E7=BD=AE=E4=B8=80=E4=B8=AA=E6=9C=80?=
 =?UTF-8?q?=E5=A4=A7=E5=AE=BD=E5=BA=A6=20=E8=B6=85=E5=87=BA=E7=9C=81?=
 =?UTF-8?q?=E7=95=A5=E5=8F=B7=E4=BB=A3=E6=9B=BF=20=E3=80=90=E5=BD=B1=20=20?=
 =?UTF-8?q?=E5=93=8D=E3=80=91=EF=BC=9A?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/layout/components/BlogBox.vue | 15 +++++++++++++--
 1 file changed, 13 insertions(+), 2 deletions(-)

diff --git a/src/views/layout/components/BlogBox.vue b/src/views/layout/components/BlogBox.vue
index 2f7a3fb..1713309 100644
--- a/src/views/layout/components/BlogBox.vue
+++ b/src/views/layout/components/BlogBox.vue
@@ -2,10 +2,10 @@
   <div class="fixed-bottom p-l-5" :class="maxWidth">
     <el-button @click="handleOpenBlog" class="l p-3" type="text" size="mini" icon="iconfont icon-chuangkoufangda"
       circle></el-button>
-    <div class="l p-l-10" v-if="newLog">
+    <div class="l p-l-10 flex" v-if="newLog">
       <span class="l m-t-5 m-r-5 logDot" :style="{ background: newLog.color }"></span>
       <span>{{ newLog.timestamp | parseTime('{h}:{i}:{s}') }}</span>
-      <span class="m-l-10">{{ newLog.content }}</span>
+      <span class="content m-l-10">{{ newLog.content }}</span>
     </div>
     <el-drawer :modal-append-to-body="false" :visible.sync="drawer" direction="btt" size="50%">
       <template slot="title">
@@ -99,4 +99,15 @@ export default {
   overflow: hidden;
   display: block;
 }
+
+.timestamp,
+.content {
+  display: inline-block;
+  /* 确保元素可以应用宽度 */
+  max-width: 60vw;
+  /* 根据需要设置宽度 */
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
 </style>