diff --git a/apps/www/components/SupabaseSelectPromo/index.tsx b/apps/www/components/SupabaseSelectPromo/index.tsx new file mode 100644 index 0000000000..018358b2b1 --- /dev/null +++ b/apps/www/components/SupabaseSelectPromo/index.tsx @@ -0,0 +1,148 @@ +import React from 'react' +import Link from 'next/link' +import Image from 'next/image' + +import { Button } from 'ui' +import { DecorativeProgressBar } from '~/components/SurveyResults/DecorativeProgressBar' +import './styles.css' + +const SupabaseSelectPromo = () => { + const monoStyle = 'text-sm font-mono uppercase leading-none tracking-wide text-white/50' + const gridUnit = 24 + const logoWidth = 320 + const speakerImgWidth = gridUnit * 12 // 288px + const gridWidth = gridUnit * 26 // 624px + const selectSiteUrl = 'https://select.supabase.com/' + const headerText = ['Our first user conference', 'Oct 3 2025', '@ YC Offices, SF'] + const mainText = [ + 'The conference for builders', + 'Speakers include Figma CEO Dylan Field, Vercel CEO Guillermo Rauch, and Firebase Co-Founder James Tamplin', + ] + const speakers = [ + { + name: 'Dylan Field', + slug: 'dylan-field', + title: 'CEO of Figma', + }, + { + name: 'Guillermo Rauch', + slug: 'guillermo-rauch', + title: 'CEO of Vercel', + }, + { + name: 'James Tamplin', + slug: 'james-tamplin', + title: 'Co-Founder of Firebase', + }, + ] + + return ( +
+ {/* Main centered content */} +
+
+ {/* Header */} +
+ {Object.entries(headerText).map(([index, value]: [string, string]) => ( +

+ {value} +

+ ))} +
+ {/* Main text, CTA, and images */} +
+ {/* Speaker image */} + {speakers[0].name} + {/* Logo and speaker name */} +
+ {/* Logo */} + + Supabase Select + + {/* Speaker name */} + +
+ +
+ {/* Grid background */} +
+
+ +
+ {/* Main text */} +
+

{mainText[0]}

+

{mainText[1]}

+
+ {/* CTA */} + +
+
+
+
+
+ ) +} + +export { SupabaseSelectPromo as default } diff --git a/apps/www/components/SupabaseSelectPromo/styles.css b/apps/www/components/SupabaseSelectPromo/styles.css new file mode 100644 index 0000000000..cd65e478f3 --- /dev/null +++ b/apps/www/components/SupabaseSelectPromo/styles.css @@ -0,0 +1,8 @@ +/* Font face definitions also used in Launch Week 15 */ +@font-face { + font-family: 'SuisseIntl-Book'; + src: url('/fonts/launchweek/15/SuisseIntl-Book.otf') format('opentype'); + font-weight: 400; + font-style: normal; + font-display: swap; +} diff --git a/apps/www/components/SurveyResults/StateOfStartupsHeader.tsx b/apps/www/components/SurveyResults/StateOfStartupsHeader.tsx index 197802c447..e2ee1cf1a5 100644 --- a/apps/www/components/SurveyResults/StateOfStartupsHeader.tsx +++ b/apps/www/components/SurveyResults/StateOfStartupsHeader.tsx @@ -59,7 +59,6 @@ const TextBlock = ({
{text} diff --git a/apps/www/pages/state-of-startups.tsx b/apps/www/pages/state-of-startups.tsx index 384616d748..a4b62f3f7e 100644 --- a/apps/www/pages/state-of-startups.tsx +++ b/apps/www/pages/state-of-startups.tsx @@ -9,11 +9,11 @@ import { Button, cn } from 'ui' import { useFlag } from 'common' import DefaultLayout from '~/components/Layouts/Default' -import { DecorativeProgressBar } from '~/components/SurveyResults/DecorativeProgressBar' import { SurveyChapter } from '~/components/SurveyResults/SurveyChapter' import { SurveyChapterSection } from '~/components/SurveyResults/SurveyChapterSection' import { SurveySectionBreak } from '~/components/SurveyResults/SurveySectionBreak' import { StateOfStartupsHeader } from '~/components/SurveyResults/StateOfStartupsHeader' +import SupabaseSelectPromo from '~/components/SupabaseSelectPromo' import { useSendTelemetryEvent } from '~/lib/telemetry' @@ -262,6 +262,7 @@ function StateOfStartupsPage() { ))} + ) diff --git a/apps/www/public/images/select/supabase-select.svg b/apps/www/public/images/supabase-select/logo.svg similarity index 100% rename from apps/www/public/images/select/supabase-select.svg rename to apps/www/public/images/supabase-select/logo.svg diff --git a/apps/www/public/images/supabase-select/speakers/dylan-field.jpg b/apps/www/public/images/supabase-select/speakers/dylan-field.jpg new file mode 100644 index 0000000000..a38ebb70b5 Binary files /dev/null and b/apps/www/public/images/supabase-select/speakers/dylan-field.jpg differ diff --git a/packages/ui-patterns/src/Banners/SelectBanner.tsx b/packages/ui-patterns/src/Banners/SelectBanner.tsx index b3cae094a4..0a763f2518 100644 --- a/packages/ui-patterns/src/Banners/SelectBanner.tsx +++ b/packages/ui-patterns/src/Banners/SelectBanner.tsx @@ -13,7 +13,7 @@ export function SelectBanner() { return (
- Supabase Select + Supabase Select