From 780fd0ccd4938c440136bbc9624c9f179bf5cea0 Mon Sep 17 00:00:00 2001
From: overcast404 <overcast404@163.com>
Date: Sat, 2 Mar 2024 09:27:45 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=A0=B7=E5=BC=8F=E3=80=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.vue | 78 ++++++++++++++++++++++++++++++++++++++++++-----------
 1 file changed, 63 insertions(+), 15 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index e754816..fe94990 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -7,7 +7,7 @@ const BeianLink = "https://beian.miit.gov.cn/";
 const data = reactive({
   titleList: [
     "给时光以生命<br/>给岁月以文明",
-    "人生如宇宙<br/>虽深邃未知<br/>但星辰闪烁寓意希望"
+    "人生如宇宙<br/>虽深邃未知<br/>但星辰闪烁寓意希望",
   ],
   navLinks: [
     {
@@ -62,7 +62,7 @@ const data = reactive({
     {
       name: "Gitea",
       description: "代码仓库",
-      link: "https://gitea.ocer.cc",
+      link: "https://gitea.ocer.cc/explore/repos",
     },
     {
       name: "more",
@@ -120,11 +120,18 @@ onMounted(() => {
   </nav> -->
 
   <!-- 主体 -->
-  <main bg-transparent absolute w-full top-75vh z-10>
+  <main bg-transparent absolute w-full z-10 id="main">
     <!-- 大标题 -->
-    <section ml-15vw absolute>
-      <div text-10 text-white font-bold tracking-widest v-html="data.titleList[Math.floor(Math.random() * data.titleList.length)]
-        " />
+    <section ml-10vw absolute>
+      <div
+        text-10
+        text-white
+        font-bold
+        tracking-widest
+        v-html="
+          data.titleList[Math.floor(Math.random() * data.titleList.length)]
+        "
+      />
       <div flex items-center>
         <div mr-4 flex gap-2>
           <div bg-red rounded-full h-3 w-3 />
@@ -144,7 +151,9 @@ onMounted(() => {
         <div class="text-white/90">
           <p leading-10>一个浪漫现实主义作家</p>
           <p text-6 leading-10>我始终在创作一本名为《<b>人生</b>》的书</p>
-          <p text-7 leading-10><b>科技</b>、<b>音乐</b>、<b>哲学</b>是书中的主旋律</p>
+          <p text-7 leading-10>
+            <b>科技</b>、<b>音乐</b>、<b>哲学</b>是书中的主旋律
+          </p>
           <p text-6 leading-10>
             <b>浪漫</b>、<b>可爱</b>、<b>阳光</b>是我最喜欢的形容词
           </p>
@@ -154,16 +163,41 @@ onMounted(() => {
           <p leading-10>或许是一段新旅途的开始......</p>
         </div>
 
-        <img hidden rounded-full h-25 w-25 transition md:block hover:-translate-y--2
-          src="https://img.ocer.cc/images/2024/02/24/3cH8.th.jpeg" alt="avatar" />
+        <img
+          hidden
+          rounded-full
+          h-25
+          w-25
+          transition
+          md:block
+          hover:-translate-y--2
+          src="https://img.ocer.cc/images/2024/02/24/3cH8.th.jpeg"
+          alt="avatar"
+        />
       </div>
       <!-- <div text-bold mb-2 ml-10 text-8 text-white>Projects</div> -->
       <!-- <div mb-10 flex flex-wrap justify-between> -->
-      <div mb-10 flex flex-wrap >
-        <div v-for="(item, index) in data.myProjects" :key="index" mx-10 my-4 class="basis-3/4 md:basis-1/6">
+      <div mb-10 flex flex-wrap>
+        <div
+          v-for="(item, index) in data.myProjects"
+          :key="index"
+          mx-10
+          my-4
+          class="basis-3/4 md:basis-1/6"
+        >
           <a :href="item.link" target="_blank">
-            <div class="bg-white/5 hover:bg-white/10" p-2 rounded-lg shadow-md flex-col transition backdrop-blur-3xl
-              backdrop-opacity-60 hover:backdrop-opacity-100 hover:-translate-y-2>
+            <div
+              class="bg-white/5 hover:bg-white/10"
+              p-2
+              rounded-lg
+              shadow-md
+              flex-col
+              transition
+              backdrop-blur-3xl
+              backdrop-opacity-60
+              hover:backdrop-opacity-100
+              hover:-translate-y-2
+            >
               <div text-bold opacity-75 text-white>
                 {{ item.name }}
               </div>
@@ -216,7 +250,9 @@ onMounted(() => {
         <i i-ant-design-environment-outlined ml-1 />
       </div>
       <div class="text-white/60" mt-2 f-c-c gap-4>
-        <a target="_blank" class="text-white/60" :href="BeianLink">浙ICP备2024066515号</a>
+        <a target="_blank" class="text-white/60" :href="BeianLink"
+          >浙ICP备2024066515号</a
+        >
         <div>©2024 吴阴天</div>
       </div>
     </footer>
@@ -225,7 +261,16 @@ onMounted(() => {
   <!-- 背景 -->
   <div id="background" absolute wh-full left-0 top-0 z-0>
     <!-- 渐变阴影 -->
-    <div to-black-500 absolute h-80vh w-full bottom--30vh left-0 from-black bg-gradient-to-t />
+    <div
+      to-black-500
+      absolute
+      h-80vh
+      w-full
+      bottom--30vh
+      left-0
+      from-black
+      bg-gradient-to-t
+    />
     <!-- 星轨背景 -->
     <StarTrails pb-45vh bg-black />
   </div>
@@ -236,4 +281,7 @@ onMounted(() => {
   position: fixed;
   top: -70%;
 }
+#main {
+  top: calc(100vh - 368px);
+}
 </style>