Skip to content

Commit 2d528d8

Browse files
iRenanMatthewiRenanMatthew
committed
fix: polish the styling, contents, and desktop to mobile responsiveness
1 parent 824ad13 commit 2d528d8

21 files changed

+193
-2783
lines changed

‎app/home/templates/home/components/navbar.html‎

Lines changed: 18 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,8 @@
11
{% load static %}
22
<nav class="absolute w-full z-10">
33
<div class="relative flex flex-col">
4+
{% comment %}
5+
<!-- Ribbon CTA -->
46
<div class="bg-orange-1 py-1.5 flex items-center justify-center gap-2">
57
<p class="text-white font-nunito text-sm font-semibold">
68
👋 Registration for PyCon APAC 2025 is now open!
@@ -13,9 +15,18 @@
1315
</a>
1416
</div>
1517
</div>
18+
{% endcomment %}
1619

17-
<div class="bg-transparent w-[1260px] mx-auto flex pt-8">
20+
<div class="bg-transparent w-full max-w-[1260px] mx-auto flex pt-8">
21+
22+
<!-- Site Logo -->
1823
<div class="navbar-start">
24+
<a class="btn btn-ghost text-xl">
25+
<img src="{% static 'img/logo.png' %}"
26+
alt="PythonAsia 2026"
27+
class="h-8 w-full max-w-[233px]" />
28+
</a>
29+
{% comment %}
1930
<div class="dropdown">
2031
<div tabindex="0" role="button" class="btn btn-ghost lg:hidden">
2132
<svg xmlns="http://www.w3.org/2000/svg"
@@ -92,14 +103,13 @@
92103
</li>
93104
</ul>
94105
</div>
95-
<a class="btn btn-ghost text-xl">
96-
<img src="{% static 'img/logo.png' %}"
97-
alt="PythonAsia 2026"
98-
class="h-8 w-full max-w-[233px]" />
99-
</a>
106+
{% endcomment %}
100107
</div>
101108

109+
{% comment %}
102110
<div class="flex justify-end items-center gap-7 w-full">
111+
112+
<!-- Header Links -->
103113
<div class="hidden lg:flex">
104114
<ul class="menu menu-horizontal px-1">
105115
<li>
@@ -174,12 +184,14 @@
174184
</li>
175185
</ul>
176186
</div>
187+
<!-- Ticket Button -->
177188
<div>
178189
<a href="#" class="btn btn-primary btn-square lg:btn-wide">
179190
<span class="lg:inline font-bantayog py-3.5 px-8 text-xl">Get Tickets</span>
180191
</a>
181192
</div>
182193
</div>
194+
{% endcomment %}
183195
</div>
184196
</div>
185197
</nav>

‎app/home/templates/home/index.html‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
<div class="min-h-screen"
55
style="background-image: url('{% static 'img/background.png' %}')">
66
<!-- Navbar -->
7-
{% comment %}{% include "home/components/navbar.html" %}{% endcomment %}
7+
{% include "home/components/navbar.html" %}
88
<main>
99
<section id="hero" class="text-white text-center flex items-center pt-[170px]">
1010
<div class="container mx-auto px-6 bg-cover w-[960px] hero-content">
@@ -29,15 +29,15 @@
2929
<img src="{% static 'img/vectors/footer.png' %}" class="w-full block xl:mt-[-10em] xl:mb-[-7em]">
3030
</main>
3131
<!-- Section Break -->
32-
<div class="w-full py-0 my-0 z-10 -mb-25 hidden xl:block">
32+
<div class="w-full py-0 my-0 z-10 -mb-25 hidden xl:block cstm_break">
3333
<img src="{% static 'img/vectors/section-break-1.svg' %}"
3434
alt="Section Break"
3535
class="w-full block">
3636
</div>
3737
<!-- About Us Section -->
3838
{% include "home/sections/about-us.html" %}
3939
<!-- Section Break -->
40-
<div class="w-full py-0 my-0 z-10 -mt-25">
40+
<div class="w-full py-0 my-0 z-10 -mt-25 cstm_break about-us_break">
4141
<img src="{% static 'img/vectors/section-break-2.svg' %}"
4242
alt="Section Break"
4343
class="w-full block">
@@ -47,7 +47,7 @@
4747
<!-- Why Python Section -->
4848
{% include "home/sections/why-python.html" %}
4949
<!-- What is PyCon Section -->
50-
{% include "home/sections/what-is-python-asia.html" %}
50+
{% comment%}{% include "home/sections/what-is-python-asia.html" %}{% endcomment%}
5151
<!-- Announcement Section -->
5252
{% include "home/sections/announcement-section.html" %}
5353
<!-- When? Where? Section -->

