chore(site): update site

Author: xiejay97

packages/site/src/app/components/layout/Layout.tsx

@@ -16,7 +16,7 @@ export function AppLayout() {
   return (
     <>
       <AppHeader aMenuOpen={menuOpen} onMenuOpenChange={setMenuOpen} />
-      {location.pathname !== '/' && <AppSidebar aMenuOpen={menuOpen} onMenuOpenChange={setMenuOpen} />}
+      <AppSidebar aMenuOpen={menuOpen} onMenuOpenChange={setMenuOpen} />
     </>
   );
 }

packages/site/src/app/components/layout/header/Header.scss

@@ -111,10 +111,6 @@
       inset: 0;
       content: '';
     }
-
-    &.disabled {
-      pointer-events: none;
-    }
   }
 }
 

packages/site/src/app/components/layout/header/Header.tsx

@@ -62,20 +62,12 @@ export function AppHeader(props: { aMenuOpen: boolean; onMenuOpenChange: (open:
           dList={[
             {
               id: 'docs',
-              title: (
-                <Link className={activeId === 'docs' ? 'disabled' : undefined} to="/docs">
-                  {t('Docs')}
-                </Link>
-              ),
+              title: <Link to="/docs">{t('Docs')}</Link>,
               type: 'item',
             },
             {
               id: 'components',
-              title: (
-                <Link className={activeId === 'components' ? 'disabled' : undefined} to="/components">
-                  {t('Components')}
-                </Link>
-              ),
+              title: <Link to="/components">{t('Components')}</Link>,
               type: 'item',
             },
           ]}

packages/site/src/app/components/layout/sidebar/Sidebar.scss

@@ -54,6 +54,14 @@
   }
 }
 
+.app-sidebar__header-link {
+  display: flex;
+  align-items: center;
+  font: inherit;
+  color: inherit;
+  text-decoration: none;
+}
+
 .app-sidebar__link-button {
   display: flex;
   gap: 0 4px;
@@ -67,4 +75,8 @@
   border: 1px solid var(--d-color-border);
   /* stylelint-disable-next-line declaration-property-value-allowed-list */
   border-radius: 10px;
+
+  & + & {
+    margin-top: 12px;
+  }
 }

packages/site/src/app/components/layout/sidebar/Sidebar.tsx

@@ -74,25 +74,33 @@ export function AppSidebar(props: { aMenuOpen: boolean; onMenuOpenChange: (open:
   const mediaMatch = useMediaMatch();
 
   return mediaMatch.includes('md') ? (
-    <div className="app-sidebar">{menuNode}</div>
+    page ? (
+      <div className="app-sidebar">{menuNode}</div>
+    ) : null
   ) : (
     <DDrawer
       className="app-sidebar__drawer"
       dVisible={aMenuOpen}
       dHeader={
         <DDrawer.Header>
-          <img className="app-sidebar__logo" src="/assets/logo.svg" alt="Logo" width="24" height="24" />
-          <span className="app-sidebar__title">{page}</span>
+          <Link className="app-sidebar__header-link" to="/">
+            <img className="app-sidebar__logo" src="/assets/logo.svg" alt="Logo" width="24" height="24" />
+            <span className="app-sidebar__title">DevUI</span>
+          </Link>
         </DDrawer.Header>
       }
       dWidth={280}
       onVisibleChange={onMenuOpenChange}
     >
-      <Link className="app-sidebar__link-button" to={page === 'Docs' ? '/components/Button' : '/docs/Overview'}>
-        {page === 'Docs' ? <AppstoreOutlined /> : <BookOutlined />}
-        {t(page === 'Docs' ? 'Components' : 'Docs')}
+      <Link className="app-sidebar__link-button" to="/docs">
+        <BookOutlined />
+        {t('Docs')}
       </Link>
-      {menuNode}
+      <Link className="app-sidebar__link-button" to="/components">
+        <AppstoreOutlined />
+        {t('Components')}
+      </Link>
+      {page && menuNode}
     </DDrawer>
   );
 }