🏗️ Cleanup / refactoring

Author: chanjunren

www/src/components/common/PrimaryHeader.tsx

@@ -1,6 +1,6 @@
 import { ReactElement } from "react";
-import ProjectGallery from "@site/src/components/projects/ProjectGallery";
-import CustomTag from "@site/src/components/ui/CustomTag";
+import ProjectGallery from "@site/src/components/projects/project-gallery";
+import CustomTag from "@site/src/components/ui/custom-tag";
 
 export default function Gallery(): ReactElement {
   return (

www/src/components/experiment/HomeImage.tsx

@@ -7,9 +7,8 @@ import skatingPreview from "@site/static/images/skating.webp";
 import snowboardingPreview from "@site/static/images/snowboarding.webp";
 
 import { FC, useEffect, useRef, useState } from "react";
-import PrimaryHeader from "../common/PrimaryHeader";
-import TypewriterText from "../common/TypewriterText";
-import CustomTag from "../ui/CustomTag";
+import TypewriterText from "@site/src/components/ui/typewriter-text";
+import CustomTag from "@site/src/components/ui/custom-tag";
 
 type HobbyCardProps = {
   label: string;
@@ -41,7 +40,7 @@ const HobbyCard: FC<HobbyCardProps> = ({
 
   return (
     <div
-      className={`cursor-pointer relative ${size === "lg" && "h-44"} ${
+      className={`cursor-pointer relative ${size === "lg" && "md:h-44 h-36"} ${
         size === "md" && "h-36"
       }`}
       onClick={() => setPlaying(true)}
@@ -84,9 +83,9 @@ const Hobbies: FC = () => {
       >
         HOBBIES
       </CustomTag>
-      <div className="flex gap-5">
+      <div className="flex gap-5 flex-col md:flex-row">
         <HobbyCard
-          size="lg"
+          size={"lg"}
           label="skating"
           mediaUrl={skatingVideo}
           preview={skatingPreview}

www/src/components/experiment/QuoteMeaning.tsx

@@ -1,5 +1,5 @@
-import MiniSection from "../common/MiniSection";
-import CustomTag from "../ui/CustomTag";
+import MiniSection from "@site/src/components/ui/mini-section";
+import CustomTag from "@site/src/components/ui/custom-tag";
 
 export default function Work() {
   return (
@@ -8,7 +8,7 @@ export default function Work() {
         color="foam"
         className="text-lg tracking-tighter! justify-self-center! mb-5"
       >
-        WORK | EDUCATION
+        EXPERIENCE
       </CustomTag>
       <MiniSection
         title="Software Engineer II @ OKX"

www/src/components/experiment/Welcome.tsx

@@ -0,0 +1,38 @@
+import { useWindowSize } from "@docusaurus/theme-common";
+import { useNavbarMobileSidebar } from "@docusaurus/theme-common/internal";
+import { HamburgerMenuIcon } from "@radix-ui/react-icons";
+
+import { Link } from "@site/src/components/ui/link";
+import { NavigationMenuItem } from "@site/src/components/ui/navigation-menu";
+import { FC } from "react";
+
+const ZETTELKASTEN = "zettelkasten";
+
+const NavbarExtras: FC = () => {
+  const windowSize = useWindowSize();
+  const path = window.location.pathname;
+  const isMobile = windowSize === "mobile";
+  const isZett = path.endsWith(ZETTELKASTEN);
+  const mobileSidebar = useNavbarMobileSidebar();
+
+  return (
+    <>
+      {isMobile && isZett && (
+        <NavigationMenuItem className="flex gap-2 items-center cursor-alias pr-3">
+          <HamburgerMenuIcon onClick={mobileSidebar.toggle} />
+        </NavigationMenuItem>
+      )}
+      <NavigationMenuItem className="flex gap-2 items-center cursor-alias pr-3">
+        <Link
+          variant="menu"
+          href="/"
+          className={"text-lg tracking-tight hover:bg-transparent! text-nowrap"}
+        >
+          陈俊任
+        </Link>
+      </NavigationMenuItem>
+    </>
+  );
+};
+
+export default NavbarExtras;