Skip to content

Commit 13c7f99

Browse files
Astraxx04Astraxx04
committed
speaker section
1 parent 2262fd9 commit 13c7f99

File tree

4 files changed

+183
-1
lines changed

4 files changed

+183
-1
lines changed

‎src/_data/speakers.json

Lines changed: 70 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,70 @@
1+
[
2+
{
3+
"name": "Jon Doe",
4+
"email": "[email protected]",
5+
"imageLink": "https://www.citypng.com/public/uploads/preview/white-user-member-guest-icon-png-image-701751695037005zdurfaim0y.png",
6+
"socials": {
7+
"youtube": "https://github.com/indiVar0508",
8+
"linkedin": "https://github.com/indiVar0508",
9+
"github": "https://github.com/indiVar0508",
10+
"twitter": "https://github.com/indiVar0508",
11+
"insta": "https://github.com/indiVar0508",
12+
"web": "https://github.com/indiVar0508"
13+
}
14+
},
15+
{
16+
"name": "Jon Doe",
17+
"email": "[email protected]",
18+
"imageLink": "",
19+
"socials": {
20+
"youtube": "https://github.com/indiVar0508",
21+
"linkedin": "https://github.com/indiVar0508",
22+
"github": "https://github.com/indiVar0508",
23+
"twitter": "https://github.com/indiVar0508"
24+
}
25+
},
26+
{
27+
"name": "Jon Doe",
28+
"email": "[email protected]",
29+
"imageLink": "https://www.citypng.com/public/uploads/preview/white-user-member-guest-icon-png-image-701751695037005zdurfaim0y.png?v=2025060801",
30+
"socials": {
31+
"youtube": "https://github.com/indiVar0508",
32+
"linkedin": "https://github.com/indiVar0508",
33+
"github": "https://github.com/indiVar0508",
34+
"twitter": "https://github.com/indiVar0508"
35+
}
36+
},
37+
{
38+
"name": "Jon Doe",
39+
"email": "[email protected]",
40+
"imageLink": "https://www.citypng.com/public/uploads/preview/white-user-member-guest-icon-png-image-701751695037005zdurfaim0y.png?v=2025060801",
41+
"socials": {
42+
"youtube": "https://github.com/indiVar0508",
43+
"linkedin": "https://github.com/indiVar0508",
44+
"github": "https://github.com/indiVar0508",
45+
"twitter": "https://github.com/indiVar0508"
46+
}
47+
},
48+
{
49+
"name": "Jon Doe",
50+
"email": "[email protected]",
51+
"imageLink": "https://www.citypng.com/public/uploads/preview/white-user-member-guest-icon-png-image-701751695037005zdurfaim0y.png?v=2025060801",
52+
"socials": {
53+
"youtube": "https://github.com/indiVar0508",
54+
"linkedin": "https://github.com/indiVar0508",
55+
"github": "https://github.com/indiVar0508",
56+
"twitter": "https://github.com/indiVar0508"
57+
}
58+
},
59+
{
60+
"name": "Jon Doe",
61+
"email": "[email protected]",
62+
"imageLink": "https://www.citypng.com/public/uploads/preview/white-user-member-guest-icon-png-image-701751695037005zdurfaim0y.png?v=2025060801",
63+
"socials": {
64+
"youtube": "https://github.com/indiVar0508",
65+
"linkedin": "https://github.com/indiVar0508",
66+
"github": "https://github.com/indiVar0508",
67+
"twitter": "https://github.com/indiVar0508"
68+
}
69+
}
70+
]

