style update

src/assets/styles/theme.css

@@ -28,6 +28,7 @@
     --m-grey22: #424E59;
     --m-grey22-hover: rgba(66, 78, 89, .8);
     --m-grey23: #48545F;
+    --m-grey25: #A5CDFF;
     --m-grey26: #343e48;
 
     --m-grey31: #212629;
@@ -69,6 +70,7 @@
     --m-grey62: #08131F;
     --m-grey63: #08131F;
     --m-grey64: #15202B;
+    --m-grey65: #7a8a94;
     /* --m-green1: #e8ffef; */
 
     --m-black0: #242a2e;
@@ -235,6 +237,7 @@
     --m-grey22: #424E59;
     --m-grey22-hover: rgba(66, 78, 89, .8);
     --m-grey23: #48545F;
+    --m-grey25: #A5CDFF;
     --m-grey26: #343e48;
 
     --m-grey31: #212629;
@@ -276,6 +279,7 @@
     --m-grey62: #08131F;
     --m-grey63: #08131F;
     --m-grey64: #15202B;
+    --m-grey65: #7a8a94;
     /* --m-green1: #e8ffef; */
 
     --m-black0: #242a2e;
@@ -439,6 +443,7 @@
     --m-grey22: #E4F5FF;  
     --m-grey22-hover: rgba(228, 245, 255, .8);
     --m-grey23: #A5CDFF;
+    --m-grey25: #999999;
     --m-grey26: #5179E2;
 
     --m-grey31: #D6DEE3;
@@ -480,6 +485,7 @@
     --m-grey62: #ffffff;
     --m-grey63: #F6F8FA;
     --m-grey64: #FFFFFF;
+    --m-grey65: #333333;
 
     --m-black0: #F8FBFF;
     --m-black1: #ECF2F5;

src/assets/styles/variables.less

@@ -33,7 +33,7 @@
 @m-grey22-hover: var(--m-grey22-hover);
 @m-grey23: var(--m-grey23);
 @m-grey24: #444444;
-@m-grey25: #3b444a;
+@m-grey25: var(--m-grey25);
 @m-grey26: var(--m-grey26);
 @m-grey27: #34444E;
 @m-grey28: #36506B;
@@ -78,6 +78,7 @@
 @m-grey62: var(--m-grey62);
 @m-grey63: var(--m-grey63);
 @m-grey64: var(--m-grey64);
+@m-grey65: var(--m-grey65);
 
 @m-black: #000000;
 @m-black0: var(--m-black0);

src/views/setting/notice/components/noticeContent.vue

@@ -1,29 +1,30 @@
 <template>
-  <div class="notice-content">
-    <aside>
-      <a-list item-layout="horizontal"
-              :data-source="noticeList">
-        <template #renderItem="{ item }">
-          <a-list-item @click="choose(item)">
-            <a-list-item-meta :description="formatTime(item.createtime)">
-              <template #title>
-                <a :style="{ color: item.readed ? '@m-grey2' : '@m-white1' }"
-                   href="javascript:;">{{ item.title }}</a>
-              </template>
-              <template #avatar>
-                <a-badge :color="item.readed ? '@m-grey2' : 'orange'" />
-              </template>
-            </a-list-item-meta>
-          </a-list-item>
-        </template>
-      </a-list>
-    </aside>
-    <main>
-      <h4>{{ chooseItemNotice.title }}</h4>
-      <p>{{ formatTime(chooseItemNotice.createtime) }}</p>
-      <div>{{ chooseItemNotice.content }}</div>
-    </main>
-  </div>
+    <div class="notice-content">
+        <aside>
+            <a-list item-layout="horizontal" :data-source="noticeList">
+                <template #renderItem="{ item }">
+                    <a-list-item @click="choose(item)">
+                        <a-list-item-meta :description="formatTime(item.createtime)">
+                            <template #title>
+                                <a
+                                    :style="{ color: item.readed ? '@m-grey2' : '@m-white1' }"
+                                    href="javascript:;"
+                                >{{ item.title }}</a>
+                            </template>
+                            <template #avatar>
+                                <a-badge :color="item.readed ? '@m-grey2' : 'orange'" />
+                            </template>
+                        </a-list-item-meta>
+                    </a-list-item>
+                </template>
+            </a-list>
+        </aside>
+        <main>
+            <h4>{{ chooseItemNotice.title }}</h4>
+            <p>{{ formatTime(chooseItemNotice.createtime) }}</p>
+            <div>{{ chooseItemNotice.content }}</div>
+        </main>
+    </div>
 </template>
 
 <script lang="ts">
@@ -84,6 +85,11 @@ export default defineComponent({
         width: 202px;
         height: 619px;
         .ant-list-split {
+            .ant-list-item-meta-title {
+                > a {
+                    color: @m-grey65;
+                }
+            }
             .ant-list-item-meta-description {
                 text-align: right;
                 font-size: 13px;