chore: home

nofwl · Nov 11, 2023 · 0f4f678 · 0f4f678
1 parent 479c829
commit 0f4f678
Show file tree

Hide file tree

Showing 2 changed files with 64 additions and 16 deletions.
diff --git a/src/pages/index.scss b/src/pages/index.scss
@@ -9,21 +9,54 @@ body, #___gatsby {
 }
 
 main {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  height: 100vh;
-  flex-direction: column;
-
-  font-size: 20px;
-  font-weight: bold;
+  padding: 80px 20px;
 
-  img {
+  .logo {
     box-shadow: 0 0 10px rgba(160, 180, 210, 0.2);
   }
 
-  a, span {
-    margin-top: 10px;
-    color: #475569;
+  .info, .open-source {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    flex-direction: column;
+    width: 100%;
+  }
+
+  .info {
+    a, span {
+      font-size: 18px;
+      font-weight: bold;
+      margin-top: 10px;
+      color: #475569;
+    }
   }
+
+  .open-source {
+    text-align: left;
+    margin-top: 80px;
+
+    h3 {
+      width: 80%;
+      margin: 0;
+      color: #475569;
+    }
+
+    ul {
+      width: 80%;
+      margin: 5px 0;
+
+      li {
+        padding: 5px 0;
+        color: #755964;
+
+        a {
+          margin-right: 10px;
+          color: #475569;
+          font-weight: 500;
+        }
+      }
+    }
+  }
+
 }
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
@@ -6,10 +6,25 @@ import './index.scss';
 const IndexPage: React.FC<PageProps> = () => {
   return (
     <main>
-      <img style={{ width: 160, borderRadius: 120 }} src={require('../images/icon.png').default} />
-      <a href="//github.com/lencx">GitHub</a>
-      <a href="//www.producthunt.com/@lencx">Product Hunt</a>
-      <span>公众号：浮之静</span>
+      <img className="logo" style={{ width: 160, borderRadius: 120 }} src={require('../images/icon.png').default} />
+      <div className="info">
+        <a href="//github.com/lencx">GitHub</a>
+        <a href="//www.producthunt.com/@lencx">Product Hunt</a>
+        <span>公众号：浮之静</span>
+      </div>
+      <div className="open-source">
+        <h3>Project:</h3>
+        <ul>
+          <li>
+            <a href="//github.com/lencx/ChatGPT" target="_blank">ChatGPT:</a>
+            ChatGPT Desktop Application (Mac, Windows and Linux)
+          </li>
+          <li>
+            <a href="//github.com/lencx/GPTHub" target="_blank">GPTHub:</a>
+            Discover the Best in Custom GPT at OpenAI's GPT Store – Your Adventure Begins Here!
+          </li>
+        </ul>
+      </div>
     </main>
   )
 }