diff --git a/apps/web/public/icon/drizzle-light.svg b/apps/web/public/icon/drizzle-light.svg new file mode 100644 index 0000000..1d7ced1 --- /dev/null +++ b/apps/web/public/icon/drizzle-light.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/apps/web/public/icon/express-light.svg b/apps/web/public/icon/express-light.svg new file mode 100644 index 0000000..4dc0362 --- /dev/null +++ b/apps/web/public/icon/express-light.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/apps/web/public/icon/prisma-light.svg b/apps/web/public/icon/prisma-light.svg new file mode 100644 index 0000000..3210efa --- /dev/null +++ b/apps/web/public/icon/prisma-light.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/apps/web/public/logo.svg b/apps/web/public/logo.svg new file mode 100644 index 0000000..f818abc --- /dev/null +++ b/apps/web/public/logo.svg @@ -0,0 +1,5 @@ + + + + $_ + diff --git a/apps/web/src/app/(home)/_components/code-container.tsx b/apps/web/src/app/(home)/_components/code-container.tsx index a79956c..1c9f98d 100644 --- a/apps/web/src/app/(home)/_components/code-container.tsx +++ b/apps/web/src/app/(home)/_components/code-container.tsx @@ -53,7 +53,7 @@ const CodeContainer = () => { const packageManagers: Array<"npm" | "pnpm" | "bun"> = ["bun", "pnpm", "npm"]; return ( -
+
diff --git a/apps/web/src/app/(home)/_components/navbar.tsx b/apps/web/src/app/(home)/_components/navbar.tsx index 2fe9e8b..f75df39 100644 --- a/apps/web/src/app/(home)/_components/navbar.tsx +++ b/apps/web/src/app/(home)/_components/navbar.tsx @@ -3,6 +3,7 @@ import { ThemeToggle } from "@/components/theme-toggle"; import { cn } from "@/lib/utils"; import { Github, Maximize2, Menu, X } from "lucide-react"; import { AnimatePresence, motion } from "motion/react"; +import Image from "next/image"; import Link from "next/link"; import { useEffect, useState } from "react"; import PackageIcon from "./icons"; @@ -93,11 +94,13 @@ export default function Navbar() { >
-
- - $_ - -
+ Better-T Stack Better-T Stack diff --git a/apps/web/src/app/(home)/_components/stack-builder.tsx b/apps/web/src/app/(home)/_components/stack-builder.tsx index 432f3b3..621035d 100644 --- a/apps/web/src/app/(home)/_components/stack-builder.tsx +++ b/apps/web/src/app/(home)/_components/stack-builder.tsx @@ -31,6 +31,7 @@ import { Terminal, } from "lucide-react"; import { motion } from "motion/react"; +import { useTheme } from "next-themes"; import Image from "next/image"; import Link from "next/link"; import { useQueryStates } from "nuqs"; @@ -152,7 +153,23 @@ const TechIcon: React.FC<{ name: string; className?: string; }> = ({ icon, name, className }) => { - if (icon.startsWith("/icon/")) { + const [mounted, setMounted] = useState(false); + const { theme } = useTheme(); + + useEffect(() => { + setMounted(true); + }, []); + + if (mounted && icon.startsWith("/icon/")) { + if ( + theme === "light" && + (icon.includes("drizzle") || + icon.includes("prisma") || + icon.includes("express")) + ) { + icon = icon.replace(".svg", "-light.svg"); + } + return (