franpcode/create-better-t-stack
1
0
Fork 0
mirror of https://github.com/FranP-code/create-better-t-stack.git synced 2025-10-12 23:52:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix fumadocs theme

Browse Source
This commit is contained in:
Aman Varshney
2025-04-24 10:32:24 +05:30
parent 60312877c6
commit a6c762d4f7
11 changed files with 605 additions and 770 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
apps/cli/package.json
View File

@@ -55,7 +55,7 @@
"dependencies": { "dependencies": {
"@clack/prompts": "^0.10.1", "@clack/prompts": "^0.10.1",
"consola": "^3.4.2", "consola": "^3.4.2",
"execa": "^8.0.1", "execa": "^9.5.2",
"fs-extra": "^11.3.0", "fs-extra": "^11.3.0",
"globby": "^14.1.0", "globby": "^14.1.0",
"gradient-string": "^3.0.0", "gradient-string": "^3.0.0",
@@ -66,7 +66,7 @@
"devDependencies": { "devDependencies": {
"@types/fs-extra": "^11.0.4", "@types/fs-extra": "^11.0.4",
"@types/globby": "^9.1.0", "@types/globby": "^9.1.0",
"@types/node": "^20.17.30", "@types/node": "^22.14.1",
"@types/yargs": "^17.0.33", "@types/yargs": "^17.0.33",
"tsup": "^8.4.0", "tsup": "^8.4.0",
"typescript": "^5.8.3" "typescript": "^5.8.3"

72
apps/web/components/features.tsx
View File

@@ -1,39 +1,39 @@
import { Cards, Card } from "fumadocs-ui/components/card"; import { Card, Cards } from "fumadocs-ui/components/card";
import { Database, Package, Lock, Globe, Server, Cable } from "lucide-react"; import { Cable, Database, Globe, Lock, Package, Server } from "lucide-react";
export default function Features() { export default function Features() {
return ( return (
<Cards> <Cards>
<Card <Card
icon={<Globe />} icon={<Globe />}
title='Frontend' title="Frontend"
description='Choose between Tanstack Router, React Router, Expo, Next.js, and more' description="Choose between Tanstack Router, React Router, Expo, Next.js, and more"
/> />
<Card <Card
icon={<Server />} icon={<Server />}
title='Flexible Backend' title="Flexible Backend"
description='Choose between Hono, Elysia, Next.js and Express' description="Choose between Hono, Elysia, Next.js and Express"
/> />
<Card <Card
icon={<Cable />} icon={<Cable />}
title='End to end typesafe APIs' title="End to end typesafe APIs"
description='With the help of tRPC or oRPC' description="With the help of tRPC or oRPC"
/> />
<Card <Card
icon={<Lock />} icon={<Lock />}
title='Authentication' title="Authentication"
description='With the help of Better Auth' description="With the help of Better Auth"
/> />
<Card <Card
icon={<Database />} icon={<Database />}
title='Database Setup' title="Database Setup"
description='Many ORMs and Relational Databases' description="Many ORMs and Relational Databases"
/> />
<Card <Card
icon={<Package />} icon={<Package />}
title='Addons' title="Addons"
description='Add PWA support, desktop apps, documentation, and more' description="Add PWA support, desktop apps, documentation, and more"
/> />
</Cards> </Cards>
); );
} }

3
apps/web/content/docs/meta.json Normal file
View File

@@ -0,0 +1,3 @@
{
"pages": ["---Getting Started---", "index"]
}

36
apps/web/package.json
View File

@@ -10,19 +10,19 @@
"postinstall": "fumadocs-mdx" "postinstall": "fumadocs-mdx"
}, },
"dependencies": { "dependencies": {
"@heroicons/react": "^2.2.0", "@radix-ui/react-scroll-area": "^1.2.6",
"@radix-ui/react-scroll-area": "^1.2.5",
"@radix-ui/react-switch": "^1.2.2", "@radix-ui/react-switch": "^1.2.2",
"@xyflow/react": "^12.5.5", "@radix-ui/react-tooltip": "^1.2.4",
"babel-plugin-react-compiler": "^19.0.0-beta-e993439-20250405", "@xyflow/react": "^12.6.0",
"babel-plugin-react-compiler": "^19.1.0-rc.1",
"class-variance-authority": "^0.7.1", "class-variance-authority": "^0.7.1",
"clsx": "^2.1.1", "clsx": "^2.1.1",
"fumadocs-core": "15.1.2", "fumadocs-core": "15.2.10",
"fumadocs-mdx": "11.5.7", "fumadocs-mdx": "11.6.1",
"fumadocs-ui": "15.1.2", "fumadocs-ui": "15.2.10",
"lucide-react": "^0.501.0", "lucide-react": "^0.503.0",
"motion": "^12.7.4", "motion": "^12.8.0",
"next": "15.2.3", "next": "15.3.1",
"nuqs": "^2.4.3", "nuqs": "^2.4.3",
"react": "^19.1.0", "react": "^19.1.0",
"react-dom": "^19.1.0", "react-dom": "^19.1.0",
@@ -30,16 +30,16 @@
"tailwind-merge": "^3.2.0" "tailwind-merge": "^3.2.0"
}, },
"devDependencies": { "devDependencies": {
"@tailwindcss/postcss": "^4.1.3", "@tailwindcss/postcss": "^4.1.4",
"@types/mdx": "^2.0.13", "@types/mdx": "^2.0.13",
"@types/node": "22.13.11", "@types/node": "22.14.1",
"@types/react": "^19.1.0", "@types/react": "^19.1.2",
"@types/react-dom": "^19.1.1", "@types/react-dom": "^19.1.2",
"eslint": "^9.24.0", "eslint": "^9.25.1",
"eslint-config-next": "15.2.3", "eslint-config-next": "15.3.1",
"postcss": "^8.5.3", "postcss": "^8.5.3",
"tailwindcss": "^4.1.3", "tailwindcss": "^4.1.4",
"tw-animate-css": "^1.0.0", "tw-animate-css": "^1.2.8",
"typescript": "^5.8.3" "typescript": "^5.8.3"
} }
} }

