Skip to content

Commit 750dea0

Browse files
euxiaSamshh
euxia
authored and
Samshh
committed
feat: new branch based from DY-49 for cleaner commit history
1 parent 7ce4e2d commit 750dea0

6 files changed

Lines changed: 247 additions & 6 deletions

File tree

‎app/speak/page.tsx‎

Lines changed: 199 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,199 @@
1+
'use client';
2+
3+
import React from 'react';
4+
import Image from 'next/image';
5+
import { Button } from '@/components/ui/button';
6+
7+
const handleRedirect = (url: string) => {
8+
if (typeof window !== 'undefined') {
9+
window.open(url, '_blank');
10+
}
11+
};
12+
13+
const SpeakDetails: React.FC = () => {
14+
return (
15+
<section>
16+
<div className="flex-column max-w-7xl mx-auto pl-8 md:pl-12 lg:pl-16">
17+
{/* Main Container - Always Horizontal */}
18+
<div className="flex flex-row items-center justify-start w-full mt-8 md:mt-10 lg:mt-10">
19+
{/* Left Section - Text & Small Logo */}
20+
<div className="w-1/2">
21+
<h1 className="text-[#FFFFFF] [@media(max-width:380px)]:text-[20px] text-[25px] sm:text-[44px] md:text-[47px] lg:text-[65px] font-black leading-[1.3]">
22+
Share Your <br />
23+
Knowledge <br />
24+
<div className="flex items-center space-x-2 md:space-x-5">
25+
<span>with</span>
26+
<Image
27+
src="/assets/speakIcons/logoName.svg"
28+
alt="DurianPy"
29+
width={0}
30+
height={0}
31+
className="mt-1 sm:mt-1 md:mt-1 w-auto [@media(max-width:380px)]:h-6 h-8 sm:h-14 md:h-15 lg:h-20"
32+
/>
33+
</div>
34+
</h1>
35+
<p className="text-gray-300 my-4 md:my-8 lg:my-12 leading-tight [@media(max-width:392px)]:text-[6px] text-[8px] sm:text-[12px] md:text-[14px] lg:text-[18px]">
36+
We are excited to have you as a speaker. <br />
37+
<span>Help inspire the Python community in Davao.</span>
38+
</p>
39+
<Button
40+
onClick={() =>
41+
handleRedirect('https://forms.gle/x2cc6CrRhbhDeaxe9')
42+
}
43+
className="bg-yellow-500 text-black font-medium py-2 md:py-2 lg:py-3 px-4 md:px-5 lg:px-7 [@media(max-width:320px)]:text-[6px] text-[10px] md:text-[14px] lg:text-[18px] rounded-full hover:bg-yellow-600 transition-all duration-300 ease-out hover:scale-105"
44+
>
45+
Submit a Talk Proposal
46+
</Button>
47+
</div>
48+
49+
{/* Right Section - Large Logo */}
50+
<div className="w-1/2">
51+
<div className="ml-4 flex justify-end md:mt-5 lg:mt-10 relative ">
52+
<Image
53+
src="/assets/speakIcons/glowBg.svg"
54+
alt="Glow BG"
55+
width={0}
56+
height={0}
57+
className="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[300px] h-[300px] md:w-[700px] md:h-[700px] lg:w-[800px] lg:h-[1000px] rounded-full blur-3xl saturate-100 brightness-150 z-0"
58+
/>
59+
<div className="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[125px] h-[150px] md:w-[300px] md:h-[300px] lg:w-[400px] lg:h-[400px] bg-green-600/20 rounded-full blur-3xl z-0"></div>
60+
61+
{/* Logo */}
62+
<Image
63+
src="/assets/speakIcons/logoIcon.svg"
64+
alt="DurianPy Logo"
65+
width={0}
66+
height={0}
67+
className="w-[250px] sm:w-[350px] md:w-[400px] lg:w-[500px] relative z-10"
68+
/>
69+
</div>
70+
</div>
71+
</div>
72+
<div className="container text-white mt-10 ">
73+
<h1 className="[@media(max-width:380px)]:text-[20px] text-[25px] sm:text-[45px] md:text-[50px] lg:text-[60px] font-bold mb-6 lg:mb-8">
74+
Submission <span className="text-[#FFC201]">Guidelines </span>
75+
</h1>
76+
77+
<div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-2 lg:grid-cols-2 gap-8 mr-8 md:mr-12 lg:mr-20 mx-10 lg:mx-0">
78+
{/* Left Column */}
79+
<div className="space-y-8">
80+
{/* What to be Mindful of */}
81+
<div className="relative pl-3 before:absolute before:left-0 before:top-0 before:bottom-0 before:w-[0.25px] before:bg-white">
82+
<h2 className="[@media(max-width:380px)]:text-[16px] text-[16px] sm:text-[20px] md:text-[25px] lg:text-[28px] font-semibold mb-2">
83+
What to be Mindful of
84+
</h2>
85+
<p className="[@media(max-width:392px)]:text-[8px] text-[8px] sm:text-[12px] md:text-[14px] lg:text-[16px] text-gray-300">
86+
DurianPy welcomes developers of <br /> all experience levels -
87+
beginners to experts
88+
</p>
89+
</div>
90+
91+
{/* What to Avoid */}
92+
<div className="relative pl-3 before:absolute before:left-0 before:top-0 before:bottom-0 before:w-[0.25px] before:bg-white">
93+
<h2 className="[@media(max-width:380px)]:text-[16px] text-[16px] sm:text-[20px] md:text-[25px] lg:text-[28px] font-semibold mb-2">
94+
What to Avoid
95+
</h2>
96+
<div className="[@media(max-width:392px)]:text-[8px] text-[8px] sm:text-[12px] md:text-[14px] lg:text-[16px]">
97+
<p className="text-gray-300">
98+
Too much code without explanation.{' '}
99+
</p>{' '}
100+
<span>Proprietary code with no open-source reference </span>
101+
</div>
102+
</div>
103+
</div>
104+
105+
{/* Right Column */}
106+
<div className="space-y-8">
107+
{/* What to Include */}
108+
<div className="relative pl-3 before:absolute before:left-0 before:top-0 before:bottom-0 before:w-[0.25px] before:bg-white">
109+
<h2 className="[@media(max-width:380px)]:text-[16px] text-[16px] sm:text-[20px] md:text-[25px] lg:text-[28px] font-semibold mb-2">
110+
What to Include
111+
</h2>
112+
<div className="[@media(max-width:392px)]:text-[8px] text-[8px] sm:text-[12px] md:text-[14px] lg:text-[16px]">
113+
<p className=" text-gray-300">How can people reach you? </p>{' '}
114+
<span>Where they can find your slides or code </span>
115+
</div>
116+
</div>
117+
118+
{/* Helpful Resources */}
119+
<div className="relative pl-3 before:absolute before:left-0 before:top-0 before:bottom-0 before:w-[0.25px] before:bg-white">
120+
<h2 className="[@media(max-width:380px)]:text-[16px] text-[16px] sm:text-[20px] md:text-[25px] lg:text-[28px] font-semibold mb-2">
121+
Helpful Resources
122+
</h2>
123+
<div className="[@media(max-width:392px)]:text-[8px] text-[8px] sm:text-[12px] md:text-[14px] lg:text-[16px]">
124+
<a
125+
onClick={() =>
126+
handleRedirect(
127+
'https://us.pycon.org/2014/speaking/proposal_advice/'
128+
)
129+
}
130+
className="hover:underline block cursor-pointer"
131+
>
132+
Great Advice for Giving Talks
133+
</a>
134+
<a
135+
onClick={() =>
136+
handleRedirect('https://forms.gle/x2cc6CrRhbhDeaxe9')
137+
}
138+
className="hover:underline block cursor-pointer"
139+
>
140+
Submit Talk
141+
</a>
142+
</div>
143+
</div>
144+
</div>
145+
</div>
146+
<div className="mt-8 lg:mt-14">
147+
148+
<Button
149+
onClick={() => handleRedirect('mailto:durianpy.davao@gmail.com')}
150+
className="bg-yellow-500 text-black font-medium py-2 md:py-2 lg:py-3 px-4 md:px-5 lg:px-7 [@media(max-width:320px)]:text-[6px] text-[10px] md:text-[14px] lg:text-[18px] rounded-full hover:bg-yellow-600 transition-all duration-300 ease-out hover:scale-105"
151+
>
152+
Have Questions?
153+
</Button>
154+
</div>
155+
</div>
156+
157+
<div className="container text-white mt-10 lg:mt-20">
158+
<h1 className="[@media(max-width:380px)]:text-[20px] text-[28px] sm:text-[40px] md:text-[45px] lg:text-[60px] font-bold">
159+
Google <span className="text-[#FFC201]"> Forms </span>
160+
</h1>
161+
<div className="[@media(max-width:392px)]:text-[8px] text-[8px] sm:text-[12px] md:text-[14px] lg:text-[16px] text-gray-300 mt-3 mb-7 lg:mb-5 ">
162+
<p>
163+
Please fill out the Google Form for the Call for Speakers,
164+
providing your bio, topic, and relevant experience.{' '}
165+
</p>{' '}
166+
<span> We look forward to reviewing your application </span>
167+
</div>
168+
<div
169+
className="mr-10 relative p-[5px] bg-gradient-to-l from-yellow-400 via-green-400 to-green-600"
170+
style={{
171+
borderTopLeftRadius: '75px',
172+
borderBottomRightRadius: '75px',
173+
borderTopRightRadius: '0px',
174+
borderBottomLeftRadius: '0px',
175+
}}
176+
>
177+
<iframe
178+
src="https://docs.google.com/forms/d/e/1FAIpQLScTPUrZ8Xkfl2hsSlUZt0qzN7tE3zKt5e30d1OcI52YOsnrQg/viewform?embedded=true"
179+
width="100%"
180+
height="550"
181+
className="h-[250px] md:h-[350px] lg:h-[550px] bg-white rounded-lg"
182+
style={{
183+
border: 'none',
184+
borderTopLeftRadius: '75px',
185+
borderBottomRightRadius: '75px',
186+
borderTopRightRadius: '0px',
187+
borderBottomLeftRadius: '0px',
188+
overflow: 'hidden',
189+
}}
190+
allowFullScreen
191+
></iframe>
192+
</div>
193+
</div>
194+
</div>
195+
</section>
196+
);
197+
};
198+
199+
export default SpeakDetails;

