From 3fcb9b7b475ab690b6a509d5ee34009f9e3185ed Mon Sep 17 00:00:00 2001
From: ClasWen <clas.wen@icloud.com>
Date: Sun, 25 Aug 2024 10:32:54 +0800
Subject: [PATCH] fix style

---
 src/components/Navigation.astro   |   3 +-
 src/components/NavigationUser.vue |  12 +--
 src/pages/index.astro             | 129 ++++++++++++++++--------------
 src/pages/posts/blogs/test.md     |  11 ---
 src/pages/posts/影留宁理2024.md   |   4 +-
 5 files changed, 77 insertions(+), 82 deletions(-)
 delete mode 100644 src/pages/posts/blogs/test.md

diff --git a/src/components/Navigation.astro b/src/components/Navigation.astro
index 8d2a826..b391b49 100644
--- a/src/components/Navigation.astro
+++ b/src/components/Navigation.astro
@@ -35,7 +35,7 @@ const menuList = ref<{
             <img
               src="https://oss.nbtca.space/CA-logo.svg"
               alt=""
-              style="width: 28px; aspect-ratio: 1;"
+              style="width: 32px; aspect-ratio: 1;"
             />
             <span class="hidden md:block">
               {SITE_TITLE}
@@ -51,6 +51,7 @@ const menuList = ref<{
                 ),
               )
             }
+            <div class="hidden lg:bock h-4 w-[0.5px] bg-gray-300 ml-1 mr-3"></div>
             <NavigationUser client:load />
           </div>
         </div>
