Skip to content

Commit 4f19838

Browse files
anistarkanistark
committed
fixing sizes
1 parent 23ee30e commit 4f19838

File tree

1 file changed

+24
-89
lines changed

1 file changed

+24
-89
lines changed

‎src/_includes/landing/keynotes.njk‎

Lines changed: 24 additions & 89 deletions
Original file line numberDiff line numberDiff line change
@@ -1,118 +1,53 @@
11
{% from "components/cube.njk" import cube %}
22

3-
<section class="relative bg-lavender text-black w-full pb-12 md:px-40 lg:px-28 xl:px-40 lg:pb-40">
4-
<div class="black-han-sans-regular md:justify-center md:text-center pt-28 pb-8 md:pt-24 font-normal text-4xl lg:text-5xl text-[#000000] text-center lg:text-left">
3+
<section class="relative bg-lavender text-black w-full pb-12 px-4 md:px-40 lg:px-28 xl:px-40 lg:pb-40">
4+
<div class="black-han-sans-regular text-center lg:text-left pt-28 pb-8 md:pt-24 font-normal text-4xl lg:text-5xl text-[#000000]">
55
Keynote Speakers
66
</div>
7-
<div class="lg:flex xl:flex pt-10 lg:pl-2 xl:pl-12 hidden md:hidden">
8-
<div class="flex items-center justify-left w-full h-full">
9-
<img src="{{ env.baseUrl }}img/speakers/katharinejarmul.png" alt="Katharine Jarmul" class="w-1/4 h-1/4 object-contain">
10-
</div>
11-
{#
12-
<div class="group relative motion-safe:transform motion-safe:hover:-translate-y-12 transition duration-700 ease-in-out motion-safe:translate-y-20 translate-x-0 ml-7 z-10" data-cube="2">
13-
{% call cube(dimen=200, bg="lime") -%}
14-
<div class="flex items-center justify-center w-full h-full">
15-
<img src="{{ env.baseUrl }}img/logo.png" alt="PyCon India Logo" class="w-3/4 h-3/4 object-contain">
16-
</div>
17-
{%- endcall %}
18-
<p>Announcing Soon!</p>
19-
</div>
20-
<div class="group relative motion-safe:transform motion-safe:translate-y-0 motion-safe:hover:translate-y-12 transition duration-700 ease-in-out ml-7" data-cube="3">
21-
{% call cube(dimen=200, bg="purple") -%}
22-
<div class="flex items-center justify-center w-full h-full">
23-
<img src="{{ env.baseUrl }}img/logo.png" alt="PyCon India Logo" class="w-3/4 h-3/4 object-contain">
24-
</div>
25-
{%- endcall %}
26-
<p>Announcing Soon!</p>
27-
</div>
28-
<div class="group relative motion-safe:transform motion-safe:hover:-translate-y-12 transition duration-700 ease-in-out motion-safe:translate-y-20 ml-7" data-cube="4">
29-
{% call cube(dimen=200, bg="lime") -%}
7+
8+
<div class="flex flex-col md:flex-row md:flex-wrap lg:flex-nowrap items-center justify-center lg:justify-start gap-8 md:gap-12 lg:gap-8 pt-10 lg:pl-2 xl:pl-12">
9+
<div class="flex-shrink-0">
10+
<div class="group relative motion-safe:transform motion-safe:translate-y-0 motion-safe:hover:-translate-y-6 md:motion-safe:hover:-translate-y-12 transition duration-700 ease-in-out">
3011
<div class="flex items-center justify-center w-full h-full">
31-
<img src="{{ env.baseUrl }}img/logo.png" alt="PyCon India Logo" class="w-3/4 h-3/4 object-contain">
12+
<img src="{{ env.baseUrl }}img/speakers/katharinejarmul.png"
13+
alt="Katharine Jarmul"
14+
class="w-64 h-64 md:w-80 md:h-80 lg:w-96 lg:h-96 object-contain">
3215
</div>
33-
{%- endcall %}
34-
<p>Announcing Soon!</p>
35-
</div>
36-
#}
37-
</div>
38-
<!-- Medium Devices -->
39-
<div class="md:flex flex-col pt-36 pb-20 pl-12 space-y-44 lg:hidden hidden">
40-
<div class="flex justify-start">
41-
<div class="group relative motion-safe:transform motion-safe:translate-y-0 motion-safe:hover:-translate-y-24 transition duration-700 ease-in-out">
42-
<div class="flex items-center justify-left w-full h-full">
43-
<img src="{{ env.baseUrl }}img/speakers/katharinejarmul.png" alt="Katharine Jarmul" class="w-1/2 h-1/2 object-contain">
44-
</div>
45-
</div>
46-
{#
47-
<div class="group relative motion-safe:transform motion-safe:hover:translate-y-48 ml-28 transition duration-700 ease-in-out">
48-
{% call cube(dimen=200, bg="lime") -%}
49-
<div class="flex items-center justify-center w-full h-full">
50-
<img src="{{ env.baseUrl }}img/logo.png" alt="PyCon India Logo" class="w-3/4 h-3/4 object-contain">
51-
</div>
52-
{%- endcall %}
53-
<p>Announcing Soon!</p>
54-
</div>
55-
</div>
56-
<div class="flex justify-start">
57-
<div class="group relative motion-safe:transform motion-safe:translate-y-0 motion-safe:hover:-translate-y-24 transition duration-700 ease-in-out">
58-
{% call cube(dimen=200, bg="purple") -%}
59-
<div class="flex items-center justify-center w-full h-full">
60-
<img src="{{ env.baseUrl }}img/logo.png" alt="PyCon India Logo" class="w-3/4 h-3/4 object-contain">
61-
</div>
62-
{%- endcall %}
63-
<p>Announcing Soon!</p>
64-
</div>
65-
<div class="group relative motion-safe:transform motion-safe:hover:translate-y-48 ml-28 transition duration-700 ease-in-out">
66-
{% call cube(dimen=200, bg="lime") -%}
67-
<div class="flex items-center justify-center w-full h-full">
68-
<img src="{{ env.baseUrl }}img/logo.png" alt="PyCon India Logo" class="w-3/4 h-3/4 object-contain">
69-
</div>
70-
{%- endcall %}
71-
<p>Announcing Soon!</p>
72-
</div>
73-
#}
74-
</div>
75-
</div>
76-
<!-- Small Devices -->
77-
<div class="flex flex-col space-y-20 px-4 pt-16 pb-16 items-center md:hidden">
78-
<div class="flex-shrink-0">
79-
<div class="group relative motion-safe:transform motion-safe:translate-y-0 motion-safe:hover:-translate-y-24 transition duration-700 ease-in-out" data-cube="1">
80-
<div class="flex items-center justify-left w-full h-full">
81-
<img src="{{ env.baseUrl }}img/speakers/katharinejarmul.png" alt="Katharine Jarmul" class="w-1/2 h-1/2 object-contain">
82-
</div>
8316
</div>
8417
</div>
18+
8519
{#
8620
<div class="flex-shrink-0">
87-
<div class="group relative motion-safe:transform motion-safe:translate-y-0 motion-safe:hover:-translate-y-24 transition duration-700 ease-in-out" data-cube="1">
88-
{% call cube(width=214, height=208, depth=31, bg="purple") -%}
21+
<div class="group relative motion-safe:transform motion-safe:translate-y-0 motion-safe:hover:translate-y-6 md:motion-safe:hover:translate-y-12 transition duration-700 ease-in-out">
22+
{% call cube(dimen=256, bg="lime") -%}
8923
<div class="flex items-center justify-center w-full h-full">
90-
<img src="{{ env.baseUrl }}img/logo.png" alt="Date background" class="w-3/4 h-3/4 object-contain">
24+
<img src="{{ env.baseUrl }}img/logo.png" alt="PyCon India Logo" class="w-3/4 h-3/4 object-contain">
9125
</div>
9226
{%- endcall %}
93-
<p>Announcing Soon!</p>
27+
<p class="text-center mt-4 text-sm md:text-base">Announcing Soon!</p>
9428
</div>
9529
</div>
30+
9631
<div class="flex-shrink-0">
97-
<div class="group relative motion-safe:transform motion-safe:translate-y-0 motion-safe:hover:-translate-y-24 transition duration-700 ease-in-out" data-cube="1">
98-
{% call cube(width=214, height=208, depth=31, bg="purple") -%}
32+
<div class="group relative motion-safe:transform motion-safe:translate-y-0 motion-safe:hover:-translate-y-6 md:motion-safe:hover:-translate-y-12 transition duration-700 ease-in-out">
33+
{% call cube(dimen=256, bg="purple") -%}
9934
<div class="flex items-center justify-center w-full h-full">
100-
<img src="{{ env.baseUrl }}img/logo.png" alt="Date background" class="w-3/4 h-3/4 object-contain">
35+
<img src="{{ env.baseUrl }}img/logo.png" alt="PyCon India Logo" class="w-3/4 h-3/4 object-contain">
10136
</div>
10237
{%- endcall %}
103-
<p>Announcing Soon!</p>
38+
<p class="text-center mt-4 text-sm md:text-base">Announcing Soon!</p>
10439
</div>
10540
</div>
10641
<div class="flex-shrink-0">
107-
<div class="group relative motion-safe:transform motion-safe:translate-y-0 motion-safe:hover:-translate-y-24 transition duration-700 ease-in-out" data-cube="1">
108-
{% call cube(width=214, height=208, depth=31, bg="purple") -%}
42+
<div class="group relative motion-safe:transform motion-safe:translate-y-0 motion-safe:hover:translate-y-6 md:motion-safe:hover:translate-y-12 transition duration-700 ease-in-out">
43+
{% call cube(dimen=256, bg="lime") -%}
10944
<div class="flex items-center justify-center w-full h-full">
110-
<img src="{{ env.baseUrl }}img/logo.png" alt="Date background" class="w-3/4 h-3/4 object-contain">
45+
<img src="{{ env.baseUrl }}img/logo.png" alt="PyCon India Logo" class="w-3/4 h-3/4 object-contain">
11146
</div>
11247
{%- endcall %}
113-
<p>Announcing Soon!</p>
48+
<p class="text-center mt-4 text-sm md:text-base">Announcing Soon!</p>
11449
</div>
11550
</div>
116-
#}
51+
#}
11752
</div>
11853
</section>

0 commit comments

Comments
 (0)