优化页面、修复BUG

client/src/pages/Snippets.vue

@@ -40,7 +40,7 @@
           </div>
           <!-- Code Preview (Styled) -->
           <div class="p-6 overflow-hidden font-mono text-sm leading-relaxed pointer-events-none opacity-80 group-hover:opacity-100 transition-opacity">
-            <pre class="whitespace-pre-wrap break-all line-clamp-4"><CodeBlock :code="snippet.code" :language="getSnippetLang(snippet.type)" /></pre>
+            <pre class="whitespace-pre-wrap break-all line-clamp-4"><CodeBlock :code="snippet.code" :language="snippetLang(snippet)" /></pre>
           </div>
         </div>
       </div>
@@ -52,6 +52,8 @@
       :title="currentSnippet.title" 
       :code="currentSnippet.code" 
       :type="currentSnippet.type"
+      :code-type="currentSnippet.codeType"
+      :description="currentSnippet.description"
       @close="closeSnippet"
     />
   </section>
@@ -63,6 +65,7 @@ import { fetchSnippets, Snippet } from '../services/api'
 import { useScrollAnimation } from '../composables/useScrollAnimation'
 import SnippetModal from '../components/SnippetModal.vue'
 import CodeBlock from '../components/CodeBlock.vue'
+import { resolveHighlightLanguage } from '../utils/codeHighlight'
 
 const snippets = ref<Snippet[]>([])
 const loading = ref(false)
@@ -143,14 +146,8 @@ export const useMousePosition = () => {
   }
 }
 
-const getSnippetLang = (type: string) => {
-  const map: Record<string, string> = {
-    'mouse': 'javascript',
-    'glass': 'css',
-    'noise': 'xml',
-    'animate': 'css'
-  }
-  return map[type] || 'plaintext'
+const snippetLang = (snippet: Snippet) => {
+  return resolveHighlightLanguage(snippet.codeType?.name || snippet.type)
 }
 
 const openSnippet = (snippet: Snippet) => {