diff --git a/src/components/NavigationUser.vue b/src/components/NavigationUser.vue
index 32853c0..3c5a41c 100644
--- a/src/components/NavigationUser.vue
+++ b/src/components/NavigationUser.vue
@@ -16,7 +16,7 @@ const onSignOut = async () => {
 const isAuthenticated = ref<boolean>()
 const userInfo = ref<IdTokenClaims>()
 const initAuth = async () => {
-  if(!logtoClient.value){
+  if (!logtoClient.value) {
     return
   }
   try {
@@ -34,7 +34,7 @@ onMounted(() => {
 })
 </script>
 <template>
-  <div class="flex items-center justify-center w-12">
+  <div class="flex items-center justify-center w-10">
     <div @click="onSignIn" v-if="isAuthenticated === false" class="">
       <a class="nav-item-content px-2 hover:text-[#2997ff] text-nowrap cursor-pointer">登入</a>
     </div>
@@ -42,8 +42,8 @@ onMounted(() => {
       <Menu as="div" class="relative inline-block text-left">
         <div>
           <MenuButton class="flex items-center focus:outline-none">
-            <div class="h-7 w-7 rounded-full border border-gray-300 overflow-hidden">
-              <img :src="userInfo.picture" alt="" class="w-full" />
+            <div class="h-8 aspect-square rounded-full border border-gray-300 overflow-hidden">
+              <img :src="userInfo.picture" alt="https://oss.nbtca.space/CA-logo.svg" class="w-full" />
             </div>
           </MenuButton>
         </div>
@@ -57,9 +57,9 @@ onMounted(() => {
           leave-to-class="transform scale-95 opacity-0"
         >
           <MenuItems
-            class="absolute right-0 mt-2 w-32 origin-top-right divide-y divide-gray-100 rounded-md bg-white shadow-lg ring-1 ring-black/5 focus:outline-none"
+            class="absolute right-0 mt-2 w-32 origin-top-right rounded-md bg-white shadow-lg ring-1 ring-black/5 focus:outline-none"
           >
-            <div class="px-1 py-1">
+            <div class="p-1">
               <MenuItem v-slot="{ active }">
                 <button
                   @click="onSignOut"
diff --git a/src/pages/index.astro b/src/pages/index.astro
index ebdb5d1..4f1905c 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -8,6 +8,11 @@ allPosts.sort(
   (a, b) =>
     Date.parse(b.frontmatter.pubDate) - Date.parse(a.frontmatter.pubDate),
 )
+
+Blogs.sort(
+  (a, b) =>
+    Date.parse(b.frontmatter.pubDate) - Date.parse(a.frontmatter.pubDate),
+)
 ---
 
   <BaseLayout>
@@ -16,51 +21,51 @@ allPosts.sort(
         <ul role="list" class="section-tiles">
           {
           // tile-hero
-          allPosts.slice(0, 1).map((post) => {
-            return (
-              <Tile
-                title={post.frontmatter.title}
-                href={post.url}
-                date={post.frontmatter.pubDate}
-                tags={post.frontmatter.tags}
-                cover={post.frontmatter.cover.url}
-                level="1"
-              />
-            )
-          })
-        }
+            allPosts.slice(0, 1).map((post) => {
+              return (
+                <Tile
+                  title={post.frontmatter.title}
+                  href={post.url}
+                  date={post.frontmatter.pubDate}
+                  tags={post.frontmatter.tags}
+                  cover={post.frontmatter.cover.url}
+                  level="1"
+                />
+              )
+            })
+          }
 
           {
           // tile-2up
-          allPosts.slice(1, 5).map((post) => {
-            return (
-              <Tile
-                title={post.frontmatter.title}
-                href={post.url}
-                date={post.frontmatter.pubDate}
-                tags={post.frontmatter.tags}
-                cover={post.frontmatter.cover.url}
-                level="2"
-              />
-            )
-          })
-        }
+            allPosts.slice(1, 5).map((post) => {
+              return (
+                <Tile
+                  title={post.frontmatter.title}
+                  href={post.url}
+                  date={post.frontmatter.pubDate}
+                  tags={post.frontmatter.tags}
+                  cover={post.frontmatter.cover.url}
+                  level="2"
+                />
+              )
+            })
+          }
 
           {
           // tile-3up
-          allPosts.slice(5, 11).map((post) => {
-            return (
-              <Tile
-                title={post.frontmatter.title}
-                href={post.url}
-                date={post.frontmatter.pubDate}
-                tags={post.frontmatter.tags}
-                cover={post.frontmatter.cover.url}
-                level="3"
-              />
-            )
-          })
-        }
+            allPosts.slice(5, 11).map((post) => {
+              return (
+                <Tile
+                  title={post.frontmatter.title}
+                  href={post.url}
+                  date={post.frontmatter.pubDate}
+                  tags={post.frontmatter.tags}
+                  cover={post.frontmatter.cover.url}
+                  level="3"
+                />
+              )
+            })
+          }
         </ul>
       </div>
     </section>
@@ -72,30 +77,30 @@ allPosts.sort(
         <ul role="list" class="section-tiles">
           {
           // tile-2up
-          allPosts.slice(0, 6).map((post) => {
-            return (
-              <MoreTile
-                title={post.frontmatter.title}
-                href={post.url}
-                date={post.frontmatter.pubDate}
-                tags={post.frontmatter.tags}
-                cover={post.frontmatter.cover.url}
-              />
-            )
-          })
-        }
+            allPosts.slice(12, 18).map((post) => {
+              return (
+                <MoreTile
+                  title={post.frontmatter.title}
+                  href={post.url}
+                  date={post.frontmatter.pubDate}
+                  tags={post.frontmatter.tags}
+                  cover={post.frontmatter.cover.url}
+                />
+              )
+            })
+          }
           {
-          Blogs.slice(1, 7).map((post) => {
-            return (
-              <MoreTile
-                title={post.frontmatter.title}
-                href={post.url}
-                date={post.frontmatter.pubDate}
-                tags={post.frontmatter.tags}
-              />
-            )
-          })
-        }
+            Blogs.slice(0, 4).map((post) => {
+              return (
+                <MoreTile
+                  title={post.frontmatter.title}
+                  href={post.url}
+                  date={post.frontmatter.pubDate}
+                  tags={post.frontmatter.tags}
+                />
+              )
+            })
+          }
         </ul>
         <div class="view-archive-wrapper">
           <a
diff --git a/src/pages/posts/blogs/test.md b/src/pages/posts/blogs/test.md
deleted file mode 100644
index db142a4..0000000
--- a/src/pages/posts/blogs/test.md
+++ /dev/null
@@ -1,11 +0,0 @@
----
-layout: "../../../layouts/MarkdownPost.astro"
-title: "My Markdown page"
-cover:
-  url: "https://example.com/image.jpg"
-tags: ["markdown", "example"]
----
-
-# Title
-
-This is my page, written in **Markdown.**
diff --git a/src/pages/posts/影留宁理2024.md b/src/pages/posts/影留宁理2024.md
index 18a5c63..77f58ae 100644
--- a/src/pages/posts/影留宁理2024.md
+++ b/src/pages/posts/影留宁理2024.md
@@ -25,6 +25,6 @@ featured: true
 
 本次活动是计算机第一次尝试这种新的活动形式，虽然经过充分的策划和安排，实际活动的过程仍然遇到困难。但是这一次活动的举办，依旧具有意义。本次活动中拍摄大约50多组照片，打印约有100多张照片。当照片从打印机出来的那一刻，在毕业氛围的烘托下，纪念意义具象化。
 
-![交付流程](https://oss.nbtca.space/blog/clas/YQL05421-b4F8qj.jpg)
+我们在活动时间内不仅有固定摊位的拍摄，同时也有流动拍摄，希望我们的拍摄活动可以为毕业的学长学姐留下独属于他们自己的记忆。
 
-我们在活动时间内不仅有固定摊位的拍摄，同时也有流动拍摄，希望我们的拍摄活动可以为毕业的学长学姐留下独属于他们自己的记忆。
\ No newline at end of file
+![交付流程](https://oss.nbtca.space/blog/clas/YQL05421-b4F8qj.jpg)