From 2eaa47697f56df993305e65add42aa0126a4699f Mon Sep 17 00:00:00 2001
From: Zihua Li <i@zihua.li>
Date: Tue, 9 Jan 2024 23:55:02 +0800
Subject: [PATCH] Fix navigation menu styles

---
 packages/website/src/components/Default.jsx         | 5 +++--
 packages/website/src/components/Default.module.scss | 5 +++++
 packages/website/static/assets/css/styles.css       | 6 +++---
 3 files changed, 11 insertions(+), 5 deletions(-)
 create mode 100644 packages/website/src/components/Default.module.scss

diff --git a/packages/website/src/components/Default.jsx b/packages/website/src/components/Default.jsx
index 3c5b89d7a9..2738937f22 100644
--- a/packages/website/src/components/Default.jsx
+++ b/packages/website/src/components/Default.jsx
@@ -4,6 +4,7 @@ import { useState } from 'react';
 import Helmet from 'react-helmet';
 import LogoIcon from '../svg/logo.svg';
 import GitHub from './GitHub';
+import * as styles from './Default.module.scss';
 
 const Default = ({ children, pageType }) => {
   const [isNavOpen, setIsNavOpen] = useState(false);
@@ -50,7 +51,7 @@ const Default = ({ children, pageType }) => {
                 Blog
               </a>
             </li>
-            <li className="navbar-item">
+            <li className={classNames('navbar-item', styles.githubMenuItem)}>
               <GitHub dark />
             </li>
           </ul>
@@ -99,7 +100,7 @@ const Default = ({ children, pageType }) => {
                 Blog
               </a>
             </li>
-            <li className="navbar-link">
+            <li className="download-item">
               <a className="action" href="/docs/download/">
                 Download
               </a>
diff --git a/packages/website/src/components/Default.module.scss b/packages/website/src/components/Default.module.scss
new file mode 100644
index 0000000000..219f214d67
--- /dev/null
+++ b/packages/website/src/components/Default.module.scss
@@ -0,0 +1,5 @@
+.githubMenuItem {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
diff --git a/packages/website/static/assets/css/styles.css b/packages/website/static/assets/css/styles.css
index 1f82e2bdcc..8be358d96d 100644
--- a/packages/website/static/assets/css/styles.css
+++ b/packages/website/static/assets/css/styles.css
@@ -309,7 +309,7 @@ header:not(.home) .logo path {
   list-style: none;
   padding: 5em 0 1em;
   position: absolute;
-  transition: margin-bottom 1s ease-out 0s;
+  transition: margin-bottom 0.4s ease-out 0s;
   width: 100%;
   z-index: 10;
 }
@@ -1270,8 +1270,8 @@ body:not(.home) .navbar-link:before {
     display: inline-block;
   }
   .navbar-drop.active {
-    margin-bottom: -25em;
-    transition: margin-bottom 1s ease-out 0s;
+    margin-bottom: -22em;
+    transition: margin-bottom 0.4s ease-out 0s;
   }
   .navbar-list .navbar-item,
   .navbar-list .download-item {