From 2be72692bbaa874a5bb090cc25c3f911f36f85a9 Mon Sep 17 00:00:00 2001
From: BTMuli <BT-Muli@outlook.com>
Date: Thu, 28 Dec 2023 12:50:52 +0800
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20=E6=B7=BB=E5=8A=A0=20topic?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/themes/dark.css    |  6 +++---
 src/assets/themes/default.css |  5 +++--
 src/views/t-post.vue          | 23 ++++++++++++++++++++---
 3 files changed, 26 insertions(+), 8 deletions(-)

diff --git a/src/assets/themes/dark.css b/src/assets/themes/dark.css
index ad2b8a4b..61795074 100644
--- a/src/assets/themes/dark.css
+++ b/src/assets/themes/dark.css
@@ -1,8 +1,7 @@
 /**
- * @file assets themes dark.css
+ * @file assets/themes/dark.css
  * @description 主题样式文件-深色主题
- * @author BTMuli <bt-muli@outlook.com>
- * @since Beta v0.3.0
+ * @since Beta v0.3.9
  */
 
 /* dark mode */
@@ -27,6 +26,7 @@ html.dark {
   --box-text-2: var(--tgc-white-2);
   --box-text-3: var(--tgc-blue-1);
   --box-text-4: var(--tgc-white-4);
+  --box-text-5: var(--tgc-red-1);
   --box-text-7: var(--tgc-white-5);
 
   /* button */
diff --git a/src/assets/themes/default.css b/src/assets/themes/default.css
index 202cc2c3..98251347 100644
--- a/src/assets/themes/default.css
+++ b/src/assets/themes/default.css
@@ -1,7 +1,7 @@
 /**
- * @file assets themes default.css
+ * @file assets/themes/default.css
  * @description 主题样式文件-默认（浅色）主题
- * @since Beta v0.3.3
+ * @since Beta v0.3.9
  */
 
 /* default(light) theme */
@@ -26,6 +26,7 @@ html.default {
   --box-text-2: var(--tgc-dark-2);
   --box-text-3: var(--tgc-blue-2);
   --box-text-4: var(--tgc-blue-3); /* subtitle */
+  --box-text-5: var(--tgc-pink-1); /* tag */
   --box-text-7: var(--tgc-dark-7); /* quote */
 
   /* button */
diff --git a/src/views/t-post.vue b/src/views/t-post.vue
index 0a8df472..1aff455b 100644
--- a/src/views/t-post.vue
+++ b/src/views/t-post.vue
@@ -69,7 +69,10 @@
         <span>{{ postData.collection.collection_title }}</span>
         <span>{{ postData.collection.cur }}/{{ postData.collection.total }}</span>
       </div>
-      <!-- todo topic -->
+      <div v-for="topic in postData.topics" :key="topic.id" class="tp-post-topic">
+        <v-icon size="12">mdi-tag</v-icon>
+        <span>{{ topic.name }}</span>
+      </div>
     </div>
     <div class="tp-post-subtitle">
       <span>创建时间：{{ getDate(postData.post.created_at) }}&emsp;</span>
@@ -247,6 +250,9 @@ async function toAuthor(): Promise<void> {
 
 /* title */
 .tp-post-title {
+  display: flex;
+  align-items: center;
+  justify-content: start;
   color: var(--common-text-title);
   font-family: var(--font-title);
   font-size: 20px;
@@ -254,13 +260,14 @@ async function toAuthor(): Promise<void> {
 
 .mpt-official {
   display: inline-block;
-  width: 30px;
+  width: 24px;
   align-items: center;
   justify-content: center;
   border-radius: 5px;
   margin-right: 2px;
   background: var(--common-shadow-1);
-  color: var(--box-text-3);
+  color: var(--box-text-5);
+  font-size: 16px;
   text-align: center;
 }
 
@@ -417,4 +424,14 @@ async function toAuthor(): Promise<void> {
   font-family: var(--font-title);
   font-size: 12px;
 }
+
+/* topic */
+.tp-post-topic {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: var(--box-text-5);
+  font-family: var(--font-title);
+  font-size: 12px;
+}
 </style>