‎app/home/templates/home/sections/about-us.html‎

Lines changed: 37 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,14 @@
11
{% load static %}
22
<section id="about-us"
3-
class="py-20 mt-5 text-white"
3+
class="py-20 text-white"
44
style="background-color: #BD4B06">
55
<div class="container mx-auto px-6">
66
<!-- Header -->
77
<div class="text-center mb-16">
88
<h2 class="text-5xl md:text-6xl font-bold mb-12 font-td_pinoy">What is PythonAsia?</h2>
99
</div>
1010
<!-- Main Content -->
11-
<div class="text-center px-8 md:px-16 lg:px-24">
11+
<div class="text-center px-8 md:px-16 lg:px-24 w-full max-w-[975px] mx-auto">
1212
<h3 class="text-2xl font-bold mb-6 uppercase font-bantayog">
1313
The Flagship Gathering for Python Enthusiasts Across Asia - Uniting Diverse Communities across the region
1414
</h3>
@@ -34,97 +34,97 @@ <h3 class="text-2xl font-bold mb-6 uppercase font-bantayog">
3434
</div>
3535
</div>
3636
<!-- 3 Days Section -->
37-
<div class="mb-12">
37+
<div class="mb-12 w-full max-w-[1160px] mx-auto">
3838
<h3 class="text-5xl font-bold mb-8 font-td_pinoy">3 Days, Endless Possibilities</h3>
39-
<p class="text-lg leading-relaxed">
39+
<p class="text-lg leading-relaxed font-nunito">
4040
Dive into three days of learning, building, and connecting with the Python community. From inspiring talks to hands-on sprints, PythonAsia is where ideas spark, skills grow, and collaborations begin. Whether you're a first-time attendee or a seasoned contributor, there's something here for everyone.
4141
</p>
4242
</div>
4343
<!-- Features Grid -->
44-
<div class="grid md:grid-cols-2 gap-8 mb-16">
44+
<div class="grid lg:grid-cols-3 md:grid-cols-3 sm:grid-cols-2 gap-10 mb-16 w-full max-w-[1160px] mx-auto">
4545
<!-- Inspiring Keynotes -->
4646
<div>
47-
<div class="inline-block p-4 mb-4">
48-
<img src="{% static 'img/vectors/conversation-icon.svg' %}"
47+
<div class="inline-block mb-2">
48+
<img src="{% static 'img/vectors/star-icon.svg' %}"
4949
alt="Inspiring Keynotes" />
5050
</div>
5151
<h4 class="text-xl font-bold uppercase mb-3 font-bantayog">Inspiring Keynotes</h4>
52-
<p class="text-sm font-nunito">
52+
<p class="text-sm font-nunito w-full max-w-[305px]">
5353
Hear inspiring talks from core contributors, community leaders, and innovators shaping Python across Asia and beyond
5454
</p>
5555
</div>
5656
<!-- Talks & Lightning Talks -->
5757
<div>
58-
<div class="inline-block p-4 mb-4">
58+
<div class="inline-block mb-2">
5959
<img src="{% static 'img/vectors/conversation-icon.svg' %}"
6060
alt="Talks & Lightning Talks" />
6161
</div>
6262
<h4 class="text-xl font-bold uppercase mb-3 font-bantayog">Talks & Lightning Talks</h4>
63-
<p class="text-sm font-nunito">
63+
<p class="text-sm font-nunito w-full max-w-[305px]">
6464
From deep-dive sessions to quick, punchy insights, learn from diverse voices across the Python community.
6565
</p>
6666
</div>
67-
<!-- Community Gatherings -->
68-
<div>
69-
<div class="inline-block p-4 mb-4">
70-
<img src="{% static 'img/vectors/hands-on-icon.svg' %}"
71-
alt="Community Gatherings" />
72-
</div>
73-
<h4 class="text-xl font-bold uppercase mb-3 font-bantayog">Community Gatherings</h4>
74-
<p class="text-sm font-nunito">
75-
Join special sessions like the PyLadies Lunch, Open Spaces, and Group Lunch—designed to spark conversations and build connections.
76-
</p>
77-
</div>
7867
<!-- Multi-Track & Live Workshops -->
7968
<div>
80-
<div class="inline-block p-4 mb-4">
81-
<img src="{% static 'img/vectors/star-icon.svg' %}"
69+
<div class="inline-block mb-2">
70+
<img src="{% static 'img/vectors/icon-multitrack-and-live.svg' %}"
8271
alt="Multi-Track & Live Workshops" />
8372
</div>
8473
<h4 class="text-xl font-bold uppercase mb-3 font-bantayog">Multi-Track & Live Workshops</h4>
85-
<p class="text-sm font-nunito">
74+
<p class="text-sm font-nunito w-full max-w-[305px]">
8675
Dive into AI/ML, Data Science, DevOps, Open Source, and region-specific use cases powering real-world impact.
8776
</p>
8877
</div>
78+
<!-- Community Gatherings -->
79+
<div>
80+
<div class="inline-block mb-2">
81+
<img src="{% static 'img/vectors/icon-community-gatherings.svg' %}"
82+
alt="Community Gatherings" />
83+
</div>
84+
<h4 class="text-xl font-bold uppercase mb-3 font-bantayog">Community Gatherings</h4>
85+
<p class="text-sm font-nunito w-full max-w-[305px]">
86+
Join special sessions like the PyLadies Lunch, Open Spaces, and Group Lunch—designed to spark conversations and build connections.
87+
</p>
88+
</div>
8989
<!-- Career Mixer -->
9090
<div>
91-
<div class="inline-block p-4 mb-4">
92-
<img src="{% static 'img/vectors/star-icon.svg' %}" alt="Career Mixer" />
91+
<div class="inline-block mb-2">
92+
<img src="{% static 'img/vectors/icon-career-mixer.svg' %}" alt="Career Mixer" />
9393
</div>
9494
<h4 class="text-xl font-bold uppercase mb-3 font-bantayog">Career Mixer</h4>
95-
<p class="text-sm font-nunito">
95+
<p class="text-sm font-nunito w-full max-w-[305px]">
9696
Meet potential employers, collaborators, and mentors in a relaxed, networking-focused environment.
9797
</p>
9898
</div>
9999
<!-- Sponsor Booths & Stamp Quest -->
100100
<div>
101-
<div class="inline-block p-4 mb-4">
102-
<img src="{% static 'img/vectors/star-icon.svg' %}"
101+
<div class="inline-block mb-2">
102+
<img src="{% static 'img/vectors/icon-sponsor-booths.svg' %}"
103103
alt="Sponsor Booths & Stamp Quest" />
104104
</div>
105105
<h4 class="text-xl font-bold uppercase mb-3 font-bantayog">Sponsor Booths & Stamp Quest</h4>
106-
<p class="text-sm font-nunito">
106+
<p class="text-sm font-nunito w-full max-w-[305px]">
107107
Explore sponsor showcases, discover new opportunities, and complete our signature Stamp Collection Quest for fun tokens, prizes, and new connections.
108108
</p>
109109
</div>
110110
<!-- Open Source Sprints -->
111111
<div>
112-
<div class="inline-block p-4 mb-4">
113-
<img src="{% static 'img/vectors/star-icon.svg' %}"
112+
<div class="inline-block mb-2">
113+
<img src="{% static 'img/vectors/hands-on-icon.svg' %}"
114114
alt="Open Source Sprints" />
115115
</div>
116116
<h4 class="text-xl font-bold uppercase mb-3 font-bantayog">Open Source Sprints</h4>
117-
<p class="text-sm font-nunito">
117+
<p class="text-sm font-nunito w-full max-w-[305px]">
118118
Team up with maintainers and peers (bring your laptop!) to contribute to open source, then connect at our career fair.
119119
</p>
120120
</div>
121121
<!-- Education Summit -->
122122
<div>
123-
<div class="inline-block p-4 mb-4">
124-
<img src="{% static 'img/vectors/star-icon.svg' %}" alt="Education Summit" />
123+
<div class="inline-block mb-2">
124+
<img src="{% static 'img/vectors/icon-education-summit.svg' %}" alt="Education Summit" />
125125
</div>
126126
<h4 class="text-xl font-bold uppercase mb-3 font-bantayog">Education Summit</h4>
127-
<p class="text-sm font-nunito">
127+
<p class="text-sm font-nunito w-full max-w-[305px]">
128128
Co-organized with De La Salle University (DLSU), this special track brings together educators, students, and practitioners to explore how Python is shaping learning and research in Asia
129129
</p>
130130
</div>
@@ -134,7 +134,7 @@ <h4 class="text-xl font-bold uppercase mb-3 font-bantayog">Education Summit</h4>
134134
<p class="text-lg mb-2 uppercase tracking-wide font-bantayog">
135135
Join hundreds of developers, students, educators, researchers, and community leaders from across Asia for 3 days of
136136
</p>
137-
<h3 class="text-5xl md:text-6xl font-bold uppercase font-td_pinoy">Learning, Inspiration, and Connection</h3>
137+
<h3 class="md:text-6xl sm:text-4xl font-bold uppercase font-td_pinoy">Learning, Inspiration, and Connection</h3>
138138
</div>
139139
</div>
140140
</section>

0 commit comments

Comments
 (0)