Skip to content

Commit c50e3a4

Browse files
committed
Merge branch 'staging' of https://github.com/databuddy-analytics/Databuddy into staging
2 parents 49ab3e8 + 67cdf8f commit c50e3a4

26 files changed

+490
-1621
lines changed

apps/docs/app/(home)/ambassadors/ambassador-form.tsx

Lines changed: 172 additions & 212 deletions
Large diffs are not rendered by default.

apps/docs/app/(home)/ambassadors/ambassador-hero.tsx

Lines changed: 12 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ import {
77
RocketLaunchIcon,
88
SparkleIcon,
99
} from '@phosphor-icons/react';
10+
import { SciFiCard } from '@/components/scifi-card';
1011

1112
function FeatureCard({
1213
icon: Icon,
@@ -18,42 +19,20 @@ function FeatureCard({
1819
description: string;
1920
}) {
2021
return (
21-
<div className="group relative">
22-
<div className="relative flex h-20 w-full flex-col items-center justify-center rounded border border-border bg-card/50 backdrop-blur-sm transition-all duration-300 hover:border-border/80 hover:bg-card/70 sm:h-24 lg:h-28">
23-
<Icon
24-
className="mb-1 h-5 w-5 text-muted-foreground transition-colors duration-300 group-hover:text-foreground sm:h-6 sm:w-6 lg:h-7 lg:w-7"
25-
weight="duotone"
26-
/>
27-
<div className="px-3 text-center">
28-
<div className="font-semibold text-foreground text-xs sm:text-sm lg:text-base">
29-
{title}
30-
</div>
31-
<div className="mt-0.5 text-muted-foreground text-xs">
32-
{description}
33-
</div>
22+
<SciFiCard className="flex h-20 w-full flex-col items-center justify-center rounded border border-border bg-card/50 backdrop-blur-sm transition-all duration-300 hover:border-border/80 hover:bg-card/70 sm:h-24 lg:h-28">
23+
<Icon
24+
className="mb-1 h-5 w-5 text-muted-foreground transition-colors duration-300 group-hover:text-foreground sm:h-6 sm:w-6 lg:h-7 lg:w-7"
25+
weight="duotone"
26+
/>
27+
<div className="px-3 text-center">
28+
<div className="font-semibold text-foreground text-xs sm:text-sm lg:text-base">
29+
{title}
3430
</div>
35-
</div>
36-
37-
{/* Sci-fi corners */}
38-
<div className="pointer-events-none absolute inset-0">
39-
<div className="absolute top-0 left-0 h-2 w-2 group-hover:animate-[cornerGlitch_0.6s_ease-in-out]">
40-
<div className="absolute top-0 left-0.5 h-0.5 w-1.5 origin-left bg-foreground" />
41-
<div className="absolute top-0 left-0 h-2 w-0.5 origin-top bg-foreground" />
42-
</div>
43-
<div className="-scale-x-[1] absolute top-0 right-0 h-2 w-2 group-hover:animate-[cornerGlitch_0.6s_ease-in-out]">
44-
<div className="absolute top-0 left-0.5 h-0.5 w-1.5 origin-left bg-foreground" />
45-
<div className="absolute top-0 left-0 h-2 w-0.5 origin-top bg-foreground" />
46-
</div>
47-
<div className="-scale-y-[1] absolute bottom-0 left-0 h-2 w-2 group-hover:animate-[cornerGlitch_0.6s_ease-in-out]">
48-
<div className="absolute top-0 left-0.5 h-0.5 w-1.5 origin-left bg-foreground" />
49-
<div className="absolute top-0 left-0 h-2 w-0.5 origin-top bg-foreground" />
50-
</div>
51-
<div className="-scale-[1] absolute right-0 bottom-0 h-2 w-2 group-hover:animate-[cornerGlitch_0.6s_ease-in-out]">
52-
<div className="absolute top-0 left-0.5 h-0.5 w-1.5 origin-left bg-foreground" />
53-
<div className="absolute top-0 left-0 h-2 w-0.5 origin-top bg-foreground" />
31+
<div className="mt-0.5 text-muted-foreground text-xs">
32+
{description}
5433
</div>
5534
</div>
56-
</div>
35+
</SciFiCard>
5736
);
5837
}
5938

apps/docs/app/(home)/ambassadors/ambassador-rewards.tsx

Lines changed: 7 additions & 56 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,8 @@ import {
99
TrophyIcon,
1010
UsersIcon,
1111
} from '@phosphor-icons/react';
12+
import { SciFiCard } from '@/components/scifi-card';
13+
import { cn } from '@/lib/utils';
1214

1315
interface Reward {
1416
icon: React.ComponentType<{ className?: string; weight?: IconWeight }>;
@@ -64,11 +66,12 @@ const rewards: Reward[] = [
6466

6567
function RewardCard({ reward }: { reward: Reward }) {
6668
return (
67-
<div className="group relative">
69+
<SciFiCard variant={reward.highlight ? 'primary' : 'foreground'}>
6870
<div
69-
className={`relative h-full rounded border bg-card/50 backdrop-blur-sm transition-all duration-300 hover:border-border/80 hover:bg-card/70 hover:shadow-lg ${
71+
className={cn(
72+
'relative h-full rounded border bg-card/50 backdrop-blur-sm transition-all duration-300 hover:border-border/80 hover:bg-card/70 hover:shadow-lg',
7073
reward.highlight ? 'border-primary/50 bg-primary/5' : 'border-border'
71-
}`}
74+
)}
7275
>
7376
<div className="flex flex-col p-6">
7477
{/* Icon and Value */}
@@ -111,60 +114,8 @@ function RewardCard({ reward }: { reward: Reward }) {
111114
</p>
112115
</div>
113116
</div>
114-
115-
{/* Sci-fi corners */}
116-
<div className="pointer-events-none absolute inset-0">
117-
<div className="absolute top-0 left-0 h-2 w-2 group-hover:animate-[cornerGlitch_0.6s_ease-in-out]">
118-
<div
119-
className={`absolute top-0 left-0.5 h-0.5 w-1.5 origin-left ${
120-
reward.highlight ? 'bg-primary' : 'bg-foreground'
121-
}`}
122-
/>
123-
<div
124-
className={`absolute top-0 left-0 h-2 w-0.5 origin-top ${
125-
reward.highlight ? 'bg-primary' : 'bg-foreground'
126-
}`}
127-
/>
128-
</div>
129-
<div className="-scale-x-[1] absolute top-0 right-0 h-2 w-2 group-hover:animate-[cornerGlitch_0.6s_ease-in-out]">
130-
<div
131-
className={`absolute top-0 left-0.5 h-0.5 w-1.5 origin-left ${
132-
reward.highlight ? 'bg-primary' : 'bg-foreground'
133-
}`}
134-
/>
135-
<div
136-
className={`absolute top-0 left-0 h-2 w-0.5 origin-top ${
137-
reward.highlight ? 'bg-primary' : 'bg-foreground'
138-
}`}
139-
/>
140-
</div>
141-
<div className="-scale-y-[1] absolute bottom-0 left-0 h-2 w-2 group-hover:animate-[cornerGlitch_0.6s_ease-in-out]">
142-
<div
143-
className={`absolute top-0 left-0.5 h-0.5 w-1.5 origin-left ${
144-
reward.highlight ? 'bg-primary' : 'bg-foreground'
145-
}`}
146-
/>
147-
<div
148-
className={`absolute top-0 left-0 h-2 w-0.5 origin-top ${
149-
reward.highlight ? 'bg-primary' : 'bg-foreground'
150-
}`}
151-
/>
152-
</div>
153-
<div className="-scale-[1] absolute right-0 bottom-0 h-2 w-2 group-hover:animate-[cornerGlitch_0.6s_ease-in-out]">
154-
<div
155-
className={`absolute top-0 left-0.5 h-0.5 w-1.5 origin-left ${
156-
reward.highlight ? 'bg-primary' : 'bg-foreground'
157-
}`}
158-
/>
159-
<div
160-
className={`absolute top-0 left-0 h-2 w-0.5 origin-top ${
161-
reward.highlight ? 'bg-primary' : 'bg-foreground'
162-
}`}
163-
/>
164-
</div>
165-
</div>
166117
</div>
167-
</div>
118+
</SciFiCard>
168119
);
169120
}
170121

apps/docs/app/(home)/blog/[slug]/page.tsx

Lines changed: 3 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ import { SITE_URL } from '@/app/util/constants';
1313
import { Footer } from '@/components/footer';
1414
import { SciFiButton } from '@/components/landing/scifi-btn';
1515
import { Prose } from '@/components/prose';
16+
import { SciFiCard } from '@/components/scifi-card';
1617
import { getPosts, getSinglePost } from '@/lib/blog-query';
1718
import type { Post } from '@/types/post';
1819

@@ -108,7 +109,7 @@ export default async function PostPage({
108109
<div className="relative flex min-h-[60vh] w-full items-center justify-center overflow-hidden px-4 pt-10 sm:px-6 sm:pt-12 lg:px-8">
109110
{/* Main Content */}
110111
<div className="relative z-10 mx-auto w-full max-w-lg text-center">
111-
<div className="group relative">
112+
<SciFiCard>
112113
<div className="relative rounded border border-border bg-card/50 p-8 backdrop-blur-sm transition-all duration-300 hover:border-border/80 hover:bg-card/70 sm:p-12">
113114
<WarningCircleIcon
114115
className="mx-auto mb-4 h-12 w-12 text-muted-foreground transition-colors duration-300 group-hover:text-foreground sm:h-16 sm:w-16"
@@ -130,27 +131,7 @@ export default async function PostPage({
130131
</SciFiButton>
131132
</div>
132133
</div>
133-
134-
{/* Sci-fi corners */}
135-
<div className="pointer-events-none absolute inset-0">
136-
<div className="absolute top-0 left-0 h-2 w-2 group-hover:animate-[cornerGlitch_0.6s_ease-in-out]">
137-
<div className="absolute top-0 left-0.5 h-0.5 w-1.5 origin-left bg-foreground" />
138-
<div className="absolute top-0 left-0 h-2 w-0.5 origin-top bg-foreground" />
139-
</div>
140-
<div className="-scale-x-[1] absolute top-0 right-0 h-2 w-2 group-hover:animate-[cornerGlitch_0.6s_ease-in-out]">
141-
<div className="absolute top-0 left-0.5 h-0.5 w-1.5 origin-left bg-foreground" />
142-
<div className="absolute top-0 left-0 h-2 w-0.5 origin-top bg-foreground" />
143-
</div>
144-
<div className="-scale-y-[1] absolute bottom-0 left-0 h-2 w-2 group-hover:animate-[cornerGlitch_0.6s_ease-in-out]">
145-
<div className="absolute top-0 left-0.5 h-0.5 w-1.5 origin-left bg-foreground" />
146-
<div className="absolute top-0 left-0 h-2 w-0.5 origin-top bg-foreground" />
147-
</div>
148-
<div className="-scale-[1] absolute right-0 bottom-0 h-2 w-2 group-hover:animate-[cornerGlitch_0.6s_ease-in-out]">
149-
<div className="absolute top-0 left-0.5 h-0.5 w-1.5 origin-left bg-foreground" />
150-
<div className="absolute top-0 left-0 h-2 w-0.5 origin-top bg-foreground" />
151-
</div>
152-
</div>
153-
</div>
134+
</SciFiCard>
154135
</div>
155136
</div>
156137
<Footer />

apps/docs/app/(home)/blog/page.tsx

Lines changed: 6 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ import { Footer } from '@/components/footer';
1111
import { SciFiButton } from '@/components/landing/scifi-btn';
1212
import Section from '@/components/landing/section';
1313
import { Spotlight } from '@/components/landing/spotlight';
14+
import { SciFiCard } from '@/components/scifi-card';
1415
import { StructuredData } from '@/components/structured-data';
1516
import { getPosts } from '@/lib/blog-query';
1617
import type { Post } from '@/types/post';
@@ -58,7 +59,7 @@ function BlogPostCard({ post }: { post: Post }) {
5859
className="block h-full"
5960
href={`/blog/${post.slug}`}
6061
>
61-
<div className="group relative flex h-full flex-col rounded border border-border bg-card/50 backdrop-blur-sm transition-all duration-300 hover:border-border/80 hover:bg-card/70 hover:shadow-lg">
62+
<SciFiCard className="flex h-full flex-col rounded border border-border bg-card/50 backdrop-blur-sm transition-all duration-300 hover:border-border/80 hover:bg-card/70 hover:shadow-lg">
6263
{/* Cover Image */}
6364
{post.coverImage && (
6465
<div className="relative overflow-hidden rounded-t">
@@ -154,27 +155,7 @@ function BlogPostCard({ post }: { post: Post }) {
154155
</div>
155156
</div>
156157
</div>
157-
158-
{/* Sci-fi corners */}
159-
<div className="pointer-events-none absolute inset-0">
160-
<div className="absolute top-0 left-0 h-2 w-2 group-hover:animate-[cornerGlitch_0.6s_ease-in-out]">
161-
<div className="absolute top-0 left-0.5 h-0.5 w-1.5 origin-left bg-foreground" />
162-
<div className="absolute top-0 left-0 h-2 w-0.5 origin-top bg-foreground" />
163-
</div>
164-
<div className="-scale-x-[1] absolute top-0 right-0 h-2 w-2 group-hover:animate-[cornerGlitch_0.6s_ease-in-out]">
165-
<div className="absolute top-0 left-0.5 h-0.5 w-1.5 origin-left bg-foreground" />
166-
<div className="absolute top-0 left-0 h-2 w-0.5 origin-top bg-foreground" />
167-
</div>
168-
<div className="-scale-y-[1] absolute bottom-0 left-0 h-2 w-2 group-hover:animate-[cornerGlitch_0.6s_ease-in-out]">
169-
<div className="absolute top-0 left-0.5 h-0.5 w-1.5 origin-left bg-foreground" />
170-
<div className="absolute top-0 left-0 h-2 w-0.5 origin-top bg-foreground" />
171-
</div>
172-
<div className="-scale-[1] absolute right-0 bottom-0 h-2 w-2 group-hover:animate-[cornerGlitch_0.6s_ease-in-out]">
173-
<div className="absolute top-0 left-0.5 h-0.5 w-1.5 origin-left bg-foreground" />
174-
<div className="absolute top-0 left-0 h-2 w-0.5 origin-top bg-foreground" />
175-
</div>
176-
</div>
177-
</div>
158+
</SciFiCard>
178159
</Link>
179160
);
180161
}
@@ -245,8 +226,8 @@ export default async function BlogPage() {
245226
</div>
246227
) : (
247228
<div className="mx-auto max-w-lg">
248-
<div className="group relative">
249-
<div className="relative rounded border border-border bg-card/50 p-8 text-center backdrop-blur-sm transition-all duration-300 hover:border-border/80 hover:bg-card/70 sm:p-12">
229+
<SciFiCard>
230+
<div className="rounded border border-border bg-card/50 p-8 text-center backdrop-blur-sm transition-all duration-300 hover:border-border/80 hover:bg-card/70 sm:p-12">
250231
<TagIcon
251232
className="mx-auto mb-4 h-12 w-12 text-muted-foreground transition-colors duration-300 group-hover:text-foreground sm:h-16 sm:w-16"
252233
weight="duotone"
@@ -267,27 +248,7 @@ export default async function BlogPage() {
267248
</SciFiButton>
268249
</div>
269250
</div>
270-
271-
{/* Sci-fi corners */}
272-
<div className="pointer-events-none absolute inset-0">
273-
<div className="absolute top-0 left-0 h-2 w-2 group-hover:animate-[cornerGlitch_0.6s_ease-in-out]">
274-
<div className="absolute top-0 left-0.5 h-0.5 w-1.5 origin-left bg-foreground" />
275-
<div className="absolute top-0 left-0 h-2 w-0.5 origin-top bg-foreground" />
276-
</div>
277-
<div className="-scale-x-[1] absolute top-0 right-0 h-2 w-2 group-hover:animate-[cornerGlitch_0.6s_ease-in-out]">
278-
<div className="absolute top-0 left-0.5 h-0.5 w-1.5 origin-left bg-foreground" />
279-
<div className="absolute top-0 left-0 h-2 w-0.5 origin-top bg-foreground" />
280-
</div>
281-
<div className="-scale-y-[1] absolute bottom-0 left-0 h-2 w-2 group-hover:animate-[cornerGlitch_0.6s_ease-in-out]">
282-
<div className="absolute top-0 left-0.5 h-0.5 w-1.5 origin-left bg-foreground" />
283-
<div className="absolute top-0 left-0 h-2 w-0.5 origin-top bg-foreground" />
284-
</div>
285-
<div className="-scale-[1] absolute right-0 bottom-0 h-2 w-2 group-hover:animate-[cornerGlitch_0.6s_ease-in-out]">
286-
<div className="absolute top-0 left-0.5 h-0.5 w-1.5 origin-left bg-foreground" />
287-
<div className="absolute top-0 left-0 h-2 w-0.5 origin-top bg-foreground" />
288-
</div>
289-
</div>
290-
</div>
251+
</SciFiCard>
291252
</div>
292253
)}
293254
</div>

apps/docs/app/(home)/compare/[slug]/page.tsx

Lines changed: 5 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import { notFound } from 'next/navigation';
55
import { SciFiButton } from '@/components/landing/scifi-btn';
66
import Section from '@/components/landing/section';
77
import { Spotlight } from '@/components/landing/spotlight';
8+
import { SciFiCard } from '@/components/scifi-card';
89
import { StructuredData } from '@/components/structured-data';
910
import { Badge } from '@/components/ui/badge';
1011
import type {
@@ -76,7 +77,7 @@ function CompetitorStatsCard({
7677
return (
7778
<div className="grid gap-6 md:grid-cols-2">
7879
{/* Databuddy Card */}
79-
<div className="group relative">
80+
<SciFiCard>
8081
<div className="relative h-full rounded border border-border bg-card/50 p-6 backdrop-blur-sm">
8182
<div className="mb-4 flex items-center justify-between">
8283
<div>
@@ -124,30 +125,10 @@ function CompetitorStatsCard({
124125
</Link>
125126
</SciFiButton>
126127
</div>
127-
128-
{/* Sci-fi corners */}
129-
<div className="pointer-events-none absolute inset-0">
130-
<div className="absolute top-0 left-0 h-2 w-2 group-hover:animate-[cornerGlitch_0.6s_ease-in-out]">
131-
<div className="absolute top-0 left-0.5 h-0.5 w-1.5 origin-left bg-foreground" />
132-
<div className="absolute top-0 left-0 h-2 w-0.5 origin-top bg-foreground" />
133-
</div>
134-
<div className="-scale-x-[1] absolute top-0 right-0 h-2 w-2 group-hover:animate-[cornerGlitch_0.6s_ease-in-out]">
135-
<div className="absolute top-0 left-0.5 h-0.5 w-1.5 origin-left bg-foreground" />
136-
<div className="absolute top-0 left-0 h-2 w-0.5 origin-top bg-foreground" />
137-
</div>
138-
<div className="-scale-y-[1] absolute bottom-0 left-0 h-2 w-2 group-hover:animate-[cornerGlitch_0.6s_ease-in-out]">
139-
<div className="absolute top-0 left-0.5 h-0.5 w-1.5 origin-left bg-foreground" />
140-
<div className="absolute top-0 left-0 h-2 w-0.5 origin-top bg-foreground" />
141-
</div>
142-
<div className="-scale-[1] absolute right-0 bottom-0 h-2 w-2 group-hover:animate-[cornerGlitch_0.6s_ease-in-out]">
143-
<div className="absolute top-0 left-0.5 h-0.5 w-1.5 origin-left bg-foreground" />
144-
<div className="absolute top-0 left-0 h-2 w-0.5 origin-top bg-foreground" />
145-
</div>
146-
</div>
147-
</div>
128+
</SciFiCard>
148129

149130
{/* Competitor Card */}
150-
<div className="group relative">
131+
<SciFiCard>
151132
<div className="relative h-full rounded border border-border bg-card/50 p-6 backdrop-blur-sm">
152133
<div className="mb-4 flex items-center justify-between">
153134
<div>
@@ -201,27 +182,7 @@ function CompetitorStatsCard({
201182
/>
202183
</Link>
203184
</div>
204-
205-
{/* Sci-fi corners */}
206-
<div className="pointer-events-none absolute inset-0">
207-
<div className="absolute top-0 left-0 h-2 w-2 group-hover:animate-[cornerGlitch_0.6s_ease-in-out]">
208-
<div className="absolute top-0 left-0.5 h-0.5 w-1.5 origin-left bg-foreground" />
209-
<div className="absolute top-0 left-0 h-2 w-0.5 origin-top bg-foreground" />
210-
</div>
211-
<div className="-scale-x-[1] absolute top-0 right-0 h-2 w-2 group-hover:animate-[cornerGlitch_0.6s_ease-in-out]">
212-
<div className="absolute top-0 left-0.5 h-0.5 w-1.5 origin-left bg-foreground" />
213-
<div className="absolute top-0 left-0 h-2 w-0.5 origin-top bg-foreground" />
214-
</div>
215-
<div className="-scale-y-[1] absolute bottom-0 left-0 h-2 w-2 group-hover:animate-[cornerGlitch_0.6s_ease-in-out]">
216-
<div className="absolute top-0 left-0.5 h-0.5 w-1.5 origin-left bg-foreground" />
217-
<div className="absolute top-0 left-0 h-2 w-0.5 origin-top bg-foreground" />
218-
</div>
219-
<div className="-scale-[1] absolute right-0 bottom-0 h-2 w-2 group-hover:animate-[cornerGlitch_0.6s_ease-in-out]">
220-
<div className="absolute top-0 left-0.5 h-0.5 w-1.5 origin-left bg-foreground" />
221-
<div className="absolute top-0 left-0 h-2 w-0.5 origin-top bg-foreground" />
222-
</div>
223-
</div>
224-
</div>
185+
</SciFiCard>
225186
</div>
226187
);
227188
}

0 commit comments

Comments
 (0)