From 9a9bb2df2c4bd7684dc7fe0fb0a7ae2151649102 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=9F=B3=E7=A5=9E?= <3162475700@qq.com>
Date: Fri, 27 Sep 2024 23:23:51 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=A6=8A=E5=8E=BB=E9=99=A4=E6=B8=90?=
 =?UTF-8?q?=E5=8F=98=E8=89=B2=EF=BC=8C=E6=94=B9=E7=94=A8=E8=83=8C=E6=99=AF?=
 =?UTF-8?q?=E5=9B=BE=E7=89=87=EF=BC=8C=E6=B7=BB=E5=8A=A0=E7=AE=AD=E5=A4=B4?=
 =?UTF-8?q?=E7=82=B9=E5=87=BB=E4=BA=8B=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 static/index.html | 21 ++++++++++++++++++---
 1 file changed, 18 insertions(+), 3 deletions(-)

diff --git a/static/index.html b/static/index.html
index 513ace6..8d6719a 100644
--- a/static/index.html
+++ b/static/index.html
@@ -11,6 +11,11 @@
 </head>
 <style>
     body {
+        background-image: url('https://i.p-i.vip/30/20240927-66f6cb77cbd1b.webp');
+        background-size: cover;
+        background-attachment: fixed;
+        background-repeat: no-repeat;
+        background-position: center;
         font-family: Arial, sans-serif;
         display: flex;
         flex-direction: column;
@@ -23,7 +28,7 @@
         height: fit-content;
     }
     .container {
-        background: linear-gradient(135deg, #ffdaaa, #abc2e7);
+        background: rgba(255, 255, 255, 0.8);
         display: flex;
         text-align: center;
         align-items: center;
@@ -36,6 +41,8 @@
     .root-container {
         width: 100%;
         margin-top: 40px;
+        max-width: 1100px;
+        padding: 40px;
     }
 
     .avatar {
@@ -121,12 +128,12 @@
         <img src="./favicon.ico" alt="Avatar" class="avatar">
         <p>Friend-Circle-Lite<br>服务已运行</p>
         <div class="button-container">
-            <a href="https://blog.liushen.fun/posts/4dc716ec/" class="button">查看文档</a>
+            <a href="https://blog.liushen.fun/posts/4dc716ec/" class="button" target="_blank">查看文档</a>
             <a href="/all.json" class="button">测试接口</a>
         </div>
         <a href="#" class="scroll-down-icon" id="scroll-down-button"></a>
     </div>
-    <div class="root-container" style="max-width: 1000px;">
+    <div class="root-container">
         <div id="friend-circle-lite-root"></div>
     </div>
 <script>
@@ -141,6 +148,14 @@
         }
     }
 </script>
+<script>
+    const scrollButton = document.getElementById('scroll-down-button');
+    const targetElement = document.getElementById('friend-circle-lite-root');
+    scrollButton.addEventListener('click', function(event) {
+        event.preventDefault();
+        targetElement.scrollIntoView({ behavior: 'smooth' });
+    });
+</script>
 <link rel="stylesheet" href="./main/fclite.css">
 <script src="./main/fclite.js"></script>
 </body>