Skip to content

Commit 17694d4

Browse files
authored
Hackathon details (#347)
* fix: modify api.ts * fix: remove google auth buttom * fix: fixes responsive fixes on organization * fix: minor fixes * fix: modify create organization * fix: modify create organization * fix: fix organization permission * fix: merge into main * feat: hackathon overview page * feat: hackathon overview page * feat: implement participant overview * feat: implement participant overview * feat: implement resources tab * feat: implement the submission tab * feat: implement comment tab * fix: implement provider for hackathon * fix: implement provider for hackathon * fix: minor fixes * fix: hackathon banner * fix: hackathon banner * fix: fix organization page
1 parent 4e8d0bc commit 17694d4

8 files changed

Lines changed: 453 additions & 213 deletions

File tree

app/(landing)/bounties/page.tsx

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
import React from 'react';
2+
import { Metadata } from 'next';
3+
import { generatePageMetadata } from '@/lib/metadata';
4+
5+
export const metadata: Metadata = generatePageMetadata('grants');
6+
7+
const GrantPage = () => {
8+
return (
9+
<div className='mx-auto mt-10 max-w-[1440px] px-5 py-5 text-center text-4xl font-bold text-white md:px-[50px] lg:px-[100px]'>
10+
Bounties Page
11+
</div>
12+
);
13+
};
14+
15+
export default GrantPage;

components/FeatureFuture.tsx

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
'use client';
2+
3+
import React from 'react';
4+
import { Badge } from '@/components/ui/badge';
5+
import { cn } from '@/lib/utils';
6+
7+
interface FutureFeatureProps {
8+
children: React.ReactNode;
9+
label?: string;
10+
className?: string;
11+
disabledClass?: string;
12+
badgeClassName?: string;
13+
}
14+
15+
export function FutureFeature({
16+
children,
17+
label = 'Coming Soon',
18+
className,
19+
disabledClass = 'pointer-events-none opacity-50',
20+
badgeClassName,
21+
}: FutureFeatureProps) {
22+
return (
23+
<div className={cn('relative inline-flex items-center', className)}>
24+
<div className={disabledClass}>{children}</div>
25+
26+
<Badge
27+
variant='secondary'
28+
className={cn(
29+
'py-0.2 absolute -top-3.5 -right-2 bg-amber-50/45 px-1 text-[10px]',
30+
badgeClassName
31+
)}
32+
>
33+
{label}
34+
</Badge>
35+
</div>
36+
);
37+
}

components/Project-Page-Hero.tsx

Lines changed: 31 additions & 107 deletions
Original file line numberDiff line numberDiff line change
@@ -1,80 +1,57 @@
11
'use client';
22
import React from 'react';
3-
import Image from 'next/image';
43
import { ArrowDown } from 'lucide-react';
54
import { BoundlessButton } from './buttons/BoundlessButton';
65

76
export default function ProjectPageHero() {
87
const scrollToProjects = () => {
9-
const projectsSection = document.getElementById('explore-project');
10-
if (projectsSection) {
11-
const targetPosition = projectsSection.offsetTop - 100;
12-
const startPosition = window.pageYOffset;
13-
const distance = targetPosition - startPosition;
14-
const duration = 1000;
15-
let start: number | null = null;
8+
const section = document.getElementById('explore-project');
9+
if (!section) return;
1610

17-
const animation = (currentTime: number) => {
18-
if (start === null) start = currentTime;
19-
const timeElapsed = currentTime - start;
20-
const run = easeInOutQuad(
21-
timeElapsed,
22-
startPosition,
23-
distance,
24-
duration
25-
);
26-
window.scrollTo(0, run);
27-
if (timeElapsed < duration) requestAnimationFrame(animation);
28-
};
11+
const targetPosition = section.offsetTop - 100;
12+
const startPosition = window.pageYOffset;
13+
const distance = targetPosition - startPosition;
14+
const duration = 1000;
15+
let start: number | null = null;
2916

30-
const easeInOutQuad = (t: number, b: number, c: number, d: number) => {
31-
t /= d / 2;
32-
if (t < 1) return (c / 2) * t * t + b;
33-
t--;
34-
return (-c / 2) * (t * (t - 2) - 1) + b;
35-
};
17+
const easeInOutQuad = (t: number, b: number, c: number, d: number) => {
18+
t /= d / 2;
19+
if (t < 1) return (c / 2) * t * t + b;
20+
t--;
21+
return (-c / 2) * (t * (t - 2) - 1) + b;
22+
};
3623

37-
requestAnimationFrame(animation);
38-
}
24+
const animation = (currentTime: number) => {
25+
if (start === null) start = currentTime;
26+
const timeElapsed = currentTime - start;
27+
const run = easeInOutQuad(timeElapsed, startPosition, distance, duration);
28+
window.scrollTo(0, run);
29+
if (timeElapsed < duration) requestAnimationFrame(animation);
30+
};
31+
32+
requestAnimationFrame(animation);
3933
};
4034

4135
return (
42-
<div className='relative min-h-screen overflow-hidden text-white'>
43-
<div className='pointer-events-none absolute inset-0'>
44-
<div className='absolute bottom-1/3 left-[220px] h-[393px] w-[476px] rounded-[476px] border-[20px] border-[#DBFFB7] opacity-[0.30px] mix-blend-overlay blur-[25px] md:block lg:!hidden' />
45-
<div
46-
className='absolute bottom-1/3 left-[200px] h-[397px] w-[493px] rounded-[493px] border-[100px] border-[#6DC01A] opacity-[0.15px] mix-blend-hard-light blur-[100px] md:block lg:!hidden'
47-
style={{
48-
background:
49-
'linear-gradient(270deg, rgba(3, 3, 3, 0.00) 0%, rgba(109, 192, 26, 0.64) 100%)',
50-
}}
51-
/>
52-
<div
53-
className='absolute top-1/4 left-[100px] h-[560px] w-[696px] rounded-[696px] bg-[#A7F950] opacity-10 blur-[140px] md:block lg:!hidden'
54-
style={{
55-
background:
56-
'linear-gradient(270deg, rgba(3, 3, 3, 0.00) 0%, rgba(167, 249, 80, 0.64) 100%)',
57-
}}
58-
/>
59-
</div>
60-
36+
<div className='bg-background-card relative overflow-hidden rounded-2xl px-6 py-10 text-white'>
6137
<div className='relative z-10'>
62-
<div className='mx-auto grid min-h-[85vh] max-w-[1300px] items-center gap-6 space-y-[60px] md:grid-cols-2 md:gap-8 md:space-y-[80px] lg:gap-12'>
38+
<div className='mx-auto grid max-w-[1300px] items-center justify-baseline gap-6 md:grid-cols-2 md:gap-8 lg:gap-12'>
39+
{/* Left Text */}
6340
<div className='z-10 space-y-6 text-left md:space-y-6 lg:space-y-8'>
64-
<h1 className='text-3xl leading-[1.1] tracking-tight sm:text-4xl md:text-4xl lg:text-5xl'>
41+
<h1 className='text-3xl leading-[1.1] tracking-tight sm:text-4xl md:text-4xl lg:text-3xl'>
6542
<span className='bg-gradient-to-r from-[#3AE6B2] to-[#A7F95080] bg-clip-text text-transparent'>
6643
Discover projects
67-
</span>
68-
<br />
69-
<span className='text-white'>that are shaping</span>
70-
<br />
71-
<span className='text-white'>the future on Stellar</span>
44+
</span>{' '}
45+
that are shaping the future on Stellar
7246
</h1>
7347

7448
<p className='max-w-[300px] text-base font-normal text-white md:max-w-[350px] lg:max-w-[400px]'>
7549
Validated by the community. Backed milestone by milestone.
7650
</p>
51+
</div>
7752

53+
{/* Buttons */}
54+
<div className='flex flex-col gap-4 sm:flex-row'>
7855
<BoundlessButton
7956
onClick={scrollToProjects}
8057
size='xl'
@@ -86,59 +63,6 @@ export default function ProjectPageHero() {
8663
</span>
8764
</BoundlessButton>
8865
</div>
89-
90-
<div className='relative hidden h-[60vh] md:block lg:h-[70vh]'>
91-
<div className='relative mx-auto w-full'>
92-
<div className='h-full w-full overflow-hidden rounded-2xl bg-black shadow-2xl shadow-black/80'>
93-
<div className='relative h-full w-full'>
94-
<Image
95-
src='/projects.png'
96-
alt='Project cards showcase'
97-
width={520}
98-
height={580}
99-
className='h-auto w-full rounded-lg object-cover'
100-
priority
101-
/>
102-
</div>
103-
</div>
104-
</div>
105-
</div>
106-
<div
107-
className='bg-gradient-radial pointer-events-none absolute inset-0 hidden rounded-lg from-transparent via-transparent to-black md:block'
108-
style={{
109-
background:
110-
'linear-gradient(0deg, #030303 0%, rgba(3, 3, 3, 0.80) 20%, rgba(3, 3, 3, 0.44) 41.63%, rgba(3, 3, 3, 0.02) 55.9%, rgba(3, 3, 3, 0.90) 80%, #030303 100%)',
111-
}}
112-
/>
113-
<div
114-
className='bg-gradient-radial pointer-events-none absolute inset-0 hidden rounded-lg from-transparent via-transparent to-black md:block'
115-
style={{
116-
background:
117-
'linear-gradient(270deg, #030303 0%, rgba(3, 3, 3, 0.24) 18%, rgba(3, 3, 3, 0.24) 40%, #030303 53.9%, rgba(3, 3, 3, 0.00) 100%)',
118-
}}
119-
/>
120-
121-
<div className='md:hidden lg:hidden'>
122-
<div className='mx-auto max-w-sm overflow-hidden rounded-xl border border-[#1A1A1A] bg-black p-6 shadow-2xl shadow-black/80'>
123-
<div className='relative'>
124-
<Image
125-
src='/projects-mobile.png'
126-
alt='Project cards showcase'
127-
width={320}
128-
height={420}
129-
className='h-auto w-full rounded-lg'
130-
priority
131-
/>
132-
<div
133-
className='pointer-events-none absolute inset-0 rounded-lg'
134-
style={{
135-
background:
136-
'radial-gradient(circle at center, transparent 25%, rgba(0,0,0,0.5) 55%, black 80%)',
137-
}}
138-
/>
139-
</div>
140-
</div>
141-
</div>
14266
</div>
14367
</div>
14468
</div>

0 commit comments

Comments
 (0)