Skip to content

Commit 2f58a7d

Browse files
RajatRajdeepRajatRajdeep
authored
feat: update theme (#13)
1 parent b0ab524 commit 2f58a7d

File tree

12 files changed

+1791
-275
lines changed

12 files changed

+1791
-275
lines changed

‎data/conference.js‎

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ export const CONFERENCE = {
66
title: 'PyConf Hyderabad 2026 - Largest Python Conference in Hyderabad',
77
},
88
announcement:
9-
'Hyderabad’s biggest Python conference is on the way! Get ready for an unforgettable experience and stay tuned for updates!',
9+
'Hyderabad’s biggest Python conference is on the way! <br> Get ready for an unforgettable experience and stay tuned for updates!',
1010
siteURL: 'http://2026.pyconfhyd.org',
1111
copyrightTitle: 'Copyright @ 2026 PyConf Hyderabad',
1212
conferenceDate: '',
@@ -38,9 +38,12 @@ export const ASSETS = {
3838
navbarimgAlt: 'PyConf Hyderabad 2026 Python Logo',
3939
logoUrl: '/images/logo.svg',
4040
imgAlt: 'PyConf Hyderabad 2026 Logo',
41-
heroBannerUrl: '/images/hero-banner-bg.svg',
41+
heroBannerUrl: '/images/heroBannerBg.svg',
4242
heroBannerAlt:
43-
'Background image of colorful kites soaring in the sky on the hero banner',
43+
'A vibrant comic-style background featuring yellow and red explosive rays and dotted patterns radiating from the center.',
44+
footerBgUrl: '/images/footerBg.svg',
45+
footerBgAlt:
46+
'A comic-style background with yellow dotted patterns and explosion rays on the left, featuring a cartoon snake with wide eyes peeking from the right side.',
4447
monumentsSketchUrl: '/images/monumentsSketch.svg',
4548
monumentsSketchAlt:
4649
'Illustration showcasing various iconic monuments of Hyderabad.',
@@ -50,7 +53,7 @@ export const KEY_LINKS = {
5053
volunteerFormLabel: 'SIGN UP TO VOLUNTEER',
5154
volunteerFormUrl: 'https://forms.gle/XKpdqSX12husAXBB6',
5255
cfpLabel: 'SUBMIT YOUR PROPOSAL',
53-
cfpUrl: '',
56+
cfpUrl: 'https://www.papercall.io/pyconfhyd2026',
5457
interestedInSponsoringLabel: 'INTERESTED IN SPONSORING',
5558
interestedInSponsoringUrl: 'https://forms.gle/rLNiPdrSi3NZ772n9',
5659
sponsorshipProspectusLabel: 'SPONSORSHIP PROSPECTUS',

‎package-lock.json‎

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎public/images/footerBg.svg‎

Lines changed: 336 additions & 0 deletions
Loading

‎public/images/hero-banner-bg.svg‎

Lines changed: 0 additions & 111 deletions
This file was deleted.

‎public/images/heroBannerBg.svg‎

Lines changed: 1308 additions & 0 deletions
Loading

‎public/images/navbarLogo.svg‎

Lines changed: 24 additions & 24 deletions
Loading

‎src/app/code-of-conduct/page.jsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ export default function Page() {
1717
<Heading
1818
tagLevel={1}
1919
level={1}
20-
className="text-center my-8 text-secondary-600 dark:text-secondary-400"
20+
className="text-center my-8 text-primary-600 dark:text-primary-400"
2121
>
2222
Code Of Conduct
2323
</Heading>

‎src/components/Footer.jsx‎

Lines changed: 51 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -7,59 +7,67 @@ import { PAST_EDITIONS, PYCON_INDIA_HYDPY_PAST_EDITIONS } from '@/pastEditions';
77
import { Paragraph, Span } from '@/components/Typography';
88

99
const Footer = () => (
10-
<footer id="footer">
11-
<div
12-
className="mt-4 h-[100px] bg-center"
13-
style={{ backgroundImage: `url(${ASSETS.monumentsSketchUrl})` }}
14-
aria-label={ASSETS.monumentsSketchAlt}
15-
/>
16-
<div className="bg-gradient-to-r from-secondary-700 to-secondary-800 p-4">
17-
<div className="sm:w-9/12 flex flex-wrap justify-between mx-auto gap-3">
18-
{/* Contact Section */}
19-
<div className="flex flex-col mt-2">
20-
<Span className="font-medium text-gray-50">Contact Us On</Span>
21-
<div className="flex flex-wrap mt-2">
22-
{SOCIALS.map(({ url, ariaLabel, name }, index) => (
10+
<footer
11+
id="footer"
12+
className="
13+
w-screen
14+
p-4
15+
mt-4
16+
bg-secondary-700
17+
sm:bg-center
18+
md:bg-right-bottom
19+
"
20+
style={{
21+
backgroundImage: `url(${ASSETS.footerBgUrl})`,
22+
backgroundRepeat: 'no-repeat',
23+
backgroundSize: 'cover',
24+
}}
25+
aria-label={ASSETS.footerBgAlt}
26+
>
27+
<div className="sm:w-9/12 flex flex-wrap justify-between mx-auto gap-3">
28+
{/* Contact Section */}
29+
<div className="flex flex-col mt-2">
30+
<Span className="font-medium text-gray-50">Contact Us On</Span>
31+
<div className="flex flex-wrap mt-2">
32+
{SOCIALS.map(({ url, ariaLabel, name }, index) => (
33+
<Link
34+
key={index}
35+
className="text-gray-200 hover:text-gray-50 mr-2"
36+
href={url}
37+
target="_blank"
38+
aria-label={ariaLabel}
39+
rel="noopener noreferrer"
40+
>
41+
<Icon name={name} />
42+
</Link>
43+
))}
44+
</div>
45+
</div>
46+
47+
{/* Past Editions Section */}
48+
{[PAST_EDITIONS, PYCON_INDIA_HYDPY_PAST_EDITIONS].map(
49+
({ sectionTitle, editions }, idx) => (
50+
<div key={idx} className="flex flex-col mt-2">
51+
<Span className="font-medium text-gray-50">{sectionTitle}</Span>
52+
{editions.map(({ url, ariaLabel, year }, index) => (
2353
<Link
2454
key={index}
25-
className="text-gray-300 hover:text-gray-50 mr-2"
55+
className="text-gray-200 hover:text-gray-50 mt-1"
2656
href={url}
2757
target="_blank"
2858
aria-label={ariaLabel}
29-
rel="noopener noreferrer"
3059
>
31-
<Icon name={name} />
60+
<Span>{year}</Span>
3261
</Link>
3362
))}
3463
</div>
35-
</div>
36-
37-
{/* Past Editions Section */}
38-
{[PAST_EDITIONS, PYCON_INDIA_HYDPY_PAST_EDITIONS].map(
39-
({ sectionTitle, editions }, idx) => (
40-
<div key={idx} className="flex flex-col mt-2">
41-
<Span className="font-medium text-gray-50">{sectionTitle}</Span>
42-
{editions.map(({ url, ariaLabel, year }, index) => (
43-
<Link
44-
key={index}
45-
className="text-gray-300 hover:text-gray-50 mt-1"
46-
href={url}
47-
target="_blank"
48-
aria-label={ariaLabel}
49-
>
50-
<Span>{year}</Span>
51-
</Link>
52-
))}
53-
</div>
54-
)
55-
)}
56-
</div>
57-
58-
<hr className="h-px my-4 text-gray-50" />
59-
<Paragraph className="text-center text-gray-100">
60-
{CONFERENCE.copyrightTitle}
61-
</Paragraph>
64+
)
65+
)}
6266
</div>
67+
68+
<Paragraph className="text-center my-4 text-gray-100">
69+
{CONFERENCE.copyrightTitle}
70+
</Paragraph>
6371
</footer>
6472
);
6573

‎src/components/Header.jsx‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@ const NavItem = ({
3434
href={item.path}
3535
className={`${
3636
activePath === item.path
37-
? 'text-primary-700 dark:text-primary-600'
37+
? 'text-primary-700 dark:text-primary-500'
3838
: 'text-gray-950 dark:text-gray-50'
3939
}`}
4040
aria-current={activePath === item.path ? 'page' : undefined}
@@ -48,7 +48,7 @@ const NavItem = ({
4848
<div
4949
className={`${
5050
activePath === item.path || activePath.split('#')[0] === item.path
51-
? 'text-primary-700 dark:text-primary-600'
51+
? 'text-primary-700 dark:text-primary-500'
5252
: 'text-gray-950 dark:text-gray-50'
5353
}`}
5454
>
@@ -75,7 +75,7 @@ const NavItem = ({
7575
href={child.path}
7676
className={`block py-2 px-4 rounded hover:bg-gray-200 dark:hover:bg-gray-700 ${
7777
activePath === child.path
78-
? 'text-primary-700 dark:text-primary-600'
78+
? 'text-primary-700 dark:text-primary-500'
7979
: 'text-gray-950 dark:text-gray-50'
8080
}`}
8181
onClick={() => handleItemClick(child)}
@@ -114,7 +114,7 @@ const Header = ({ themeToggle }) => {
114114
};
115115

116116
return (
117-
<header className="bg-gray-50 dark:bg-gray-900 p-4 shadow-lg sticky top-0 z-10">
117+
<header className="bg-gray-50 dark:bg-gray-900 py-4 px-8 shadow-lg sticky top-0 z-10">
118118
<nav className="flex flex-wrap items-center justify-between mx-auto">
119119
<Link
120120
href="/"
@@ -124,8 +124,8 @@ const Header = ({ themeToggle }) => {
124124
<Image
125125
src={ASSETS.navbarLogoUrl}
126126
alt={ASSETS.navbarimgAlt}
127-
width={100}
128-
height={42}
127+
width={150}
128+
height={93}
129129
/>
130130
</Link>
131131
<div className="flex items-center gap-1">

‎src/components/Hero.jsx‎

Lines changed: 19 additions & 60 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,19 @@
11
import Image from 'next/image';
22

3-
import { Heading, Span } from '@/components/Typography';
3+
import { Heading, Paragraph, Span } from '@/components/Typography';
44
import Icon from '@/components/Icon';
55
import { CONFERENCE, ASSETS, KEY_LINKS } from '@/conference';
66
import Link from 'next/link';
77

88
const Hero = () => {
99
return (
1010
<section
11-
className="w-full"
11+
className="
12+
w-screen
13+
aspect-[9/16] sm:aspect-[3/4] md:aspect-[4/3] lg:aspect-[21/9]
14+
bg-primary-400 dark:bg-primary-600
15+
max-h-screen
16+
"
1217
style={{
1318
backgroundImage: `url(${ASSETS.heroBannerUrl})`,
1419
backgroundPosition: 'center',
@@ -22,88 +27,42 @@ const Hero = () => {
2227
<Heading tagLevel={1} level={1} className="hidden">
2328
{CONFERENCE.title}
2429
</Heading>
25-
<div className="relative w-full md:w-2/3 aspect-video my-4">
30+
<div className="relative w-full md:w-1/2 aspect-video mt-4">
2631
<Image
2732
src={ASSETS.logoUrl}
2833
alt={ASSETS.imgAlt}
2934
priority={true}
3035
fill
3136
/>
3237
</div>
33-
<Span
38+
<Paragraph
3439
level={1}
35-
className="text-center text-gray-600 dark:text-gray-400"
36-
>
37-
{CONFERENCE.announcement}
38-
</Span>
39-
{/* <div className="flex items-center">
40-
<Icon
41-
name="Calendar"
42-
size={26}
43-
className="text-secondary-600 dark:text-secondary-400"
44-
/>
45-
<Span
46-
level={1}
47-
className="text-center font-semibold ml-2 text-secondary-600 dark:text-secondary-400"
48-
>
49-
{CONFERENCE.dates}
50-
</Span>
51-
</div> */}
52-
{/* <div className="flex">
53-
<Span
54-
level={3}
55-
className="text-center font-semibold ml-2 mt-2 text-secondary-600 dark:text-secondary-400"
56-
>
57-
Conference: {CONFERENCE.conferenceDate} | Venue:{' '}
58-
</Span>
59-
<Link
60-
className="underline font-semibold ml-1 mt-2 text-secondary-600 dark:text-secondary-400"
61-
href={CONFERENCE.conferenceMapsLink}
62-
target="_blank"
63-
rel="noopener noreferrer"
64-
>
65-
<Span level={3}>{CONFERENCE.conferenceVenue}</Span>
66-
</Link>
67-
</div>
68-
<div className="flex">
69-
<Span
70-
level={3}
71-
className="text-center font-semibold ml-2 mt-2 text-secondary-600 dark:text-secondary-400"
72-
>
73-
Workshop: {CONFERENCE.workshopDate} | Venue:{' '}
74-
</Span>
75-
<Link
76-
className="underline font-semibold ml-1 mt-2 text-secondary-600 dark:text-secondary-400"
77-
href={CONFERENCE.workshopMapsLink}
78-
target="_blank"
79-
rel="noopener noreferrer"
80-
>
81-
<Span level={3}>{CONFERENCE.workshopVenue}</Span>
82-
</Link>
83-
</div> */}
84-
<div className="flex flex-col sm:flex-row pt-4">
40+
className="text-center text-gray-900 dark:text-gray-50 mt-4"
41+
dangerouslySetInnerHTML={{ __html: CONFERENCE.announcement }}
42+
/>
43+
<div className="flex flex-col sm:flex-row mt-8">
8544
<Link
8645
href={KEY_LINKS.interestedInSponsoringUrl}
8746
target="_blank"
8847
className="flex justify-center"
8948
rel="noopener noreferrer"
9049
>
91-
<button className="inline-flex mt-2 sm:mr-4 items-center bg-primary-600 px-5 py-3 font-medium hover:bg-primary-700 text-gray-50 border rounded-lg">
92-
<Icon name="VolunteerActivism" size={20} />
50+
<button className="inline-flex mt-2 sm:mr-4 items-center bg-secondary-500 px-5 py-3 font-bold text-lg hover:bg-secondary-700 text-gray-50 border-4 border-gray-900 rounded-lg shadow-[4px_4px_0px_0px_rgba(0,0,0,1)] hover:shadow-[6px_6px_0px_0px_rgba(0,0,0,1)] hover:translate-x-[-2px] hover:translate-y-[-2px] transition-all transform">
51+
<Icon name="ExternalLink" size={20} />
9352
<Span className="ml-2">
9453
{KEY_LINKS.interestedInSponsoringLabel}
9554
</Span>
9655
</button>
9756
</Link>
9857
<Link
99-
href={KEY_LINKS.volunteerFormUrl}
58+
href={KEY_LINKS.cfpUrl}
10059
target="_blank"
10160
className="flex justify-center"
10261
rel="noopener noreferrer"
10362
>
104-
<button className="inline-flex mt-2 sm:mr-4 items-center bg-secondary-600 px-5 py-3 font-medium hover:bg-secondary-700 text-gray-50 border rounded-lg">
105-
<Icon name="VolunteerActivism" size={20} />
106-
<Span className="ml-2">{KEY_LINKS.volunteerFormLabel}</Span>
63+
<button className="inline-flex mt-2 sm:mr-4 items-center bg-accent-500 px-5 py-3 font-bold text-lg hover:bg-accent-700 text-gray-900 border-4 border-gray-900 rounded-lg shadow-[4px_4px_0px_0px_rgba(0,0,0,1)] hover:shadow-[6px_6px_0px_0px_rgba(0,0,0,1)] hover:translate-x-[-2px] hover:translate-y-[-2px] transition-all transform">
64+
<Icon name="MdCampaign" size={24} />
65+
<Span className="ml-2">{KEY_LINKS.cfpLabel}</Span>
10766
</button>
10867
</Link>
10968
</div>

0 commit comments

Comments
 (0)