feat(topic): add tab comp to topic06 (#255)

* feat(topic): add tab component for topic6 * feat(topic): added tab comp for topic6 --------- Co-authored-by: Kiyoshi <44930252+Kiyo5hi@users.noreply.github.com>
Geometry-Discovery-Project-UCI · May 6, 2024 · 80c6af6 · 80c6af6
1 parent d03ff3a
commit 80c6af6
Show file tree

Hide file tree

Showing 4 changed files with 1,185 additions and 1,081 deletions.
diff --git a/src/data.ts b/src/data.ts
@@ -557,7 +557,7 @@ export const topics: Topic[] = [
     index: 6,
     snapshot: "images/snapshots/topic06.png",
     essay: "pdfs/topic06.pdf",
-    animationContributors: [ZEJIN_XU],
+    animationContributors: [ZEJIN_XU, JIANLIN_LI],
     essayContributors: [ZHIQIN_LU, XIANFU_LIU],
     captionContributors: [CHEN_XU],
   },

diff --git a/src/main.ts b/src/main.ts
@@ -22,7 +22,11 @@ createApp(App)
   .use(Antd)
   .directive("katex", (el, binding) => {
     const isDisplay = binding.arg === "display";
-    katex.render(el.innerHTML, el, { displayMode: isDisplay });
+    try {
+      katex.render(el.innerHTML, el, { displayMode: isDisplay });
+    } catch (e) {
+      console.error("KaTeX rendering error:", e);
+    }
   })
   .directive("tikz", (el) => {
     const scripts = el.innerHTML;
@@ -34,3 +38,5 @@ createApp(App)
     el.appendChild(scriptTag);
   })
   .mount("#app");
+
+// 函数用于解码 HTML 实体
diff --git a/src/views/TopicsView.vue b/src/views/TopicsView.vue
@@ -1,6 +1,6 @@
 <template>
   <ATypographyTitle :level="1">Topics</ATypographyTitle>
-  <AList itemLayout="horizontal" :dataSource="topics" :grid="{gutter: 16}">
+  <AList itemLayout="horizontal" :dataSource="topics" :grid="{ gutter: 16 }">
     <template #renderItem="{ item: topic }">
       <AListItem>
         <RouterLink :to="`/topic/${topic.index}`" target="_blank">
@@ -10,7 +10,7 @@
             </template>
             <ACardMeta :title="`Topic ${topic.index}`">
               <template #description>
-                <div style="height: 3rem; width: 250px;">
+                <div style="height: 3rem; width: 250px">
                   {{ topic.name }}
                 </div>
               </template>
@@ -49,4 +49,9 @@ export default defineComponent({
   width: 300px;
   padding: 1px;
 }
+
+.animation-layout {
+  display: flex;
+  gap: 20px;
+}
 </style>