收藏夹

components/i/library/thread.vue

 <template>
     <ULink to="/search/123" class="flex flex-col group">
         <div class="transition truncate group-hover:text-primary">Python有哪些新的库</div>
-        <div class="break-word text-balance text-gray-600 line-clamp-2 font-sans text-base">
+        <div class="break-word text-balance line-clamp-2 font-sans text-base" :class="textColor">
             Python有许多新的库不断涌现,以下是一些值得关注的新库:
             Anthropic - 由Anthropic公司开发的大型语言模型库,用于自然语言处理和生成任务。
             Jax - 用于高性能数值计算的库,支持自动微分和GPU/TPU加速,适用于机器学习和科学计算。
@@ -17,21 +17,27 @@
     </ULink>
     <div class="flex justify-between items-center">
         <div class="flex gap-4">
-            <div class="flex items-center text-gray-500 text-sm gap-0.5">
+            <div class="flex items-center text-sm gap-0.5" :class="textColor">
                 <UIcon name="i-heroicons-eye" />
                 <span>1</span>
             </div>
-            <div class="flex items-center text-gray-500 text-sm gap-0.5">
+            <div class="flex items-center text-sm gap-0.5" :class="textColor">
                 <UIcon name="i-heroicons-clock" />
                 <span>52 分钟前</span>
             </div>
         </div>
         <div class="flex">
-            
+            <UButton
+                :ui="{ rounded: 'rounded-full' }"
+                to="/library/123"
+                color="white"
+                size="2xs"
+                label="前端开发"
+            />
         </div>
     </div>
     <UDivider />
 </template>
 <script setup>
-
+const textColor = 'text-gray-500 dark:text-gray-400'
 </script>
\ No newline at end of file

pages/library.vue

@@ -18,7 +18,7 @@
         </div>
         <UDivider />
         <div class="container max-w-screen-lg flex flex-col p-6">
-            <div class="flex gap-4">
+            <div class="flex gap-10">
                 <div class="flex flex-col flex-grow">
                     <div class="flex items-center text-lg gap-2">
                         <UIcon name="i-heroicons-square-3-stack-3d" />