Skip to content

Commit f0b6e81

Browse files
Leo5661Leo5661
committed
fix: theme and links
1 parent 2e883ab commit f0b6e81

File tree

11 files changed

+392
-52
lines changed

11 files changed

+392
-52
lines changed

‎apps/docs/package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@
1111
"type-check": "tsc --noEmit"
1212
},
1313
"dependencies": {
14+
"@radix-ui/react-dropdown-menu": "^2.1.4",
1415
"@radix-ui/react-icons": "^1.3.0",
1516
"@radix-ui/react-slot": "^1.1.1",
1617
"@radix-ui/react-tooltip": "^1.1.6",

‎apps/docs/src/app/globals.css‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -4,15 +4,15 @@
44

55
/* Color Rose */
66

7-
@layer base {
7+
/* @layer base {
88
:root {
99
--background: 0 0% 100%;
1010
--foreground: 20 14.3% 4.1%;
1111
--card: 0 0% 100%;
1212
--card-foreground: 20 14.3% 4.1%;
1313
--popover: 0 0% 100%;
1414
--popover-foreground: 20 14.3% 4.1%;
15-
--primary: 24.6 95% 53.1%;
15+
--primary: 230 90% 72%;
1616
--primary-foreground: 60 9.1% 97.8%;
1717
--secondary: 60 4.8% 95.9%;
1818
--secondary-foreground: 24 9.8% 10%;
@@ -24,7 +24,7 @@
2424
--destructive-foreground: 60 9.1% 97.8%;
2525
--border: 20 5.9% 90%;
2626
--input: 20 5.9% 90%;
27-
--ring: 24.6 95% 53.1%;
27+
--ring: 230 90% 72%;
2828
--radius: 0.5rem;
2929
--chart-1: 12 76% 61%;
3030
--chart-2: 173 58% 39%;
@@ -40,7 +40,7 @@
4040
--card-foreground: 60 9.1% 97.8%;
4141
--popover: 20 14.3% 4.1%;
4242
--popover-foreground: 60 9.1% 97.8%;
43-
--primary: 20.5 90.2% 48.2%;
43+
--primary: 250 70% 94%;
4444
--primary-foreground: 60 9.1% 97.8%;
4545
--secondary: 12 6.5% 15.1%;
4646
--secondary-foreground: 60 9.1% 97.8%;
@@ -52,14 +52,14 @@
5252
--destructive-foreground: 60 9.1% 97.8%;
5353
--border: 12 6.5% 15.1%;
5454
--input: 12 6.5% 15.1%;
55-
--ring: 20.5 90.2% 48.2%;
55+
--ring: 250 70% 94%;
5656
--chart-1: 220 70% 50%;
5757
--chart-2: 160 60% 45%;
5858
--chart-3: 30 80% 55%;
5959
--chart-4: 280 65% 60%;
6060
--chart-5: 340 75% 55%;
6161
}
62-
}
62+
} */
6363

6464
/* Color Violet */
6565

@@ -121,7 +121,7 @@
121121
} */
122122

123123
/* Color Zinc */
124-
/*
124+
125125
@layer base {
126126
:root {
127127
--background: 0 0% 100%;
@@ -177,7 +177,7 @@
177177
--chart-4: 280 65% 60%;
178178
--chart-5: 340 75% 55%;
179179
}
180-
} */
180+
}
181181

