From 5903e98a67549e9ece43b1c54a0960fb6656bdc8 Mon Sep 17 00:00:00 2001
From: LazuliKao <LazuliKao233@outlook.com>
Date: Fri, 12 Apr 2024 22:45:19 +0800
Subject: [PATCH] update join-us

---
 src/pages/join-us.astro | 55 ++++++++++++++++++++++++++++++++++++++---
 1 file changed, 51 insertions(+), 4 deletions(-)

diff --git a/src/pages/join-us.astro b/src/pages/join-us.astro
index 8862757..06ccebb 100644
--- a/src/pages/join-us.astro
+++ b/src/pages/join-us.astro
@@ -10,8 +10,7 @@ import BaseLayout from "../layouts/BaseLayout.astro";
         class="t-hero-headline-oversized-span"
         aria-label="加入我们，共同创造我们的社区。"
       >
-        <span class="gradient-warm">加入我们，</span>
-        <span class="gradient-warm">共同创造我们的社区。</span>
+        <span class="gradient-warm">加入我们，共同创造我们的社区。</span>
       </span>
     </p>
     <div class="body-container">
@@ -19,11 +18,19 @@ import BaseLayout from "../layouts/BaseLayout.astro";
         探索我们的资源和文化：这里有丰富的资源和注重包容、成长和独创性的协作文化，助你缔造精彩人生。
       </p>
     </div>
+    <div class="learn-more-link-container">
+      <a
+        href="/careers/cn/life-at-apple.html"
+        class="learn-more-link"
+        aria-label="进一步了解 NBTCA 的社区和文化">了解在 NBTCA 生活</a
+      >
+      <a class="learn-more-link-after">&gt; </a>
+    </div>
   </div>
 </BaseLayout>
 
 <style>
-  @media screen and (min-width: 768px) {
+  @media screen and (min-width: 680px) {
     /*PC*/
     .container {
       width: 682px;
@@ -63,7 +70,7 @@ import BaseLayout from "../layouts/BaseLayout.astro";
       -webkit-background-clip: text;
     }
   }
-  @media screen and (max-width: 768px) {
+  @media screen and (max-width: 680px) {
     /*Mobile*/
     .gradient-warm {
       -webkit-text-size-adjust: 100%;
@@ -252,4 +259,44 @@ import BaseLayout from "../layouts/BaseLayout.astro";
     background-size: 200% 100%;
     -webkit-background-clip: text;
   }
+
+  .learn-more-link-after {
+    content: ">";
+    margin-left: 2.5px;
+    font-size: 20px;
+    transform: scaleX(0.5);
+    text-decoration: none;
+  }
+  .learn-more-link {
+    -webkit-text-size-adjust: 100%;
+    --r-globalmessage-segment-height: 0px;
+    --r-globalnav-segmentbar-height: 0px;
+    --r-globalnav-height: 48px;
+    --r-globalnav-background-opened: #fafafc;
+    --r-globalnav-background-opened-dark: #161617;
+    --sk-focus-color: #0071e3;
+    --sk-focus-color-alt: rgb(0, 0, 0);
+    --sk-focus-offset: 1px;
+    --sk-focus-offset-container: 3px;
+    font-synthesis: none;
+    text-rendering: optimizeLegibility;
+    -webkit-font-smoothing: antialiased;
+    direction: ltr;
+    --body-container-width: 645px;
+    text-align: center;
+    font-family: "SF Pro SC", "SF Pro Text", "SF Pro Icons", "PingFang SC",
+      "Helvetica Neue", "Helvetica", "Arial", sans-serif !important;
+    quotes: "“" "”";
+    font-style: normal;
+    color: #0070c9;
+    font-size: 20px;
+    line-height: 1.2;
+    font-weight: 400;
+    letter-spacing: 0;
+  }
+  .learn-more-link-container {
+    display: flex;
+    justify-content: center;
+    height: 100px;
+  }
 </style>