diff --git a/src/app/(development)/workroom/page.tsx b/src/app/(development)/workroom/page.tsx index 34b4f0d566..4322692e81 100644 --- a/src/app/(development)/workroom/page.tsx +++ b/src/app/(development)/workroom/page.tsx @@ -33,7 +33,7 @@ export default function WorkroomPage() { } return ( -
+

SpeakerOpengraphImage

-
+
-
+

Become a Sponsor

diff --git a/src/app/conf/2025/components/call-for-proposals.tsx b/src/app/conf/2025/components/call-for-proposals.tsx index b7084564ff..2b4b2b297a 100644 --- a/src/app/conf/2025/components/call-for-proposals.tsx +++ b/src/app/conf/2025/components/call-for-proposals.tsx @@ -329,7 +329,7 @@ export function CallForProposals() {
diff --git a/src/app/conf/2025/components/cta-card-section/index.tsx b/src/app/conf/2025/components/cta-card-section/index.tsx index e690003db7..cf7d94fc1e 100644 --- a/src/app/conf/2025/components/cta-card-section/index.tsx +++ b/src/app/conf/2025/components/cta-card-section/index.tsx @@ -17,7 +17,7 @@ export function CtaCardSection({ ...rest }: CtaCardSectionProps) { return ( -
+
-
+

Get your ticket diff --git a/src/app/conf/2025/components/graphql-foundation-card.tsx b/src/app/conf/2025/components/graphql-foundation-card.tsx index ab3155f3fb..c70d76ca23 100644 --- a/src/app/conf/2025/components/graphql-foundation-card.tsx +++ b/src/app/conf/2025/components/graphql-foundation-card.tsx @@ -4,7 +4,7 @@ import FoundationWordmark from "../assets/graphql-foundation-wordmark.svg?svgr" export function GraphQLFoundationCard({ className }: { className?: string }) { return ( -
+
diff --git a/src/app/conf/2025/components/hero/index.tsx b/src/app/conf/2025/components/hero/index.tsx index 1c2ac61332..eeaa4bc8ad 100644 --- a/src/app/conf/2025/components/hero/index.tsx +++ b/src/app/conf/2025/components/hero/index.tsx @@ -38,7 +38,7 @@ export function Hero(props: HeroProps) { >
{props.stripes || } -
+
{props.pageName ? (
diff --git a/src/app/conf/2025/components/register-section/index.tsx b/src/app/conf/2025/components/register-section/index.tsx index 8b4b18ff96..148e4c3fe5 100644 --- a/src/app/conf/2025/components/register-section/index.tsx +++ b/src/app/conf/2025/components/register-section/index.tsx @@ -9,7 +9,7 @@ export function RegisterSection({ className, ...props }: RegisterSectionProps) { return (
diff --git a/src/app/conf/2025/components/sponsors.tsx b/src/app/conf/2025/components/sponsors.tsx index 3bdbb3f101..08b630588d 100644 --- a/src/app/conf/2025/components/sponsors.tsx +++ b/src/app/conf/2025/components/sponsors.tsx @@ -52,7 +52,7 @@ const sponsorTiers: Tier[] = [ export function Sponsors({ heading }: SponsorsProps) { return ( -
+

{heading}

diff --git a/src/app/conf/2025/components/testimonials/index.tsx b/src/app/conf/2025/components/testimonials/index.tsx index 4ae007a082..42a7aaa92c 100644 --- a/src/app/conf/2025/components/testimonials/index.tsx +++ b/src/app/conf/2025/components/testimonials/index.tsx @@ -52,7 +52,7 @@ export function Testimonials({ className, ...rest }: TestimonialsProps) { return (
diff --git a/src/app/conf/2025/components/what-to-expect.tsx b/src/app/conf/2025/components/what-to-expect.tsx index 0bfd71a116..9d4585ba16 100644 --- a/src/app/conf/2025/components/what-to-expect.tsx +++ b/src/app/conf/2025/components/what-to-expect.tsx @@ -11,7 +11,7 @@ export default function WhatToExpectSection({ }: WhatToExpectSectionProps) { return (

What to expect

diff --git a/src/app/conf/2025/faq.tsx b/src/app/conf/2025/faq.tsx index 9696270e18..a95deaddd2 100644 --- a/src/app/conf/2025/faq.tsx +++ b/src/app/conf/2025/faq.tsx @@ -203,7 +203,7 @@ export function FAQ({ className }: { className?: string }) {
diff --git a/src/app/conf/2025/page.tsx b/src/app/conf/2025/page.tsx index 106881110a..18a5b7e836 100644 --- a/src/app/conf/2025/page.tsx +++ b/src/app/conf/2025/page.tsx @@ -33,7 +33,7 @@ export default function Page() { Get your tickets -
+
-
+
-
+
-
+
diff --git a/src/app/conf/2025/schedule/[id]/page.tsx b/src/app/conf/2025/schedule/[id]/page.tsx index c64649d3c6..055ca10fa0 100644 --- a/src/app/conf/2025/schedule/[id]/page.tsx +++ b/src/app/conf/2025/schedule/[id]/page.tsx @@ -79,8 +79,8 @@ export default function SessionPage({ params }: SessionProps) {
-
-
+
+
-
+
-
+
-
+
-
-
+
+
-
+
*/} {/*
*/} -
+
{speakers.map(speaker => ( @@ -38,7 +38,7 @@ export default function Page() {
-
+
-
+

The query language for modern APIs diff --git a/src/components/index-page/index.tsx b/src/components/index-page/index.tsx index 11040a55ad..7f43d52dca 100644 --- a/src/components/index-page/index.tsx +++ b/src/components/index-page/index.tsx @@ -1,4 +1,5 @@ import { Hero } from "./hero" +import { TrustedBy } from "./trusted-by" import { PredictableResults } from "./predictable-results" import { SingleRequest } from "./single-request" import { TypeSystem } from "./type-system" @@ -12,6 +13,7 @@ export function IndexPage() { return (
+

A query language for your API

diff --git a/src/components/index-page/trusted-by/index.tsx b/src/components/index-page/trusted-by/index.tsx new file mode 100644 index 0000000000..1610f6403c --- /dev/null +++ b/src/components/index-page/trusted-by/index.tsx @@ -0,0 +1,146 @@ +import { clsx } from "clsx" + +import { Button } from "@/app/conf/_design-system/button" + +import MetaLockup from "./logos/Meta.svg?svgr" +import IBMWordmark from "./logos/IBM.svg?svgr" +import AirBnBLockup from "./logos/AirBnB.svg?svgr" +import IntuitWordmark from "./logos/Intuit.svg?svgr" +import AWSLogo from "./logos/AWS.svg?svgr" +import PayPalWordmark from "./logos/PayPal.svg?svgr" +import NewYorkTimesWordmark from "./logos/NewYorkTimes.svg?svgr" +import StarbucksWordmark from "./logos/Starbucks.svg?svgr" +import ShopifyLockup from "./logos/Shopify.svg?svgr" +import ShopifyMonotoneLockup from "./logos/ShopifyMonotone.svg?svgr" +import GitHubLockup from "./logos/GitHub.svg?svgr" + +import styles from "./style.module.css" + +const logos: LogoListItem[] = [ + { + href: "https://meta.com", + alt: "Meta", + component: MetaLockup, + }, + { + href: "https://aws.amazon.com", + alt: "AWS", + component: props => ( + + ), + }, + + // todo: Netflix? + // { + // href: "https://netflix.com", + // alt: "Netflix", + // component: NetflixWordmark, + // }, + { + href: "https://airbnb.com", + alt: "Airbnb", + component: AirBnBLockup, + }, + { + href: "https://intuit.com", + alt: "Intuit", + component: IntuitWordmark, + }, + + { + href: "https://ibm.com", + alt: "IBM", + component: props => ( + + ), + }, + + { + href: "https://paypal.com", + alt: "PayPal", + component: PayPalWordmark, + }, + { + href: "https://nytimes.com", + alt: "New York Times", + component: NewYorkTimesWordmark, + }, + { + href: "https://starbucks.com", + alt: "Starbucks", + component: StarbucksWordmark, + }, + { + href: "https://shopify.com", + alt: "Shopify", + component: ({ className, ...rest }) => ( +
+ + +
+ ), + }, + { + href: "https://github.com", + alt: "GitHub", + component: GitHubLockup, + }, +] + +export function TrustedBy() { + return ( +
+
+

+ GraphQL is open source and trusted by the industry +

+

+ Facebook's mobile apps have been powered by GraphQL since 2012. A + GraphQL spec was open-sourced in 2015. Now it is used by + industry-leading companies worldwide and supported by the GraphQL + Foundation, hosted since 2018 by the non-profit Linux Foundation. +

+
+
+ {logos.map(({ alt, href, component: Component }) => ( + + + + ))} +
+ + +
+ ) +} + +interface LogoListItem { + href: string + alt: string + component: React.FC<{ className?: string }> +} diff --git a/src/components/index-page/trusted-by/logos/AWS.svg b/src/components/index-page/trusted-by/logos/AWS.svg new file mode 100644 index 0000000000..8ef544d4ea --- /dev/null +++ b/src/components/index-page/trusted-by/logos/AWS.svg @@ -0,0 +1,33 @@ + + + + + + diff --git a/src/components/index-page/trusted-by/logos/AirBnB.svg b/src/components/index-page/trusted-by/logos/AirBnB.svg new file mode 100644 index 0000000000..88db1efba2 --- /dev/null +++ b/src/components/index-page/trusted-by/logos/AirBnB.svg @@ -0,0 +1,18 @@ + + + + diff --git a/src/components/index-page/trusted-by/logos/GitHub.svg b/src/components/index-page/trusted-by/logos/GitHub.svg new file mode 100644 index 0000000000..2012d422e7 --- /dev/null +++ b/src/components/index-page/trusted-by/logos/GitHub.svg @@ -0,0 +1,55 @@ + + + + + + + + + diff --git a/src/components/index-page/trusted-by/logos/IBM.svg b/src/components/index-page/trusted-by/logos/IBM.svg new file mode 100644 index 0000000000..1dd25e38e9 --- /dev/null +++ b/src/components/index-page/trusted-by/logos/IBM.svg @@ -0,0 +1,20 @@ + + + + diff --git a/src/components/index-page/trusted-by/logos/Intuit.svg b/src/components/index-page/trusted-by/logos/Intuit.svg new file mode 100644 index 0000000000..2b758524a9 --- /dev/null +++ b/src/components/index-page/trusted-by/logos/Intuit.svg @@ -0,0 +1,21 @@ + + + + diff --git a/src/components/index-page/trusted-by/logos/Meta.svg b/src/components/index-page/trusted-by/logos/Meta.svg new file mode 100644 index 0000000000..e771256419 --- /dev/null +++ b/src/components/index-page/trusted-by/logos/Meta.svg @@ -0,0 +1,34 @@ + + + + + + + + + + + + + + diff --git a/src/components/index-page/trusted-by/logos/NewYorkTimes.svg b/src/components/index-page/trusted-by/logos/NewYorkTimes.svg new file mode 100644 index 0000000000..23c14de79f --- /dev/null +++ b/src/components/index-page/trusted-by/logos/NewYorkTimes.svg @@ -0,0 +1,19 @@ + + + + diff --git a/src/components/index-page/trusted-by/logos/PayPal.svg b/src/components/index-page/trusted-by/logos/PayPal.svg new file mode 100644 index 0000000000..534e047567 --- /dev/null +++ b/src/components/index-page/trusted-by/logos/PayPal.svg @@ -0,0 +1,18 @@ + + + + + + + + + + diff --git a/src/components/index-page/trusted-by/logos/Shopify.svg b/src/components/index-page/trusted-by/logos/Shopify.svg new file mode 100755 index 0000000000..661486d881 --- /dev/null +++ b/src/components/index-page/trusted-by/logos/Shopify.svg @@ -0,0 +1,64 @@ + + + + + + + + + + + + + + + + diff --git a/src/components/index-page/trusted-by/logos/ShopifyMonotone.svg b/src/components/index-page/trusted-by/logos/ShopifyMonotone.svg new file mode 100755 index 0000000000..31ef8769fc --- /dev/null +++ b/src/components/index-page/trusted-by/logos/ShopifyMonotone.svg @@ -0,0 +1,11 @@ + + + diff --git a/src/components/index-page/trusted-by/logos/Starbucks.svg b/src/components/index-page/trusted-by/logos/Starbucks.svg new file mode 100644 index 0000000000..b1e1287d6d --- /dev/null +++ b/src/components/index-page/trusted-by/logos/Starbucks.svg @@ -0,0 +1,19 @@ + + + + diff --git a/src/components/index-page/trusted-by/style.module.css b/src/components/index-page/trusted-by/style.module.css new file mode 100644 index 0000000000..a1323e8cbc --- /dev/null +++ b/src/components/index-page/trusted-by/style.module.css @@ -0,0 +1,34 @@ +.logos { + background-image: radial-gradient( + ellipse at 50% 50%, + hsl(var(--color-neu-600)) 0%, + transparent 75% + ); + background-size: 100% 100%; + background-position: center; + background-repeat: no-repeat; + + & .shopify > svg { + transition: opacity 300ms cubic-bezier(0.075, 0.82, 0.165, 1); + } + + & > a { + transition: background-color 300ms cubic-bezier(0.075, 0.82, 0.165, 1); + + & :is(svg, path) { + transition: fill 300ms cubic-bezier(0.075, 0.82, 0.165, 1); + } + + &:not(:hover) svg, + &:not(:hover) path { + fill: hsl(var(--color-neu-600)); + } + + @media (prefers-color-scheme: dark) { + &:not(:hover) svg, + &:not(:hover) path { + fill: hsl(var(--color-neu-200)); + } + } + } +} diff --git a/src/components/index-page/who-is-using.tsx b/src/components/index-page/who-is-using.tsx index d7c18ebbf3..98dc2a37e0 100644 --- a/src/components/index-page/who-is-using.tsx +++ b/src/components/index-page/who-is-using.tsx @@ -8,6 +8,9 @@ import shopifyLogo from "../../../public/users/logos/shopify.png" import NextImage from "next-image-export-optimizer" import { clsx } from "clsx" +/** + * @deprecated + */ export function WhoIsUsing() { return (
diff --git a/src/components/navbar/navbar.tsx b/src/components/navbar/navbar.tsx index a38106de14..f971328547 100644 --- a/src/components/navbar/navbar.tsx +++ b/src/components/navbar/navbar.tsx @@ -269,7 +269,7 @@ function SubmenuBackdrop({ className }: { className: string }) { return (
diff --git a/src/globals.css b/src/globals.css index 962c829ce7..01e942d99a 100644 --- a/src/globals.css +++ b/src/globals.css @@ -503,11 +503,11 @@ div[id^="headlessui-menu-items"] { @apply focus-visible:outline focus-visible:outline-[3px] focus-visible:outline-offset-[5px] focus-visible:outline-neu-900; } -.gql-conf-container { +.gql-container { @apply mx-auto w-full max-w-[120rem]; } -.gql-conf-section { +.gql-section { @apply px-4 py-8 lg:px-12 xl:gap-x-24 xl:px-24 3xl:px-[240px]; }