‎components/navs/public/DesktopView.tsx‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -66,9 +66,7 @@ export default function DesktopView() {
6666
</DropdownMenu>
6767
<Button
6868
variant={'navLink'}
69-
onClick={() =>
70-
redirectTo({ href: 'https://forms.gle/x2cc6CrRhbhDeaxe9' })
71-
}
69+
onClick={() => router.push('/speak')}
7270
className={`${pathname === '/speak' ? 'text-primary border-primary' : ''}`}
7371
>
7472
Speak

‎components/navs/public/MobileView.tsx‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -101,9 +101,7 @@ export default function MobileView() {
101101
</Button>
102102
<Button
103103
variant={'navLinkMobile'}
104-
onClick={() =>
105-
redirectTo({ href: 'https://forms.gle/x2cc6CrRhbhDeaxe9' })
106-
}
104+
onClick={() => router.push('/speak')}
107105
>
108106
Speak
109107
</Button>

‎public/assets/speakIcons/glowBg.svg‎

Lines changed: 16 additions & 0 deletions
Loading

‎public/assets/speakIcons/logoIcon.svg‎

Lines changed: 21 additions & 0 deletions
Loading

‎public/assets/speakIcons/logoName.svg‎

Lines changed: 9 additions & 0 deletions
Loading

0 commit comments

Comments
 (0)