fix: gray out unearned medals

fix:  回复表情通知为空的问题 #735

frontend_nuxt/assets/global.css

@@ -18,7 +18,7 @@
   --background-color-blur: rgba(255, 255, 255, 0.57);
   --menu-border-color: lightgray;
   --normal-border-color: lightgray;
-  --menu-selected-background-color: rgba(228, 228, 228, 0.884);
+  --menu-selected-background-color: rgba(242, 242, 242, 0.884);
   --menu-text-color: black;
   --scroller-background-color: rgba(130, 175, 180, 0.5);
   /* --normal-background-color: rgb(241, 241, 241); */
@@ -142,6 +142,7 @@ body {
 .info-content-text video {
   max-width: 100%;
 }
+
 .info-content-text {
   word-break: break-word;
   max-width: 100%;

frontend_nuxt/components/BaseImage.vue

@@ -59,7 +59,7 @@ function onError() {
 }
 
 .base-image.is-loaded {
-  filter: none;
+  /* Allow filters from parent classes (e.g. grayscale for unfinished medals) */
   transform: none;
   opacity: 1;
 }

frontend_nuxt/pages/about/stats.vue

@@ -33,23 +33,11 @@
 </template>
 
 <script setup>
-import { LineChart } from 'echarts/charts'
-import {
-  DataZoomComponent,
-  GridComponent,
-  TitleComponent,
-  TooltipComponent,
-} from 'echarts/components'
-import { use } from 'echarts/core'
-import { CanvasRenderer } from 'echarts/renderers'
 import { onMounted, ref } from 'vue'
-import VChart from 'vue-echarts'
 import { getToken } from '~/utils/auth'
 const config = useRuntimeConfig()
 const API_BASE_URL = config.public.apiBaseUrl
 
-use([LineChart, TitleComponent, TooltipComponent, GridComponent, DataZoomComponent, CanvasRenderer])
-
 const dauOption = ref(null)
 const newUserOption = ref(null)
 const postOption = ref(null)

frontend_nuxt/pages/message-box/[id].vue

@@ -492,6 +492,7 @@ function goBack() {
 
 .messages-list {
   overflow-y: auto;
+  overflow-x: hidden;
   padding: 20px;
   padding-bottom: 100px;
   display: flex;
@@ -597,6 +598,7 @@ function goBack() {
 }
 
 .reply-preview {
+  margin-top: 10px;
   padding: 10px;
   border-left: 5px solid var(--primary-color);
   margin-bottom: 5px;

frontend_nuxt/pages/points.vue

@@ -185,13 +185,6 @@ import BasePlaceholder from '~/components/BasePlaceholder.vue'
 import { stripMarkdownLength } from '~/utils/markdown'
 import TimeManager from '~/utils/time'
 import BaseTabs from '~/components/BaseTabs.vue'
-import { LineChart } from 'echarts/charts'
-import { GridComponent, TooltipComponent } from 'echarts/components'
-import { use } from 'echarts/core'
-import { CanvasRenderer } from 'echarts/renderers'
-import VChart from 'vue-echarts'
-
-use([LineChart, GridComponent, TooltipComponent, CanvasRenderer])
 
 const config = useRuntimeConfig()
 const API_BASE_URL = config.public.apiBaseUrl
@@ -248,9 +241,10 @@ const loadTrend = async () => {
     const values = data.map((d) => d.value)
     trendOption.value = {
       tooltip: { trigger: 'axis' },
-      xAxis: { type: 'category', data: dates },
+      xAxis: { type: 'category', data: dates, boundaryGap: false },
       yAxis: { type: 'value' },
       series: [{ type: 'line', areaStyle: {}, smooth: true, data: values }],
+      dataZoom: [{ type: 'slider', start: 80 }, { type: 'inside' }],
     }
   }
 }

frontend_nuxt/pages/posts/[id]/index.vue

@@ -1225,7 +1225,6 @@ onMounted(async () => {
 .info-content-text {
   font-size: 16px;
   line-height: 1.5;
-  width: 100%;
 }
 
 .article-footer-container {

frontend_nuxt/plugins/echarts.client.ts

@@ -0,0 +1,18 @@
+// plugins/echarts.client.ts
+import { defineNuxtPlugin } from 'nuxt/app'
+import VueECharts from 'vue-echarts'
+import { use } from 'echarts/core'
+import { CanvasRenderer } from 'echarts/renderers'
+import { LineChart } from 'echarts/charts'
+import {
+  GridComponent,
+  TooltipComponent,
+  DataZoomComponent,
+  TitleComponent,
+} from 'echarts/components'
+
+use([LineChart, TitleComponent, TooltipComponent, GridComponent, DataZoomComponent, CanvasRenderer])
+
+export default defineNuxtPlugin((nuxtApp) => {
+  nuxtApp.vueApp.component('VChart', VueECharts)
+})

frontend_nuxt/utils/markdown.js

@@ -92,7 +92,7 @@ function linkPlugin(md) {
 
 /** @section MarkdownIt 实例：开启 HTML，但配合强净化 */
 const md = new MarkdownIt({
-  html: true, // ⭐ 允许行内 HTML（为 <video> 服务）
+  html: true,
   linkify: true,
   breaks: true,
   highlight: (str, lang) => {
@@ -106,11 +106,16 @@ const md = new MarkdownIt({
       .trim()
       .split('\n')
       .map(() => `<div class="line-number"></div>`)
-    // 保留你原有的 CodeBlock + 复制按钮 + 行号结构
     return `<pre class="code-block"><button class="copy-code-btn">Copy</button><div class="line-numbers">${lineNumbers.join('')}</div><code class="hljs language-${lang || ''}">${code.trim()}</code></pre>`
   },
 })
 
+const md2TextRender = new MarkdownIt({
+  html: true,
+  linkify: true,
+  breaks: true,
+})
+
 md.use(mentionPlugin)
 md.use(tiebaEmojiPlugin)
 md.use(linkPlugin)
@@ -221,7 +226,7 @@ export function handleMarkdownClick(e) {
 
 /** @section 纯文本提取（保持你原有“统一正则法”） */
 export function stripMarkdown(text) {
-  const html = md.render(text || '')
+  const html = md2TextRender.render(text || '')
   let plainText = html.replace(/<[^>]+>/g, '')
   plainText = plainText
     .replace(/\r\n/g, '\n')