8
apps/web/source.config.ts
View File

@@ -1,11 +1,11 @@
import { defineConfig, defineDocs } from "fumadocs-mdx/config"; import { defineConfig, defineDocs } from "fumadocs-mdx/config";
export const docs = defineDocs({ export const docs = defineDocs({
dir: "content/docs", dir: "content/docs",
}); });
export default defineConfig({ export default defineConfig({
mdxOptions: { mdxOptions: {
// MDX options // MDX options
}, },
}); });

566
apps/web/src/app/(home)/_components/Navbar.tsx
View File

@@ -1,319 +1,319 @@
"use client"; "use client";
import { cn } from "@/lib/utils"; import { cn } from "@/lib/utils";
import { import {
BookMarked, BookMarked,
BookMarkedIcon, BookMarkedIcon,
Github, Github,
Maximize2, Maximize2,
Menu, Menu,
X, X,
} from "lucide-react"; } from "lucide-react";
import Link from "next/link"; import Link from "next/link";
import { useEffect, useRef, useState } from "react"; import { useEffect, useRef, useState } from "react";
import PackageIcon from "./Icons"; import PackageIcon from "./Icons";
const Navbar = () => { const Navbar = () => {
const [activeLink, setActiveLink] = useState("home"); const [activeLink, setActiveLink] = useState("home");
const [bgStyles, setBgStyles] = useState({}); const [bgStyles, setBgStyles] = useState({});
const [scrolled, setScrolled] = useState(false); const [scrolled, setScrolled] = useState(false);
const [mobileMenuOpen, setMobileMenuOpen] = useState(false); const [mobileMenuOpen, setMobileMenuOpen] = useState(false);
const linkRefs = useRef<{ [key: string]: HTMLAnchorElement | null }>({}); const linkRefs = useRef<{ [key: string]: HTMLAnchorElement | null }>({});
useEffect(() => { useEffect(() => {
const updateBackground = (linkId: string) => { const updateBackground = (linkId: string) => {
const linkElement = linkRefs.current[linkId]; const linkElement = linkRefs.current[linkId];
if (linkElement) { if (linkElement) {
setBgStyles({ setBgStyles({
padding: "0.75rem 0rem", padding: "0.75rem 0rem",
width: `${linkElement.clientWidth - 12}px`, width: `${linkElement.clientWidth - 12}px`,
transform: `translateX(${linkElement.offsetLeft}px)`, transform: `translateX(${linkElement.offsetLeft}px)`,
opacity: 1, opacity: 1,
}); });
} }
}; };
updateBackground(activeLink); updateBackground(activeLink);
const handleScroll = () => { const handleScroll = () => {
const isScrolled = window.scrollY > 50; const isScrolled = window.scrollY > 50;
setScrolled(isScrolled); setScrolled(isScrolled);
}; };
window.addEventListener("scroll", handleScroll); window.addEventListener("scroll", handleScroll);
window.addEventListener("resize", () => updateBackground(activeLink)); window.addEventListener("resize", () => updateBackground(activeLink));
return () => { return () => {
window.removeEventListener("scroll", handleScroll); window.removeEventListener("scroll", handleScroll);
window.removeEventListener("resize", () => updateBackground(activeLink)); window.removeEventListener("resize", () => updateBackground(activeLink));
}; };
}, [activeLink]); }, [activeLink]);
const toggleMobileMenu = () => { const toggleMobileMenu = () => {
setMobileMenuOpen(!mobileMenuOpen); setMobileMenuOpen(!mobileMenuOpen);
}; };
return ( return (
<> <>
<nav <nav
className={cn( className={cn(
"fixed top-0 z-[100] flex w-full items-center justify-between px-4 py-4 transition-all duration-300 sm:px-8", "fixed top-0 z-[100] flex w-full items-center justify-between px-4 py-4 transition-all duration-300 sm:px-8",
scrolled ? "bg-transparent" : "bg-background/80 backdrop-blur-xl" scrolled ? "bg-transparent" : "bg-background/80 backdrop-blur-xl",
)} )}
> >
<div <div
className={cn( className={cn(
"flex flex-row items-center space-x-3 transition-opacity duration-300", "flex flex-row items-center space-x-3 transition-opacity duration-300",
scrolled ? "opacity-0" : "opacity-100" scrolled ? "opacity-0" : "opacity-100",
)} )}
> >
<div className='flex h-4 w-4 items-center justify-center rounded-sm'> <div className="flex h-4 w-4 items-center justify-center rounded-sm">
<span className='text-md text-primary'>$_</span> <span className="text-md text-primary">$_</span>
</div> </div>
<span className='font-semibold text-foreground text-md'> <span className="font-semibold text-foreground text-md">
Better-T Stack Better-T Stack
</span> </span>
</div> </div>
<div className='-translate-x-1/2 absolute left-1/2 hidden transform md:block'> <div className="-translate-x-1/2 absolute left-1/2 hidden transform md:block">
<div <div
className={cn( className={cn(
"relative flex items-center rounded-lg border border-border bg-muted/90 px-1.5 py-1 text-sm backdrop-blur-sm transition-all duration-500 ease-out", "relative flex items-center rounded-lg border border-border bg-muted/90 px-1.5 py-1 text-sm backdrop-blur-sm transition-all duration-500 ease-out",
scrolled ? "w-[420px]" : "w-[313px]" scrolled ? "w-[420px]" : "w-[313px]",
)} )}
> >
<div <div
className='absolute rounded-md bg-background transition-all duration-200 ease-in-out' className="absolute rounded-md bg-background transition-all duration-200 ease-in-out"
style={bgStyles} style={bgStyles}
/> />
<Link <Link
href='/' href="/"
ref={(ref) => { ref={(ref) => {
linkRefs.current.home = ref; linkRefs.current.home = ref;
}} }}
onMouseOver={() => setActiveLink("home")} onMouseOver={() => setActiveLink("home")}
className='relative flex items-center gap-1 rounded-md px-4 py-2 font-mono text-muted-foreground transition-colors hover:text-primary' className="relative flex items-center gap-1 rounded-md px-4 py-2 font-mono text-muted-foreground transition-colors hover:text-primary"
> >
<span className='text-primary'>~/</span> <span className="text-primary">~/</span>
home home
</Link> </Link>
<Link <Link
href='https://my-better-t-app-client.pages.dev/' href="https://my-better-t-app-client.pages.dev/"
target='_blank' target="_blank"
ref={(ref) => { ref={(ref) => {
linkRefs.current.demo = ref; linkRefs.current.demo = ref;
}} }}
onMouseOver={() => setActiveLink("demo")} onMouseOver={() => setActiveLink("demo")}
onMouseLeave={() => setActiveLink("home")} onMouseLeave={() => setActiveLink("home")}
className='relative flex items-center gap-2 rounded-md px-4 py-2 font-mono text-muted-foreground transition-colors hover:text-primary' className="relative flex items-center gap-2 rounded-md px-4 py-2 font-mono text-muted-foreground transition-colors hover:text-primary"
> >
<span>demo</span> <span>demo</span>
</Link> </Link>
<Link <Link
href='/docs' href="/docs"
ref={(ref) => { ref={(ref) => {
linkRefs.current.docs = ref; linkRefs.current.docs = ref;
}} }}
onMouseOver={() => setActiveLink("docs")} onMouseOver={() => setActiveLink("docs")}
onMouseLeave={() => setActiveLink("home")} onMouseLeave={() => setActiveLink("home")}
className='relative flex items-center gap-2 rounded-md px-4 py-2 font-mono text-muted-foreground transition-colors hover:text-primary' className="relative flex items-center gap-2 rounded-md px-4 py-2 font-mono text-muted-foreground transition-colors hover:text-primary"
> >
<span>docs</span> <span>docs</span>
</Link> </Link>
<Link <Link
href='https://www.npmjs.com/package/create-better-t-stack' href="https://www.npmjs.com/package/create-better-t-stack"
target='_blank' target="_blank"
ref={(ref) => { ref={(ref) => {
linkRefs.current.npm = ref; linkRefs.current.npm = ref;
}} }}
onMouseOver={() => setActiveLink("npm")} onMouseOver={() => setActiveLink("npm")}
onMouseLeave={() => setActiveLink("home")} onMouseLeave={() => setActiveLink("home")}
className='relative flex items-center gap-2 rounded-md px-4 py-2 font-mono text-muted-foreground transition-colors hover:text-primary' className="relative flex items-center gap-2 rounded-md px-4 py-2 font-mono text-muted-foreground transition-colors hover:text-primary"
> >
<PackageIcon pm='npm' className='h-4 w-4 rounded-full' />{" "} <PackageIcon pm="npm" className="h-4 w-4 rounded-full" />{" "}
<span>npm</span> <span>npm</span>
</Link> </Link>
<Link <Link
href='https://www.github.com/better-t-stack/create-better-t-stack' href="https://www.github.com/better-t-stack/create-better-t-stack"
target='_blank' target="_blank"
ref={(ref) => { ref={(ref) => {
linkRefs.current.github = ref; linkRefs.current.github = ref;
}} }}
onMouseOver={() => setActiveLink("github")} onMouseOver={() => setActiveLink("github")}
onMouseLeave={() => setActiveLink("home")} onMouseLeave={() => setActiveLink("home")}
className={cn( className={cn(
"relative flex items-center gap-2 rounded-md px-4 py-2 font-mono text-muted-foreground transition-colors hover:text-primary", "relative flex items-center gap-2 rounded-md px-4 py-2 font-mono text-muted-foreground transition-colors hover:text-primary",
scrolled scrolled
? "translate-y-0 opacity-100" ? "translate-y-0 opacity-100"
: "pointer-events-none opacity-0" : "pointer-events-none opacity-0",
)} )}
> >
<Github className='size-4'> <Github className="size-4">
<title>GitHub</title> <title>GitHub</title>
</Github> </Github>
Github Github
</Link> </Link>
</div> </div>
</div> </div>
<div <div
className={cn( className={cn(
"hidden justify-end gap-2 transition-opacity duration-300 md:flex", "hidden justify-end gap-2 transition-opacity duration-300 md:flex",
scrolled ? "pointer-events-none opacity-0" : "opacity-100" scrolled ? "pointer-events-none opacity-0" : "opacity-100",
)} )}
> >
<Link <Link
href='/new' href="/new"
className='inline-flex items-center rounded-lg border border-primary/50 bg-primary/10 px-4 py-1 font-mono text-primary text-sm backdrop-blur-sm transition-colors hover:bg-primary/20' className="inline-flex items-center rounded-lg border border-primary/50 bg-primary/10 px-4 py-1 font-mono text-primary text-sm backdrop-blur-sm transition-colors hover:bg-primary/20"
> >
<Maximize2 className='mr-1 size-4' /> <Maximize2 className="mr-1 size-4" />
Stack Builder Stack Builder
</Link> </Link>
<Link <Link
href='https://www.github.com/better-t-stack/create-better-t-stack' href="https://www.github.com/better-t-stack/create-better-t-stack"
target='_blank' target="_blank"
className='inline-flex items-center rounded-lg border border-border bg-muted/90 px-4 py-1 font-mono text-muted-foreground text-sm backdrop-blur-sm transition-colors hover:bg-muted hover:text-primary' className="inline-flex items-center rounded-lg border border-border bg-muted/90 px-4 py-1 font-mono text-muted-foreground text-sm backdrop-blur-sm transition-colors hover:bg-muted hover:text-primary"
> >
<Github className='mr-1 size-4'> <Github className="mr-1 size-4">
<title>GitHub</title> <title>GitHub</title>
</Github> </Github>
Star on GitHub Star on GitHub
</Link> </Link>
</div> </div>
<button <button
type='button' type="button"
onClick={toggleMobileMenu} onClick={toggleMobileMenu}
className='flex items-center justify-center rounded-md p-2 text-foreground hover:bg-muted/50 focus:outline-none md:hidden' className="flex items-center justify-center rounded-md p-2 text-foreground hover:bg-muted/50 focus:outline-none md:hidden"
aria-expanded={mobileMenuOpen} aria-expanded={mobileMenuOpen}
> >
{mobileMenuOpen ? ( {mobileMenuOpen ? (
<X className='size-5' aria-hidden='true' /> <X className="size-5" aria-hidden="true" />
) : ( ) : (
<Menu className='size-5' aria-hidden='true' /> <Menu className="size-5" aria-hidden="true" />
)} )}
<span className='sr-only'>Toggle menu</span> <span className="sr-only">Toggle menu</span>
</button> </button>
</nav> </nav>
<div <div
className={cn( className={cn(
"fixed inset-0 z-[99] pt-16 backdrop-blur-md transition-all duration-300 ease-in-out md:hidden", "fixed inset-0 z-[99] pt-16 backdrop-blur-md transition-all duration-300 ease-in-out md:hidden",
mobileMenuOpen mobileMenuOpen
? "pointer-events-auto opacity-100" ? "pointer-events-auto opacity-100"
: "pointer-events-none opacity-0" : "pointer-events-none opacity-0",
)} )}
> >
<div className='mx-4 mt-4 overflow-hidden rounded-lg border border-border bg-background/95'> <div className="mx-4 mt-4 overflow-hidden rounded-lg border border-border bg-background/95">
<div className='flex items-center bg-muted px-4 py-2'> <div className="flex items-center bg-muted px-4 py-2">
<div className='mr-4 flex space-x-2'> <div className="mr-4 flex space-x-2">
<div className='h-3 w-3 rounded-full bg-red-500' /> <div className="h-3 w-3 rounded-full bg-red-500" />
<div className='h-3 w-3 rounded-full bg-yellow-500' /> <div className="h-3 w-3 rounded-full bg-yellow-500" />
<div className='h-3 w-3 rounded-full bg-green-500' /> <div className="h-3 w-3 rounded-full bg-green-500" />
</div> </div>
<div className='font-mono text-muted-foreground text-sm'> <div className="font-mono text-muted-foreground text-sm">
better-t-stack:~ better-t-stack:~
</div> </div>
</div> </div>
<div className='p-4 font-mono text-sm'> <div className="p-4 font-mono text-sm">
<div className='pb-3'> <div className="pb-3">
<span className='text-[--color-chart-4]'> <span className="text-[--color-chart-4]">
user@better-t-stack user@better-t-stack
</span> </span>
<span className='text-muted-foreground'>:~$</span> <span className="text-muted-foreground">:~$</span>
<span className='ml-2 text-foreground'>ls -la</span> <span className="ml-2 text-foreground">ls -la</span>
</div> </div>
<div className='space-y-2 border-border border-l-2 pl-4'> <div className="space-y-2 border-border border-l-2 pl-4">
<Link <Link
href='/' href="/"
className='block text-primary hover:underline' className="block text-primary hover:underline"
onClick={() => setMobileMenuOpen(false)} onClick={() => setMobileMenuOpen(false)}
> >
~/home ~/home
</Link> </Link>
<Link <Link
href='https://my-better-t-app-client.pages.dev/' href="https://my-better-t-app-client.pages.dev/"
target='_blank' target="_blank"
className='block text-primary hover:underline' className="block text-primary hover:underline"
onClick={() => setMobileMenuOpen(false)} onClick={() => setMobileMenuOpen(false)}
> >
~/demo ~/demo
</Link> </Link>
<div className='flex items-center'> <div className="flex items-center">
<PackageIcon pm='npm' className='mr-1 h-4 w-4' /> <PackageIcon pm="npm" className="mr-1 h-4 w-4" />
<Link <Link
href='https://www.npmjs.com/package/create-better-t-stack' href="https://www.npmjs.com/package/create-better-t-stack"
target='_blank' target="_blank"
className='block text-primary hover:underline' className="block text-primary hover:underline"
onClick={() => setMobileMenuOpen(false)} onClick={() => setMobileMenuOpen(false)}
> >
~/npm ~/npm
</Link> </Link>
</div> </div>
<div className='flex items-center'> <div className="flex items-center">
<BookMarked className='mr-1 h-4 w-4' /> <BookMarked className="mr-1 h-4 w-4" />
<Link <Link
href='/docs' href="/docs"
className='block text-primary hover:underline' className="block text-primary hover:underline"
onClick={() => setMobileMenuOpen(false)} onClick={() => setMobileMenuOpen(false)}
> >
~/docs ~/docs
</Link> </Link>
</div> </div>
<div className='flex items-center'> <div className="flex items-center">
<Github className='mr-1 size-4 text-foreground' /> <Github className="mr-1 size-4 text-foreground" />
<Link <Link
href='https://www.github.com/better-t-stack/create-better-t-stack' href="https://www.github.com/better-t-stack/create-better-t-stack"
target='_blank' target="_blank"
className='block text-primary hover:underline' className="block text-primary hover:underline"
onClick={() => setMobileMenuOpen(false)} onClick={() => setMobileMenuOpen(false)}
> >
~/github ~/github
</Link> </Link>
</div> </div>
</div> </div>
<div className='mt-6 pb-3'> <div className="mt-6 pb-3">
<span className='text-[--color-chart-4]'> <span className="text-[--color-chart-4]">
user@better-t-stack user@better-t-stack
</span> </span>
<span className='text-muted-foreground'>:~$</span> <span className="text-muted-foreground">:~$</span>
<span className='ml-2 text-foreground'>star-repo</span> <span className="ml-2 text-foreground">star-repo</span>
</div> </div>
<div className='border-border border-l-2 pb-2 pl-4'> <div className="border-border border-l-2 pb-2 pl-4">
<Link <Link
href='https://www.github.com/better-t-stack/create-better-t-stack' href="https://www.github.com/better-t-stack/create-better-t-stack"
target='_blank' target="_blank"
className='inline-flex items-center rounded-md bg-muted px-4 py-2 text-foreground transition-colors hover:bg-muted/80' className="inline-flex items-center rounded-md bg-muted px-4 py-2 text-foreground transition-colors hover:bg-muted/80"
onClick={() => setMobileMenuOpen(false)} onClick={() => setMobileMenuOpen(false)}
> >
<Github className='mr-1 size-5' /> <Github className="mr-1 size-5" />
Star on GitHub Star on GitHub
</Link> </Link>
</div> </div>
<div className='mt-4'> <div className="mt-4">
<span className='text-[--color-chart-4]'> <span className="text-[--color-chart-4]">
user@better-t-stack user@better-t-stack
</span> </span>
<span className='text-muted-foreground'>:~$</span> <span className="text-muted-foreground">:~$</span>
<span className='ml-2 animate-pulse text-foreground'>█</span> <span className="ml-2 animate-pulse text-foreground">█</span>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</> </>
); );
}; };
export default Navbar; export default Navbar;