‎src/_includes/navbar.njk

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,8 @@
1212
"hasSubmenu": true,
1313
"submenu": [
1414
{"name": "Venue", "link": "venue"},
15-
{"name": "FAQ's", "link": "about/faqs"}
15+
{"name": "FAQ's", "link": "about/faqs"},
16+
{"name": "Speakers", "link": "about/speakers"}
1617
]
1718
},
1819
{

‎src/about/speakers.njk

Lines changed: 92 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,92 @@
1+
---
2+
title: Speakers - PyCon India 2025
3+
description: PyCon India 2025 Speakers
4+
layout: base.njk
5+
---
6+
7+
<div class="w-full h-auto px-[6%] -mb-16 md:mb-0 flex flex-col md:flex-row">
8+
<div class="pt-32 pb-8 md:pb-32 w-full lg:w-[70%]">
9+
<div class="black-han-sans-regular font-normal text-3xl md:text-5xl md:text-center text-[#000000] text-center lg:text-left">
10+
Speakers
11+
</div>
12+
</div>
13+
<div class="lg:w-[30%] w-[80%] lg:mt-40 items-center justify-center mx-auto hidden lg:block">
14+
<img src="{{ env.baseUrl }}img/assets/tetris-stars.svg" alt="Guide" class="w-[80%] transition-transform duration-100" style="animation: floating 2s ease-in-out infinite;">
15+
</div>
16+
</div>
17+
18+
19+
<div class="main-container pt-24 pb-72 lg:pb-40 md:pt-16 w-full text-black h-auto px-[6%]">
20+
<div class="">
21+
<div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-10 ">
22+
{% for person in speakers %}
23+
<div class="flex flex-col items-start pb-4">
24+
<!-- Responsive Image with 4:3 ratio -->
25+
<div class="w-full h-32 md:h-48 border border-black relative bg-pycon-purple">
26+
<div class="absolute inset-0">
27+
{% if person.imageLink %}
28+
<img src="{{ person.imageLink }}" alt="{{ person.name }}"
29+
class="w-full h-full object-cover transition-transform duration-500 ease-in-out hover:translate-x-4 hover:-translate-y-4 hover:shadow-2xl" />
30+
{% else %}
31+
<div class="w-full h-full bg-pycon-blue transition-transform duration-500 ease-in-out hover:translate-x-4 hover:-translate-y-4 hover:shadow-2xl">
32+
</div>
33+
{% endif %}
34+
</div>
35+
</div>
36+
37+
38+
<!-- Name -->
39+
<p class="mt-4 mb-1 text-xl font-light text-center">{{ person.name }}</p>
40+
41+
<!-- Socials -->
42+
<div class="flex justify-center items-left gap-1 md:gap-4 flex-wrap">
43+
{% if person.socials.linkedin %}
44+
<a href="{{ person.socials.linkedin }}" target="_blank" aria-label="LinkedIn" class="p-1 rounded-full outline outline-1 outline-lime-300 flex justify-center items-center hover:scale-110 hover:text-[#4E62F5] transition-transform duration-200 no-underline">
45+
<i class="fab fa-linkedin text-sm md:text-xl"></i>
46+
</a>
47+
{% endif %}
48+
{% if person.socials.web %}
49+
<a href="{{ person.socials.web }}" target="_blank" aria-label="Website" class="p-1 rounded-full outline outline-1 outline-lime-300 flex justify-center items-center hover:scale-110 hover:text-[#4E62F5] transition-transform duration-200 no-underline">
50+
<i class="fa fa-globe text-sm md:text-xl"></i>
51+
</a>
52+
{% endif %}
53+
{% if person.socials.twitter %}
54+
<a href="{{ person.socials.twitter }}" target="_blank" aria-label="Twitter" class="p-1 rounded-full outline outline-1 outline-lime-300 flex justify-center items-center hover:scale-110 hover:text-[#4E62F5] transition-transform duration-200 no-underline">
55+
<i class="fab fa-x-twitter text-sm md:text-xl"></i>
56+
</a>
57+
{% endif %}
58+
{% if person.socials.github %}
59+
<a href="{{ person.socials.github }}" target="_blank" aria-label="GitHub" class="p-1 rounded-full outline outline-1 outline-lime-300 flex justify-center items-center hover:scale-110 hover:text-[#4E62F5] transition-transform duration-200 no-underline">
60+
<i class="fab fa-github text-sm md:text-xl"></i>
61+
</a>
62+
{% endif %}
63+
{% if person.socials.youtube %}
64+
<a href="{{ person.socials.youtube }}" target="_blank" aria-label="YouTube" class="p-1 rounded-full outline outline-1 outline-lime-300 flex justify-center items-center hover:scale-110 hover:text-[#4E62F5] transition-transform duration-200 no-underline">
65+
<i class="fab fa-youtube text-sm md:text-xl"></i>
66+
</a>
67+
{% endif %}
68+
{% if person.socials.insta %}
69+
<a href="{{ person.socials.insta }}" target="_blank" aria-label="Instagram" class="p-1 rounded-full outline outline-1 outline-lime-300 flex justify-center items-center hover:scale-110 hover:text-[#4E62F5] transition-transform duration-200 no-underline">
70+
<i class="fab fa-instagram text-sm md:text-xl"></i>
71+
</a>
72+
{% endif %}
73+
</div>
74+
</div>
75+
{% endfor %}
76+
</div>
77+
</div>
78+
79+
</div>
80+
81+
82+
83+
<style>
84+
.pop-up-right {
85+
transition: transform 0.4s ease, box-shadow 0.4s ease;
86+
}
87+
88+
.pop-up-right:hover {
89+
transform: translateY(-10px) translateX(10px) scale(1.05);
90+
box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.3);
91+
}
92+
</style>

‎src/static/img/assets/tetris-stars.svg

Lines changed: 19 additions & 0 deletions
Loading

0 commit comments

Comments
 (0)