feat: Enhance code highlighting

pages/components/HighlightSyntax.module.css

@@ -10,6 +10,7 @@
 	color: #e0e0e0;
 }
 
+/* JavaScript/TypeScript 关键字 */
 .keyword {
 	color: #d73a49;
 	font-weight: 600;
@@ -19,6 +20,27 @@
 	color: #ff6b6b;
 }
 
+/* TypeScript 特定关键字 (interface, type, enum, etc.) */
+.tsKeyword {
+	color: #af00db;
+	font-weight: 600;
+}
+
+:global(.dark) .tsKeyword {
+	color: #c792ea;
+}
+
+/* TypeScript 内置类型 */
+.type {
+	color: #267f99;
+	font-weight: 500;
+}
+
+:global(.dark) .type {
+	color: #4ec9b0;
+}
+
+/* 字符串 */
 .string {
 	color: #1d6eca;
 }
@@ -27,6 +49,7 @@
 	color: #4fc3f7;
 }
 
+/* 数字 */
 .number {
 	color: #00c583;
 }
@@ -35,6 +58,17 @@
 	color: #66bb6a;
 }
 
+/* 布尔值和字面量 (true, false, null, undefined) */
+.literal {
+	color: #0000ff;
+	font-weight: 500;
+}
+
+:global(.dark) .literal {
+	color: #569cd6;
+}
+
+/* 注释 */
 .comment {
 	color: #6a737d;
 	font-style: italic;
@@ -43,3 +77,51 @@
 :global(.dark) .comment {
 	color: #9e9e9e;
 }
+
+/* 装饰器 (@decorator) */
+.decorator {
+	color: #e0aa00;
+	font-weight: 500;
+}
+
+:global(.dark) .decorator {
+	color: #dcdcaa;
+}
+
+
+/* 箭头函数 (=>) */
+.arrow {
+	color: #d73a49;
+	font-weight: bold;
+}
+
+:global(.dark) .arrow {
+	color: #ff6b6b;
+}
+
+/* 标识符（变量名、函数名等） */
+.identifier {
+	color: #171717;
+}
+
+:global(.dark) .identifier {
+	color: #e0e0e0;
+}
+
+/* 属性访问 (.property) */
+.property {
+	color: #0550ae;
+}
+
+:global(.dark) .property {
+	color: #9cdcfe;
+}
+
+/* 运算符 */
+.operator {
+	color: #5a5a5a;
+}
+
+:global(.dark) .operator {
+	color: #d4d4d4;
+}