56
apps/web/src/app/docs/[[...slug]]/page.tsx
View File

@@ -1,47 +1,47 @@
import { source } from "@/lib/source"; import { source } from "@/lib/source";
import defaultMdxComponents from "fumadocs-ui/mdx";
import Features from "components/features"; import Features from "components/features";
import defaultMdxComponents from "fumadocs-ui/mdx";
import { import {
DocsBody, DocsBody,
DocsDescription, DocsDescription,
DocsPage, DocsPage,
DocsTitle, DocsTitle,
} from "fumadocs-ui/page"; } from "fumadocs-ui/page";
import { notFound } from "next/navigation"; import { notFound } from "next/navigation";
export default async function Page(props: { export default async function Page(props: {
params: Promise<{ slug?: string[] }>; params: Promise<{ slug?: string[] }>;
}) { }) {
const params = await props.params; const params = await props.params;
const page = source.getPage(params.slug); const page = source.getPage(params.slug);
if (!page) notFound(); if (!page) notFound();
const MDX = page.data.body; const MDX = page.data.body;
return ( return (
<DocsPage toc={page.data.toc} full={page.data.full}> <DocsPage toc={page.data.toc} full={page.data.full}>
<DocsTitle>{page.data.title}</DocsTitle> <DocsTitle>{page.data.title}</DocsTitle>
<DocsDescription>{page.data.description}</DocsDescription> <DocsDescription>{page.data.description}</DocsDescription>
<DocsBody> <DocsBody>
<MDX components={{ ...defaultMdxComponents, Features }} /> <MDX components={{ ...defaultMdxComponents, Features }} />
</DocsBody> </DocsBody>
</DocsPage> </DocsPage>
); );
} }
export async function generateStaticParams() { export async function generateStaticParams() {
return source.generateParams(); return source.generateParams();
} }
export async function generateMetadata(props: { export async function generateMetadata(props: {
params: Promise<{ slug?: string[] }>; params: Promise<{ slug?: string[] }>;
}) { }) {
const params = await props.params; const params = await props.params;
const page = source.getPage(params.slug); const page = source.getPage(params.slug);
if (!page) notFound(); if (!page) notFound();
return { return {
title: page.data.title, title: page.data.title,
description: page.data.description, description: page.data.description,
}; };
} }

