Skip to content

Commit c22a059

Browse files
hasparushasparus
committed
Show [Become as speakser] if there is no /speakers page yet
1 parent 82b2971 commit c22a059

File tree

2 files changed

+27
-15
lines changed

2 files changed

+27
-15
lines changed

‎src/app/conf/2025/components/top-minds/index.tsx

Lines changed: 26 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -10,24 +10,28 @@ import tenmaiGopal from "./speakers/tenmai-gopal.webp"
1010
import uriGoldshtein from "./speakers/uri-goldshtein.webp"
1111
import TwitterIcon from "@/icons/twitter.svg"
1212
import { Button } from "@/app/conf/_design-system/button"
13+
import { BECOME_A_SPEAKER_LINK } from "../../links"
1314

14-
interface TopMindsSectionProps extends HTMLAttributes<HTMLElement> {}
15+
interface TopMindsSectionProps extends HTMLAttributes<HTMLElement> {
16+
hasSpeakersPage?: boolean
17+
}
1518

1619
export default function TopMindsSection({
1720
className,
21+
hasSpeakersPage,
1822
...rest
1923
}: TopMindsSectionProps) {
2024
return (
2125
<section
2226
className={clsx(
23-
"px-4 py-8 text-neu-900 max-md:flex-col lg:px-12 xl:gap-x-24 xl:px-24",
27+
"flex justify-center px-4 py-8 text-neu-900 max-md:flex-col lg:px-12 xl:gap-x-24 xl:px-24",
2428
className,
2529
)}
2630
{...rest}
2731
>
28-
<div className="mx-auto flex flex-wrap max-sm:flex-col [@media(width<907px)]:gap-y-6 [@media(width>=907px)]:*:border-b-0">
32+
<div className="flex flex-wrap max-sm:flex-col [@media(width<=743px)]:justify-center [@media(width>=970px)]:*:border-b-0">
2933
{/* todo: remaining socials */}
30-
<h3 className="mr-auto flex text-pretty pb-6 pr-6 typography-h2 [@media(width<907px)]:w-full [@media(width>=907px)]:w-[400px]">
34+
<h3 className="mr-auto flex w-full grow text-pretty pb-6 pr-6 typography-h2 [@media(width>857px)]:basis-0">
3135
Meet the top industry minds
3236
</h3>
3337
<SpeakerCard
@@ -43,21 +47,21 @@ export default function TopMindsSection({
4347
src={elizabethStone}
4448
linkedin="elizabeth-stone-608a754"
4549
/>
46-
<div className="flex grow border-sec-dark [@media(width<907px)]:contents [@media(width>=907px)]:border-t [@media(width>=907px)]:*:border-t-0">
50+
<div className="flex grow border-sec-dark [@media(width<970px)]:contents [@media(width>=970px)]:border-t [@media(width>=970px)]:*:border-t-0">
4751
<SpeakerCard
4852
name="Kamil Kisiela"
4953
title="The Guild — Developer"
5054
src={kamilKisiela}
5155
linkedin="kamilkisiela"
5256
twitter="kamilkisiela"
53-
className="[@media(744px<=width<=907px)]:first-of-type:border-l-0"
57+
className="[@media(744px<=width<=970px)]:first-of-type:border-l-0"
5458
/>
5559
<SpeakerCard
5660
name="Rajeev Rajan"
5761
title="Atlassian — CTO"
5862
src={rajeevRajan}
5963
linkedin="rajeev-rajan"
60-
className="[@media(744px<=width<=907px)]:border-l"
64+
className="[@media(744px<=width<=970px)]:border-l"
6165
/>
6266
<SpeakerCard
6367
name="Tenmai Gopal"
@@ -67,8 +71,16 @@ export default function TopMindsSection({
6771
linkedin="tanmaig"
6872
className="[@media(width<744px)]:border-l"
6973
/>
70-
<div className="mt-6 flex grow basis-[content] items-end justify-stretch pl-6 max-lg:w-full sm:justify-end">
71-
<Button variant="secondary">View all speakers</Button>
74+
<div className="mt-6 flex shrink-0 basis-[content] items-end justify-stretch max-lg:w-full max-sm:*:w-full sm:justify-end sm:pl-6 [@media(640px<=width<=855px)]:basis-[236px] [@media(width>855px)]:grow">
75+
{hasSpeakersPage ? (
76+
<Button variant="secondary" href="/conf/2025/speakers/">
77+
View all speakers
78+
</Button>
79+
) : (
80+
<Button variant="secondary" href={BECOME_A_SPEAKER_LINK}>
81+
Become a speaker
82+
</Button>
83+
)}
7284
</div>
7385
</div>
7486
</div>
@@ -94,7 +106,7 @@ function SpeakerCard({
94106
return (
95107
<article
96108
className={clsx(
97-
":border-r shrink-0 border-y border-r border-sec-dark first-of-type:border-l",
109+
":border-r shrink-0 border-y border-r border-sec-dark first-of-type:border-l max-sm:border-l",
98110
className,
99111
)}
100112
>
@@ -103,15 +115,15 @@ function SpeakerCard({
103115
alt=""
104116
width={236}
105117
height={236}
106-
className="aspect-square w-full object-cover transition-transform sm:size-[236px]"
118+
className="aspect-square size-[312px] w-full object-cover transition-transform sm:size-[236px]"
107119
/>
108120
<div className="flex items-stretch border-t border-sec-dark">
109-
<div className="flex h-[80px] grow flex-col justify-center gap-1 p-3">
121+
<div className="flex grow flex-col justify-center gap-1 p-3 sm:h-[80px]">
110122
<h4 className="typography-body-md">{name}</h4>
111123
<p className="text-neu-700 typography-body-xs">{title}</p>
112124
</div>
113125
{(linkedin || twitter) && (
114-
<div className="flex items-center border-l border-sec-dark sm:flex-col sm:border-l">
126+
<div className="flex items-center border-l border-sec-dark max-sm:divide-x sm:flex-col sm:divide-y sm:border-l">
115127
{linkedin && (
116128
<a
117129
href={`https://www.linkedin.com/in/${linkedin}`}
@@ -127,7 +139,7 @@ function SpeakerCard({
127139
href={`https://x.com/${twitter}`}
128140
target="_blank"
129141
rel="noopener noreferrer"
130-
className="flex grow items-center justify-center p-4 transition-colors hover:bg-neu-900/10 hover:text-neu-700 sm:p-2"
142+
className="flex grow items-center justify-center border-sec-dark p-4 transition-colors hover:bg-neu-900/10 hover:text-neu-700 sm:p-2"
131143
>
132144
<TwitterIcon className="size-6" />
133145
</a>

‎src/app/conf/2025/page.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ export default function Page() {
2323
<div className="gql-conf-container mx-auto">
2424
<RegisterToday className="md:mb-8 md:mt-24" />
2525
<WhatToExpectSection className="md:mb-8 md:mt-24" />
26-
<TopMindsSection className="md:mb-8 md:mt-24" />
26+
<TopMindsSection className="md:mb-8 md:mt-24" hasSpeakersPage={false} />
2727
</div>
2828
<div className="container my-20 flex flex-col gap-20 md:my-32 md:gap-32 [.light_&_.text-white]:text-neu-900 [.light_&_[alt='Grafbase_logo']]:invert">
2929
<Sponsors />

0 commit comments

Comments
 (0)