From 4abc316311f6d9d3aa14b79fec6510f5a268993e Mon Sep 17 00:00:00 2001
From: cat_shark <1716967236@qq.com>
Date: Sat, 23 May 2026 22:55:06 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20ReviewDetail=20=E5=86=85=E5=AE=B9?=
 =?UTF-8?q?=E5=B1=85=E4=B8=AD=E4=B8=8E=E6=96=87=E5=AD=97=E6=8D=A2=E8=A1=8C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 页面内容 margin: 0 auto 居中
- 内容区和历史记录添加 word-break 防止长文本溢出
- 移除已删除的 .detail-head 死 CSS 和页面 header
---
 src/components/ReviewDetail.vue | 38 +++++----------------------------
 1 file changed, 5 insertions(+), 33 deletions(-)

diff --git a/src/components/ReviewDetail.vue b/src/components/ReviewDetail.vue
index 191a28d..fa422dd 100644
--- a/src/components/ReviewDetail.vue
+++ b/src/components/ReviewDetail.vue
@@ -121,14 +121,6 @@ onMounted(() => {
 
 <template>
   <section class="review-detail-page">
-    <header class="surface-card detail-head">
-      <el-button @click="router.back()" :disabled="loading">← 返回</el-button>
-      <div>
-        <h1 class="page-title">复习详情</h1>
-        <p class="page-subtitle">查看完整内容，回忆当时所学</p>
-      </div>
-    </header>
-
     <!-- 当前条目内容 -->
     <article class="surface-card content-card" v-loading="loading">
       <div class="content-meta">
@@ -205,26 +197,7 @@ onMounted(() => {
   flex-direction: column;
   gap: 14px;
   max-width: 900px;
-}
-
-.detail-head {
-  padding: 20px 22px;
-  display: flex;
-  align-items: flex-start;
-  gap: 16px;
-}
-
-.detail-head .el-button {
-  flex-shrink: 0;
-  margin-top: 2px;
-}
-
-.detail-head h1 {
-  margin: 0;
-}
-
-.detail-head p {
-  margin: 2px 0 0;
+  margin: 0 auto;
 }
 
 .content-card {
@@ -255,6 +228,8 @@ onMounted(() => {
   line-height: 1.8;
   color: var(--text-primary);
   font-size: 15px;
+  word-break: break-word;
+  overflow-wrap: break-word;
 }
 
 .content-body p {
@@ -334,6 +309,8 @@ onMounted(() => {
   padding: 4px 8px;
   border-radius: 4px;
   transition: background 0.15s;
+  word-break: break-word;
+  overflow-wrap: break-word;
 }
 
 .clickable-text:hover {
@@ -365,9 +342,4 @@ onMounted(() => {
   color: #b8860b;
 }
 
-@media (max-width: 768px) {
-  .detail-head {
-    flex-direction: column;
-  }
-}
 </style>
\ No newline at end of file