182182
@layer base {
183183
* {

‎apps/docs/src/app/page.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -11,13 +11,13 @@ export default function Page(): JSX.Element {
1111
<Header />
1212
{/* <hr className="m-0 h-px w-full border-none bg-gradient-to-r from-neutral-200/0 via-neutral-200/30 to-neutral-200/0 " /> */}
1313
<HeroSection />
14-
<hr className="m-0 h-px w-full border-none bg-gradient-to-r from-neutral-200/0 via-neutral-200/30 to-neutral-200/0 my-10" />
14+
<hr className="m-0 h-px w-full border-none bg-gradient-to-r from-neutral-200/0 via-foreground/20 to-neutral-200/0 my-10" />
1515
<FeatureSection />
16-
<hr className="m-0 h-px w-full border-none bg-gradient-to-r from-neutral-200/0 via-neutral-200/30 to-neutral-200/0 my-10" />
16+
<hr className="m-0 h-px w-full border-none bg-gradient-to-r from-neutral-200/0 via-foreground/20 to-neutral-200/0 my-10" />
1717
<InstallationSection />
18-
<hr className="m-0 h-px w-full border-none bg-gradient-to-r from-neutral-200/0 via-neutral-200/30 to-neutral-200/0 my-10" />
18+
<hr className="m-0 h-px w-full border-none bg-gradient-to-r from-neutral-200/0 via-foreground/20 to-neutral-200/0 my-10" />
1919
<CATSection />
20-
<hr className="m-0 h-px w-full border-none bg-gradient-to-r from-neutral-200/0 via-neutral-200/30 to-neutral-200/0 my-10" />
20+
<hr className="m-0 h-px w-full border-none bg-gradient-to-r from-neutral-200/0 via-foreground/20 to-neutral-200/0 my-10" />
2121
<Footer />
2222
</main>
2323
);

‎apps/docs/src/components/doc-nav-logo.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ export function DocNavLogo(): React.ReactNode {
77
return (
88
<div className="flex flex-row items-center gap-2">
99
<Image src={CodegenLogoLight} alt="logo" width={25} height={25} />
10-
<span className="text-sm sm:text-xl bg-gradient-to-r from-purple-500 to-cyan-300 bg-clip-text text-transparent">
10+
<span className="text-sm sm:text-xl bg-gradient-to-r from-indigo-500 to-cyan-300 bg-clip-text text-transparent">
1111
CodeGen
1212
</span>
1313
</div>

‎apps/docs/src/components/header.tsx‎

Lines changed: 37 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,47 +1,64 @@
11
import Link from "next/link";
22
import DocNavLogo from "./doc-nav-logo";
33
import { Button } from "./ui/button";
4-
import { GitHubLogoIcon } from "@radix-ui/react-icons";
5-
import { Binoculars, Book, BookOpen, FlaskConical } from "lucide-react";
4+
import { DiscordLogoIcon, GitHubLogoIcon } from "@radix-ui/react-icons";
5+
import { Binoculars, Book, BookOpen, FlaskConical, icons } from "lucide-react";
6+
import { ThemeSwitch } from "./theme-switch";
67
export function Header() {
78
return (
8-
<header className="px-4 lg:px-6 h-14 flex items-center sticky top-0 z-50 bg-background/80 backdrop-blur-sm">
9+
<header className="px-4 lg:px-6 h-14 flex items-center justify-between sticky top-0 z-50 bg-background/80 backdrop-blur-sm">
910
<Link className="flex items-center justify-center" href="/">
1011
<DocNavLogo />
1112
</Link>
1213
<nav className="ml-auto hidden md:flex gap-6 items-center md:visible ">
1314
<Link
14-
className="text-sm text-muted-foreground hover:text-primary transition-colors flex items-center"
15+
className="text-sm text-muted-foreground hover:bg-clip-text hover:text-transparent hover:bg-gradient-to-r from-indigo-500 to-cyan-300 transition-colors flex items-center"
1516
href="/docs/introduction"
1617
>
17-
<BookOpen size={16} className="mr-2" strokeWidth={1.5} />
1818
Documentation
1919
</Link>
2020
<Link
21-
className="text-sm text-muted-foreground hover:text-primary transition-colors flex items-center"
22-
href="/roadmap"
21+
className="text-sm text-muted-foreground hover:bg-clip-text hover:text-transparent hover:bg-gradient-to-r from-indigo-500 to-cyan-300 transition-colors flex items-center"
22+
href="/"
2323
>
24-
<Binoculars size={16} className="mr-2" strokeWidth={1.5} />
2524
Roadmap
2625
</Link>
2726
<Link
28-
className="text-sm text-muted-foreground hover:text-primary transition-colors flex items-center"
29-
href="/lab"
27+
className="text-sm text-muted-foreground hover:bg-clip-text hover:text-transparent hover:bg-gradient-to-r from-indigo-500 to-cyan-300 transition-colors flex items-center"
28+
href="/"
3029
>
31-
<FlaskConical size={16} className="mr-2" strokeWidth={1.5} />
3230
Lab
3331
</Link>
34-
<Button asChild className="bg-transparent hover:bg-foreground/10">
35-
<Link
36-
className="text-sm text-muted-foreground"
37-
href="https://github.com/Leo5661/codegen"
38-
target="_blank"
39-
rel="noopener noreferrer"
32+
<div className="flex flex-row items-center">
33+
<Button
34+
asChild
35+
size={"icon"}
36+
className="bg-transparent text-muted-foreground hover:bg-foreground/10"
4037
>
41-
<GitHubLogoIcon />
42-
</Link>
43-
</Button>
38+
<Link
39+
href="https://discord.gg/Ynct5xen"
40+
target="_blank"
41+
rel="noopener noreferrer"
42+
>
43+
<DiscordLogoIcon />
44+
</Link>
45+
</Button>
46+
<Button
47+
asChild
48+
size={"icon"}
49+
className="bg-transparent text-muted-foreground hover:bg-foreground/10"
50+
>
51+
<Link
52+
href="https://github.com/Leo5661/codegen"
53+
target="_blank"
54+
rel="noopener noreferrer"
55+
>
56+
<GitHubLogoIcon />
57+
</Link>
58+
</Button>
59+
</div>
4460
</nav>
61+
<ThemeSwitch />
4562
</header>
4663
);
4764
}

‎apps/docs/src/components/sections/cat.tsx‎

Lines changed: 20 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,10 @@ function CATSection() {
2121
<div className="flex sm:flex-row flex-col gap-4 sm:gap-0 items-center mt-8 justify-evenly w-full px-20">
2222
<Card className="relative rounded border sm:px-10 sm:py-8 p-4 min-w-[300px] min-h-[300px]">
2323
<CardContent className="p-4 flex flex-col items-center text-center space-y-4">
24-
<Rocket className="h-8 w-8 text-primary" />
24+
<Rocket
25+
className="h-8 w-8 text-muted-foreground"
26+
strokeWidth="1.5"
27+
/>
2528
<h3 className="text-lg font-semibold">Early Adopter</h3>
2629
<p className="text-muted-foreground text-sm max-w-80">
2730
Be among the first to use and provide feedback on CodeGen. Your
@@ -32,7 +35,7 @@ function CATSection() {
3235
variant={"outline"}
3336
className="inline-flex items-center justify-center"
3437
>
35-
<Link href="/get-started">
38+
<Link href="/docs/introduction">
3639
Get Started
3740
<ArrowRight className="ml-2 h-4 w-4" />
3841
</Link>
@@ -43,7 +46,10 @@ function CATSection() {
4346

4447
<Card className="relative rounded border sm:px-10 sm:py-8 p-4 min-w-[300px] min-h-[300px]">
4548
<CardContent className="p-4 flex flex-col items-center text-center space-y-4">
46-
<GitHubLogoIcon className="h-8 w-8 text-primary" />
49+
<GitHubLogoIcon
50+
className="h-8 w-8 text-muted-foreground"
51+
strokeWidth={1.5}
52+
/>
4753
<div className="text-lg font-semibold">Contribute on GitHub</div>
4854
<p className="text-muted-foreground text-sm max-w-80">
4955
Help build CodeGen from the ground up. Your contributions, big or
@@ -65,7 +71,10 @@ function CATSection() {
6571

6672
<Card className="relative rounded border sm:px-10 sm:py-8 p-4 min-w-[300px] min-h-[300px]">
6773
<CardContent className="p-4 flex flex-col items-center text-center space-y-4">
68-
<Lightbulb className="h-8 w-8 text-primary" />
74+
<Lightbulb
75+
className="h-8 w-8 text-muted-foreground"
76+
strokeWidth={1.5}
77+
/>
6978
<div className="text-lg font-semibold">Shape the Future</div>
7079
<p className="text-muted-foreground text-sm max-w-80">
7180
Share your ideas and help define the roadmap for CodeGen. Your
@@ -86,20 +95,23 @@ function CATSection() {
8695
</Card>
8796
</div>
8897

89-
{/* <hr className="m-0 h-px w-full border-none bg-gradient-to-r from-neutral-200/0 via-neutral-200/30 to-neutral-200/0 my-10" /> */}
90-
9198
<div className="flex flex-col items-center mt-10 sm:mt-20 z-10">
9299
<p className="text-muted-foreground mb-4 text-center">
93100
Join the growing CodeGen community and be part of something
94101
extraordinary from the start
95102
</p>
103+
96104
<Button
97105
asChild
98106
size="lg"
99107
variant={"outline"}
100-
className="inline-flex h-12 animate-shimmer items-center justify-center rounded-md border border-slate-800 bg-[linear-gradient(110deg,#000103,45%,#1e2631,55%,#000103)] bg-[length:200%_100%] px-6 font-medium text-slate-400 transition-colors focus:outline-none focus:ring-2 focus:ring-slate-400 focus:ring-offset-2 focus:ring-offset-slate-50"
108+
className="mt-6 sm:mt-8 ring-0 focus:ring-0 inline-flex h-12 animate-shimmer items-center justify-center rounded-md border border-slate-800 bg-[linear-gradient(110deg,#151225,45%,#23495f,55%,#151225)] bg-[length:200%_100%] px-6 font-medium text-slate-400 transition-colors focus:outline-none focus:ring-slate-400 focus:ring-offset-2 focus:ring-offset-slate-50"
101109
>
102-
<Link href="/join">
110+
<Link
111+
href="https://discord.gg/Ynct5xen"
112+
target="_blank"
113+
rel="noopener noreferrer"
114+
>
103115
<DiscordLogoIcon className="mr-2 h-10 w-10 animate-pulse " />
104116
Join the CodeGen Movement
105117
</Link>
@@ -110,8 +122,3 @@ function CATSection() {
110122
}
111123

112124
export default CATSection;
113-
114-
// // Button code
115-
// <button className="inline-flex h-12 animate-shimmer items-center justify-center rounded-md border border-slate-800 bg-[linear-gradient(110deg,#000103,45%,#1e2631,55%,#000103)] bg-[length:200%_100%] px-6 font-medium text-slate-400 transition-colors focus:outline-none focus:ring-2 focus:ring-slate-400 focus:ring-offset-2 focus:ring-offset-slate-50">
116-
// Shimmer
117-
// </button>

‎apps/docs/src/components/sections/hero.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ function HeroSection() {
1818
const [copied, setCopied] = useState(false);
1919

2020
const handleCopy = () => {
21-
navigator.clipboard.writeText("npm install -g codegen-cli");
21+
navigator.clipboard.writeText("pnpm install -g @leocoder1/codegen-cli");
2222
setCopied(true);
2323
setTimeout(() => setCopied(false), 2000);
2424
};
@@ -58,7 +58,7 @@ function HeroSection() {
5858

5959
<div className="flex flex-row items-center justify-evenly sm:space-x-4 space-x-1 border rounded-md sm:px-4 px-1 mt-8">
6060
<DollarSign size={15} strokeWidth={1.5} />
61-
<div className="sm:font-semibold font-light text-xs sm:text-sm text-muted-foreground">
61+
<div className="sm:font-normal font-light text-xs sm:text-sm text-muted-foreground">
6262
pnpm install -g @leocoder1/codegen-cli
6363
</div>
6464
<Button
@@ -69,13 +69,13 @@ function HeroSection() {
6969
{copied ? (
7070
<CheckCheck className="w-2 h-2 sm:h-4 sm:w-4 text-green-500" />
7171
) : (
72-
<Copy className="w-2 h-2 sm:h-4 sm:w-4" />
72+
<Copy className="w-2 h-2 sm:h-4 sm:w-4 text-foreground" />
7373
)}
7474
</Button>
7575
</div>
7676
<div className="flex flex-col sm:flex-row items-center gap-4 mt-4">
7777
<Button
78-
className="w-full sm:w-auto min-w-[200px] bg-gradient-to-r from-sky-500 to-indigo-500"
78+
className="w-full sm:w-auto min-w-[200px] bg-gradient-to-r from-indigo-500 to-cyan-500"
7979
asChild
8080
>
8181
<Link href="/docs/introduction">Get Started</Link>

‎apps/docs/src/components/sections/installation.tsx‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -37,11 +37,13 @@ function InstallationSection() {
3737
<Terminal className="h-4 w-4 text-primary" />
3838
</div>
3939
<div className="space-y-2 flex flex-col items-start">
40-
<div className="font-semibold">{step.title}</div>
40+
<div className="font-semibold text-foreground">
41+
{step.title}
42+
</div>
4143
<p className="sm:text-sm text-xs text-muted-foreground text-start">
4244
{step.description}
4345
</p>
44-
<pre className="mt-2 sm:px-4 sm:py-2 px-2 py-1 rounded-lg bg-muted/50 font-light text-sm">
46+
<pre className="mt-2 sm:px-4 sm:py-2 px-2 py-1 rounded-lg bg-muted/50 font-light text-sm text-muted-foreground">
4547
{step.command}
4648
</pre>
4749
</div>

‎apps/docs/src/components/theme-switch.tsx‎

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
"use client";
2+
3+
import * as React from "react";
4+
import { Moon, Sun } from "lucide-react";
5+
import { useTheme } from "next-themes";
6+
import {
7+
DropdownMenu,
8+
DropdownMenuContent,
9+
DropdownMenuItem,
10+
DropdownMenuTrigger,
11+
} from "./ui/dropdown-menu";
12+
import { Button } from "./ui/button";
13+
14+
export function ThemeSwitch() {
15+
const { setTheme } = useTheme();
16+
17+
return (
18+
<DropdownMenu>
19+
<DropdownMenuTrigger asChild>
20+
<Button
21+
variant="outline"
22+
size="icon"
23+
className="outline-none ring-0 focus:ring-0"
24+
>
25+
<Sun className="h-[1.2rem] w-[1.2rem] rotate-0 scale-100 transition-all dark:-rotate-90 dark:scale-0" />
26+
<Moon className="absolute h-[1.2rem] w-[1.2rem] rotate-90 scale-0 transition-all dark:rotate-0 dark:scale-100" />
27+
<span className="sr-only">Toggle theme</span>
28+
</Button>
29+
</DropdownMenuTrigger>
30+
<DropdownMenuContent align="end">
31+
<DropdownMenuItem onClick={() => setTheme("light")}>
32+
Light
33+
</DropdownMenuItem>
34+
<DropdownMenuItem onClick={() => setTheme("dark")}>
35+
Dark
36+
</DropdownMenuItem>
37+
<DropdownMenuItem onClick={() => setTheme("system")}>
38+
System
39+
</DropdownMenuItem>
40+
</DropdownMenuContent>
41+
</DropdownMenu>
42+
);
43+
}

0 commit comments

Comments
 (0)