4
apps/web/src/app/global.css
View File

@@ -1,10 +1,8 @@
@import "tailwindcss"; @import "tailwindcss";
@import "fumadocs-ui/css/ocean.css"; @import "fumadocs-ui/css/shadcn.css";
@import "fumadocs-ui/css/preset.css"; @import "fumadocs-ui/css/preset.css";
@import "tw-animate-css"; @import "tw-animate-css";
@source '../../../../node_modules/fumadocs-ui/dist/**/*.js';
@custom-variant dark (&:where(.dark, .dark *)); @custom-variant dark (&:where(.dark, .dark *));
.bg-noise { .bg-noise {

25
apps/web/src/app/layout.config.tsx
View File

@@ -1,5 +1,4 @@
import type { BaseLayoutProps } from "fumadocs-ui/layouts/shared"; import type { BaseLayoutProps } from "fumadocs-ui/layouts/shared";
import { BookMarked } from "lucide-react";
/** /**
* Shared layout configurations * Shared layout configurations
@@ -9,23 +8,9 @@ import { BookMarked } from "lucide-react";
* Docs Layout: app/docs/layout.tsx * Docs Layout: app/docs/layout.tsx
*/ */
export const baseOptions: BaseLayoutProps = { export const baseOptions: BaseLayoutProps = {
nav: { nav: {
title: "Better-T-Stack", title: "Better-T-Stack",
enabled: false, enabled: false,
}, },
links: [ githubUrl: "https://github.com/AmanVarshney01/create-better-t-stack",
{
children: (
<a
className='border-muted flex border rounded-lg p-2 text-lg items-center gap-2'
href='/docs'
>
<BookMarked size={16} />
Documentation
</a>
),
type: "custom",
},
],
githubUrl: "https://github.com/AmanVarshney01/create-better-t-stack",
}; };

595
bun.lock
View File

File diff suppressed because it is too large Load Diff

6
package.json
View File

@@ -16,10 +16,10 @@
}, },
"devDependencies": { "devDependencies": {
"@biomejs/biome": "1.9.4", "@biomejs/biome": "1.9.4",
"@changesets/cli": "^2.28.1", "@changesets/cli": "^2.29.2",
"husky": "^9.1.7", "husky": "^9.1.7",
"lint-staged": "^15.5.0", "lint-staged": "^15.5.1",
"turbo": "^2.5.0", "turbo": "^2.5.1",
"typescript": "5.7.3" "typescript": "5.7.3"
}, },
"lint-staged": { "lint-staged": {