Skip to content

Commit 3491c58

Browse files
hasparushasparus
committed
Use FOST colors
1 parent dbda4e1 commit 3491c58

5 files changed

Lines changed: 80 additions & 66 deletions

File tree

‎src/app/day/2026/components/cta-card-section/index.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ export function CtaCardSection({
2727
<h2 className="typography-d1 text-neu-0 dark:text-neu-900">
2828
{heading}
2929
</h2>
30-
<p className="typography-body-lg max-w-[555px] text-pretty text-neu-50 dark:text-neu-200">
30+
<p className="typography-body-lg max-w-[555px] text-pretty text-neu-50 dark:text-neu-800">
3131
{description}
3232
</p>
3333
</div>

‎src/app/day/2026/components/event-partners.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -9,14 +9,14 @@ export function EventPartnersSection() {
99
<div className="flex items-center justify-center">
1010
<Anchor
1111
href="https://www.joinfost.io"
12-
className="p-8 hover:bg-neu-100"
12+
className="p-8 hover:bg-neu-100 dark:hover:bg-neu-50/25"
1313
>
1414
<img
1515
src={fostLogo.src}
1616
alt="FOST - Future of Software Technologies"
17-
width={360}
18-
height={120}
19-
className="h-16 w-auto"
17+
width={240}
18+
height={80}
19+
className="h-12 w-auto"
2020
/>
2121
</Anchor>
2222
</div>

‎src/app/day/2026/components/hero/index.tsx‎

Lines changed: 13 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@ export function Hero(props: HeroProps) {
3030
return (
3131
<article
3232
className={clsx(
33-
"gql-conf-navbar-strip relative isolate flex flex-col justify-center selection:bg-blk/40 before:bg-white/30 before:dark:bg-blk/40",
33+
"gql-conf-navbar-strip relative flex flex-col justify-center selection:bg-blk/40 before:bg-white/30 before:dark:bg-blk/40",
3434
colorScheme === "primary"
3535
? "bg-pri-base text-neu-0 dark:bg-pri-darker dark:text-neu-900 dark:selection:bg-white/40"
3636
: "bg-neu-100 dark:bg-neu-50/25",
@@ -55,9 +55,16 @@ export function Hero(props: HeroProps) {
5555
<h1 className="typography-d1">{props.pageName}</h1>
5656
</div>
5757
) : (
58-
<h1 className="typography-d1 flex flex-wrap gap-2">
58+
<h1 className="typography-d1 flex flex-wrap gap-2 leading-none">
5959
<span>GraphQL Day</span>
60-
<span className="text-sec-base">
60+
<span
61+
className={clsx(
62+
"typography-h1 w-full",
63+
colorScheme === "primary"
64+
? "text-sec-base"
65+
: "text-pri-base",
66+
)}
67+
>
6168
{props.year || props.subtitle}
6269
</span>
6370
</h1>
@@ -129,8 +136,9 @@ export function HeroStripes({ className, ...rest }: HeroStripesProps) {
129136
}}
130137
>
131138
<StripesDecoration
132-
evenClassName="bg-[linear-gradient(180deg,hsl(var(--color-pri-light))_0%,hsl(319deg_100%_90%_/_0.2)_100%)] dark:bg-[linear-gradient(180deg,hsl(var(--color-pri-dark))_0%,hsl(319_100%_20%_/_1)_100%)]"
133-
oddClassName="bg-[linear-gradient(180deg,hsl(319deg_100%_90%_/_0.2)_0%,hsl(var(--color-pri-base))_100%)] dark:bg-[linear-gradient(180deg,hsl(319_100%_30%_/_1)_0%,hsl(var(--color-pri-dark))_100%)]"
139+
evenClassName="bg-[linear-gradient(in_oklch_180deg,hsl(var(--color-pri-light))_0%,hsl(29.7deg_100%_45.1%/_0)_100%)] dark:bg-[linear-gradient(in_oklch_180deg,hsl(var(--color-pri-base)/0.1)_0%,hsl(var(--color-pri-dark)_/.35)_100%)]"
140+
// hsl(29.7deg, 86.1%, 45.1%)
141+
oddClassName="bg-[linear-gradient(180deg,hsl(319deg_100%_90%_/_0.2)_0%,hsl(var(--color-pri-base))_100%)] dark:bg-[linear-gradient(180deg,hsl(319_100%_30%_/_1)_0%,hsl(29.7deg_100%_45.1%_/_1)_100%)]"
134142
{...rest}
135143
/>
136144
</ImageLoaded>

‎src/app/day/2026/singapore/page.tsx‎

Lines changed: 44 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,8 @@ import { EventPartnersSection } from "../components/event-partners"
99
import { CtaCardSection } from "../components/cta-card-section"
1010
import { MarqueeRows } from "@/app/conf/2026/components/marquee-rows"
1111
import { PastSpeakersSection } from "../components/past-speakers"
12+
import { NavbarPlaceholder } from "../components/navbar"
13+
import { NavbarFixed } from "@/components/navbar/navbar-fixed"
1214

1315
const TICKET_LINK =
1416
"https://portal.joinfost.io/event/future-of-software-technologies-singapore-2026/9521470b-6661-4c85-8594-b74d9d7cf2e3/graphql-day-at-fost-singapore"
@@ -31,48 +33,51 @@ export const metadata: Metadata = {
3133

3234
export default function SingaporePage() {
3335
return (
34-
<main className="gql-all-anchors-focusable">
35-
<Hero subtitle="@ FOST Singapore">
36-
<HeroDateAndLocation
37-
date="April 14-15, 2026"
38-
dateTime="2026-04-14"
39-
location="Singapore"
40-
/>
41-
<div className="flex flex-wrap items-center gap-x-4 gap-y-2 max-sm:*:flex-1">
42-
<Button href={TICKET_LINK} className="whitespace-nowrap md:w-fit">
43-
Get your ticket
44-
</Button>
45-
</div>
46-
</Hero>
47-
<MarqueeRows
48-
variant="primary"
49-
className="pt-4 max-sm:pb-1 sm:pt-6 md:space-y-2 md:pt-12 xl:pt-16"
50-
items={MARQUEE_ITEMS}
51-
/>
52-
<AboutSection />
53-
<div className="gql-container gql-conf-navbar-strip text-neu-900 before:bg-white/40 before:dark:bg-blk/30">
54-
<WhyAttendSection />
55-
<BecomeASpeakerSection />
56-
<PastSpeakersSection />
57-
<EventPartnersSection />
36+
<>
37+
<NavbarPlaceholder className="top-0 bg-neu-100 before:bg-white/30 dark:bg-neu-50/50 dark:before:bg-blk/40" />
38+
<main className="gql-all-anchors-focusable">
39+
<Hero subtitle="@ FOST Singapore" colorScheme="neutral">
40+
<HeroDateAndLocation
41+
date="April 14-15, 2026"
42+
dateTime="2026-04-14"
43+
location="Singapore"
44+
/>
45+
<div className="flex flex-wrap items-center gap-x-4 gap-y-2 max-sm:*:flex-1">
46+
<Button href={TICKET_LINK} className="whitespace-nowrap md:w-fit">
47+
Get your ticket
48+
</Button>
49+
</div>
50+
</Hero>
51+
<AboutSection />
5852
<MarqueeRows
59-
variant="secondary"
60-
className="my-8 xl:mb-16 xl:mt-10"
53+
variant="primary"
54+
className="z-10 bg-neu-0 py-4 max-sm:pb-1 sm:py-6 md:space-y-2 md:py-12"
6155
items={MARQUEE_ITEMS}
6256
/>
63-
<CtaCardSection
64-
title="Get your ticket"
65-
description="Join us for a day of GraphQL talks, networking, and hands-on learning at FOST Singapore."
66-
>
67-
<Button
68-
href={TICKET_LINK}
69-
variant="primary"
70-
className="whitespace-nowrap"
57+
<div className="gql-container gql-conf-navbar-strip text-neu-900 before:bg-white/40 before:dark:bg-blk/30">
58+
<WhyAttendSection />
59+
<BecomeASpeakerSection />
60+
<PastSpeakersSection />
61+
<EventPartnersSection />
62+
<MarqueeRows
63+
variant="secondary"
64+
className="my-8 xl:mb-16 xl:mt-10"
65+
items={MARQUEE_ITEMS}
66+
/>
67+
<CtaCardSection
68+
title="Get your ticket"
69+
description="Join us for a day of GraphQL talks, networking, and hands-on learning at FOST Singapore."
7170
>
72-
Get your ticket
73-
</Button>
74-
</CtaCardSection>
75-
</div>
76-
</main>
71+
<Button
72+
href={TICKET_LINK}
73+
variant="primary"
74+
className="whitespace-nowrap"
75+
>
76+
Get your ticket
77+
</Button>
78+
</CtaCardSection>
79+
</div>
80+
</main>
81+
</>
7782
)
7883
}

‎src/app/day/page.tsx‎

Lines changed: 18 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -85,23 +85,7 @@ export default function DayIndexPage() {
8585
</p>
8686
<div className="mt-8 flex flex-col gap-4">
8787
{EVENTS.map(event => (
88-
<NextLink
89-
key={event.href}
90-
href={event.href}
91-
className="group flex items-center justify-between gap-6 border border-neu-200 p-6 hover:bg-neu-100 md:p-8"
92-
>
93-
<div className="flex flex-col gap-2">
94-
<h3 className="typography-h2 group-hover:underline">
95-
{event.city}
96-
</h3>
97-
<p className="typography-body-md text-neu-700">
98-
{event.date}, 2026
99-
</p>
100-
</div>
101-
<span className="typography-body-md hidden text-pri-base sm:block">
102-
GraphQL Day @ FOST {event.city}
103-
</span>
104-
</NextLink>
88+
<GraphQLDayEventCard key={event.id} event={event} />
10589
))}
10690
</div>
10791
</main>
@@ -110,3 +94,20 @@ export default function DayIndexPage() {
11094
</>
11195
)
11296
}
97+
98+
function GraphQLDayEventCard({ event }: { event: EventMapItem }) {
99+
return (
100+
<NextLink
101+
href={event.href}
102+
className="group flex items-center justify-between gap-6 border border-neu-200 p-6 hover:bg-neu-100 md:p-8"
103+
>
104+
<div className="flex flex-col gap-2">
105+
<h3 className="typography-h2 group-hover:underline">{event.city}</h3>
106+
<p className="typography-body-md text-neu-700">{event.date}, 2026</p>
107+
</div>
108+
<span className="typography-body-md hidden text-pri-base sm:block">
109+
GraphQL Day @ FOST {event.city}
110+
</span>
111+
</NextLink>
112+
)
113+
}

0 commit comments

Comments
 (0)