Skip to content

Commit 1cd6215

Browse files
committed
feat: enhance layout and add 'Call For Speakers' button in hero section
1 parent 8d86f25 commit 1cd6215

File tree

4 files changed

+61
-9
lines changed

4 files changed

+61
-9
lines changed

src/app/(about)/schedule/page.tsx

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,10 @@ import TypingAnimation from "@/components/ui/typing-animation";
22

33
export default function Home() {
44
return (
5-
<div className="text-center">
6-
<TypingAnimation>Coming Soon 🚀</TypingAnimation>
5+
<div className="h-[40dvh] w-full flex items-center justify-center">
6+
<div className="text-center px-4">
7+
<TypingAnimation>Coming Soon 🚀</TypingAnimation>
8+
</div>
79
</div>
810
);
9-
}
11+
}

src/app/(about)/speakers/page.tsx

Lines changed: 12 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,17 @@
1-
import TypingAnimation from "@/components/ui/typing-animation";
2-
31
export default function Home() {
42
return (
5-
<div className="text-center">
6-
<p className="text-4xl font-bold">Register Now</p>
3+
<div className="h-[40dvh] w-full flex items-center justify-center">
4+
<div className="text-center px-4">
5+
<p className="text-4xl font-bold">
6+
<a
7+
href="https://sessionize.com/pycon-kenya-2025/"
8+
target="_blank"
9+
rel="noreferrer"
10+
>
11+
Register Here
12+
</a>
13+
</p>
14+
</div>
715
</div>
816
);
917
}

src/components/hero-section.tsx

Lines changed: 16 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,25 @@
1-
import { RainbowButton } from "@/components/ui/rainbow-button";
1+
import {
2+
RainbowButton,
3+
RainbowGreyButton,
4+
} from "@/components/ui/rainbow-button";
25

36
export default function HeroSection() {
47
return (
58
<div className="relative overflow-hidden py-24 lg:py-32">
69
<div className="container mx-auto max-w-7xl px-8">
710
<div className="max-w-2xl text-center mx-auto">
8-
<RainbowButton className="mb-10">Get Your Ticket</RainbowButton>
11+
<div className="flex justify-center gap-4 mb-10">
12+
<RainbowButton>Get Your Ticket</RainbowButton>
13+
<RainbowGreyButton>
14+
<a
15+
href="https://sessionize.com/pycon-kenya-2025/"
16+
target="_blank"
17+
rel="noreferrer"
18+
>
19+
Call For Speakers
20+
</a>
21+
</RainbowGreyButton>
22+
</div>
923
<h1 className="scroll-m-20 text-4xl font-extrabold tracking-tight lg:text-5xl">
1024
Welcome to PyCon Kenya 2025
1125
</h1>

src/components/ui/rainbow-button.tsx

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -31,3 +31,31 @@ export function RainbowButton({
3131
</button>
3232
);
3333
}
34+
35+
export function RainbowGreyButton({
36+
children,
37+
className,
38+
...props
39+
}: RainbowButtonProps) {
40+
return (
41+
<button
42+
className={cn(
43+
"group relative inline-flex h-11 animate-rainbow cursor-pointer items-center justify-center rounded-xl border-0 bg-[length:200%] px-8 py-2 font-medium text-black transition-colors [background-clip:padding-box,border-box,border-box] [background-origin:border-box] [border:calc(0.08*1rem)_solid_transparent] focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50",
44+
45+
// before styles
46+
"before:absolute before:bottom-[-20%] before:left-1/2 before:z-0 before:h-1/5 before:w-3/5 before:-translate-x-1/2 before:animate-rainbow before:bg-[linear-gradient(90deg,hsl(var(--color-1)),hsl(var(--color-5)),hsl(var(--color-3)),hsl(var(--color-4)),hsl(var(--color-2)))] before:[filter:blur(calc(0.8*1rem))]",
47+
48+
// light mode colors
49+
"bg-[linear-gradient(#e5e5e5,#e5e5e5),linear-gradient(#e5e5e5_50%,rgba(229,229,229,0.6)_80%,rgba(229,229,229,0)),linear-gradient(90deg,hsl(var(--color-1)),hsl(var(--color-5)),hsl(var(--color-3)),hsl(var(--color-4)),hsl(var(--color-2)))]",
50+
51+
// dark mode colors
52+
"dark:bg-[linear-gradient(#e5e5e5,#e5e5e5),linear-gradient(#e5e5e5_50%,rgba(229,229,229,0.6)_80%,rgba(229,229,229,0)),linear-gradient(90deg,hsl(var(--color-1)),hsl(var(--color-5)),hsl(var(--color-3)),hsl(var(--color-4)),hsl(var(--color-2)))]",
53+
54+
className,
55+
)}
56+
{...props}
57+
>
58+
{children}
59+
</button>
60+
);
61+
}

0 commit comments

Comments
 (0)