feat: add support entry (#87)

* feat: add support entry * style tuning * feat: update support link --------- Co-authored-by: vvvvvv1vvvvvv <[email protected]>
RabbyHub · Dec 17, 2024 · 7b05408 · 7b05408
1 parent 7599cc5
commit 7b05408
Show file tree

Hide file tree

Showing 3 changed files with 33 additions and 61 deletions.
diff --git a/src/components/ContactUs/index.tsx b/src/components/ContactUs/index.tsx
@@ -11,15 +11,11 @@ const followUsList = [
     logo: "/assets/contact/github.svg",
     link: "https://github.com/RabbyHub/Rabby",
   },
-  {
-    logo: "/assets/contact/medium.svg",
-    link: "https://medium.com/@rabby_io",
-  },
 ];
 
 const ContactUs = () => {
   return (
-    <div className="contact-us">
+    <div className="contact-us" id="contact-us">
       <h2 className="title">Contact Us</h2>
       <div className="card">
         <div className="email-box">
@@ -33,6 +29,14 @@ const ContactUs = () => {
               Business: <a href="mailto:[email protected]">[email protected]</a>
             </div>
           </div>
+          <a
+            className="dm"
+            href="https://debank.com/hi/0a110032"
+            target="_blank"
+            rel="noreferrer"
+          >
+            Direct Message with Rabby Official
+          </a>
         </div>
         <div>
           <h3 className="sub-title">Follow Us</h3>

diff --git a/src/components/Header.jsx b/src/components/Header.jsx
@@ -67,59 +67,13 @@ const Header = ({ chains }) => {
           <i></i>
         </a>
         <ul className={clsx("menu", { show: isExpand })}>
-          {/* <li>
-            <a
-              href="/chain-dashboard"
-              target="_blank"
-              rel="noreferrer"
-            >
-              Chain Dashboard
-            </a>
-          </li> */}
           <li>
-            <a
-              href="https://twitter.com/Rabby_io"
-              target="_blank"
-              rel="noreferrer"
-            >
-              Twitter (X)
-            </a>
-          </li>
-          {/* <li>
-            <a
-              href="https://medium.com/@rabby_io"
-              target="_blank"
-              rel="noreferrer"
-            >
-              Medium
-            </a>
-          </li> */}
-          {/* <li>
-            <a href="https://t.me/rabby_io" target="_blank" rel="noreferrer">
-              Telegram
-            </a>
-          </li> */}
-          <li>
-            <a
-              href="https://discord.gg/seFBCWmUre"
-              target="_blank"
-              rel="noreferrer"
-            >
-              Discord
-            </a>
-          </li>
-          <li>
-            <a
-              href="https://github.com/RabbyHub/Rabby"
-              target="_blank"
-              rel="noreferrer"
-            >
-              GitHub
-            </a>
+            <a href="#contact-us">Contact Us</a>
           </li>
+
           <li>
-            <a href="mailto:support@rabby.io" target="_blank" rel="noreferrer">
-              Email
+            <a href="https://support.rabby.io" target="_blank" rel="noreferrer">
+              Support
             </a>
           </li>
           <li>

diff --git a/src/index.css b/src/index.css
@@ -7,6 +7,7 @@
 html {
   background-color: #fafbfc;
   font-family: "Lato", sans-serif;
+  scroll-behavior: smooth;
 }
 
 body {
@@ -872,6 +873,12 @@ footer .right .footer-links a:nth-last-child(1)::after {
   padding: 30px 32px;
 }
 
+.contact-us .card .email-box a {
+  color: var(--r-blue-default, #7084ff);
+  text-decoration: none;
+  font-size: 15px;
+}
+
 .contact-us .card .sub-title {
   color: var(--r-neutral-title1, #192945);
   font-size: 18px;
@@ -885,18 +892,20 @@ footer .right .footer-links a:nth-last-child(1)::after {
   margin-right: 80px;
 }
 
+.contact-us .card .email-box .dm {
+  margin-top: 20px;
+  display: inline-block;
+}
+
 .contact-us .card .email {
   display: flex;
   flex-wrap: wrap;
   color: var(--r-neutral-body, #3e495e);
-  font-size: 14px;
+  font-size: 15px;
   font-style: normal;
   font-weight: 400;
   line-height: normal;
   gap: 32px;
-  a {
-    color: var(--r-blue-default, #7084ff);
-  }
 }
 
 .contact-us .card .email a {
@@ -1252,7 +1261,7 @@ footer .right .footer-links a:nth-last-child(1)::after {
     padding-bottom: 30px;
   }
   .contact-us .card .email {
-    margin-bottom: 28px;
+    /* margin-bottom: 28px; */
   }
 
   .contact-us .card .sub-title {
@@ -1326,9 +1335,14 @@ footer .right .footer-links a:nth-last-child(1)::after {
     margin-bottom: 12px;
   }
   .contact-us .card .email {
-    font-size: 12px;
     font-weight: 400;
     gap: 12px;
+  }
+  .contact-us .card .email-box {
+    font-size: 12px;
+  }
+  .contact-us .card .email-box .dm {
+    margin-top: 12px;
     margin-bottom: 20px;
   }
   .contact-us .card .follow-us {