conf page minor nits (#1869)

* make sponsors logos more responsive

* consistency

* text selection

* Update src/app/conf/2025/sponsors.tsx

Co-authored-by: Dimitri POSTOLOV <[email protected]>

* adjust the grid button

* remove unused

* prettier

---------

Co-authored-by: Dimitri POSTOLOV <[email protected]>

Author: saihaj

src/app/conf/2025/page.tsx

@@ -1,5 +1,5 @@
 import { Metadata } from "next"
-import { BusIcon, HostedByGraphQLFoundation } from "@/icons"
+import { HostedByGraphQLFoundation } from "@/icons"
 import { Sponsors } from "./sponsors"
 import { Rubik } from "next/font/google"
 import GridButton from "../_components/grid-button"
@@ -163,16 +163,16 @@ function FAQSection() {
     <div id="faq" className={clsx("text-white py-16 px-4 md:px-8", styles.faq)}>
       <div className="max-w-7xl mx-auto grid md:grid-cols-2 gap-12">
         <div>
-          <h2 className="text-4xl md:text-5xl font-bold mb-4">
+          <h2 className="select-none text-4xl md:text-5xl font-bold mb-4">
             Frequently
             <br />
             Asked Questions
           </h2>
-          <p className="text-sm">
+          <p className="text-sm select-none">
             PLEASE CONTACT{" "}
             <a
               href="mailto:[email protected]"
-              className="text-primary hover:underline uppercase"
+              className="text-primary hover:underline uppercase select-text"
             >
               [email protected]
             </a>
@@ -187,7 +187,7 @@ function FAQSection() {
             >
               <summary className="py-6 flex items-center justify-start gap-2 text-left cursor-pointer list-none focus:outline-none">
                 <ArrowRight className="shrink-0 size-5 transition-transform duration-200 group-hover:translate-x-1 group-open:rotate-90" />
-                <span className="text-lg">{faq.question}</span>
+                <span className="text-lg select-none">{faq.question}</span>
               </summary>
               <p
                 className="pb-6 ml-7 -mt-4 text-gray-300 whitespace-pre-wrap [&>a]:underline"
@@ -232,20 +232,15 @@ export default function Page() {
         ></div>
       </div>
 
-      <div className="container flex gap-20 flex-col pt-24">
-        <div className="flex gap-12 lg:gap-24 max-md:flex-col">
-          <div className="flex flex-col gap-5 text-white flex-1">
-            <h2 className="text-3xl lg:text-[45px]/[4rem] font-normal">
-              Celebrating 10 Years of GraphQL. Three transformative days of
-              expert insights and innovation to shape the next decade of APIs
-              together!
-            </h2>
-            <GridButton
-              title="Get Tickets"
-              href="https://cvent.me/PBNYEe?utm_source=graphql_conf_2025&utm_medium=website&utm_campaign=cta"
-            />
-          </div>
-        </div>
+      <div className="container text-white flex flex-col mt-14 gap-14 md:mt-20 md:gap-20">
+        <h2 className="text-3xl lg:text-5xl font-normal">
+          Celebrating 10 Years of GraphQL. Three transformative days of expert
+          insights and innovation to shape the next decade of APIs together!
+        </h2>
+        <GridButton
+          title="Get Tickets"
+          href="https://cvent.me/PBNYEe?utm_source=graphql_conf_2025&utm_medium=website&utm_campaign=cta"
+        />
       </div>
 
       <Sponsors />
@@ -292,7 +287,7 @@ export default function Page() {
             href="https://cvent.me/PBNYEe?utm_source=graphql_conf_2025&utm_medium=website&utm_campaign=register_section"
             target="_blank"
             rel="noreferrer"
-            className="relative z-0 px-28 py-4 text-white text-3xl font-semibold bg-primary hover:bg-primary flex items-center justify-center gap-2"
+            className="px-20 md:px-28 py-4 text-center text-white text-3xl font-semibold bg-primary/85 hover:bg-primary/100 transition-colors"
           >
             Get Tickets
           </a>

src/app/conf/2025/sponsors.tsx

@@ -50,7 +50,7 @@ function List({
   linkClassName?: string
 }) {
   return (
-    <div className={clsx("flex gap-6 flex-col md:flex-row", className)}>
+    <div className={clsx("flex gap-6 max-lg:flex-col", className)}>
       {items.map(({ link, icon, name }, i) => (
         <a
           key={i}
@@ -197,7 +197,7 @@ export function Sponsors() {
             href="https://events.linuxfoundation.org/wp-content/uploads/2024/12/sponsor_GraphQLConf_2025.pdf?utm_source=graphql_conf_2025&utm_medium=website&utm_campaign=sponsor_section"
             target="_blank"
             rel="noreferrer"
-            className="relative z-0 px-28 py-4 text-white text-3xl font-semibold bg-[#E10098] hover:bg-[#ef00a3] flex items-center justify-center gap-2"
+            className="px-20 md:px-28 py-4 text-center text-white text-3xl font-semibold bg-primary/85 hover:bg-primary/100 transition-colors"
           >
             Download Prospectus
           </a>

src/app/conf/_components/badge.tsx

@@ -3,7 +3,7 @@ import { clsx } from "clsx"
 
 const badgeVariants = {
   default:
-    "border-transparent bg-primary text-primary-foreground shadow hover:bg-primary/80",
+    "border-transparent bg-primary text-primary-foreground shadow hover:bg-primary/85",
 }
 
 export function Badge({

src/app/conf/_components/grid-button.tsx

@@ -16,16 +16,13 @@ const GridButton: React.FC<GridButtonProps> = ({
   return (
     <div
       id={id}
-      className="relative w-full h-[500px] flex items-center justify-center overflow-hidden"
+      className="relative w-full flex items-center justify-center overflow-hidden"
     >
       <div
-        className="grid gap-0 md:scale-100 scale-75"
+        className="grid"
         style={{
           gridTemplateColumns: "repeat(18, 60px)",
           gridTemplateRows: "repeat(6, 60px)",
-          width: "1080px",
-          height: "360px",
-          boxSizing: "border-box",
         }}
       >
         {Array.from({ length: 18 * 5 + 2 }).map((_, index) => (
@@ -42,15 +39,13 @@ const GridButton: React.FC<GridButtonProps> = ({
           href={disabled ? undefined : href}
           target="_blank"
           rel="noreferrer"
-          className="relative z-0 col-span-8 row-span-2 text-white text-3xl font-semibold bg-[#E10098] hover:bg-[#ef00a3] flex items-center justify-center gap-2"
+          className="px-20 flex items-center justify-center md:px-28 py-4 text-center text-white text-3xl font-semibold bg-primary/85 hover:bg-primary/100 transition-colors"
           style={{
             gridColumn: "6 / span 8",
             gridRow: "3 / span 2",
           }}
         >
-          <button className="text-white text-3xl font-semibold flex items-center justify-center gap-2">
-            {title}
-          </button>
+          {title}
         </a>
       </div>
     </div>

src/code/tools/graphql-protect/general/graphql-protect.md

@@ -12,17 +12,16 @@ Getting started with GraphQL Protect is as simple as pulling the provided contai
 GraphQL Protect offers the following protection mechanism, and more:
 
 1. [x] **Trusted Documents** (Persisted Operations)
-4. [x] **Max Aliases**
-5. [x] **Max Tokens**
-6. [x] **Max Depth**
-7. [x] **Max Batch**
-2. [x] **Block Field Suggestions**
-3. [x] **Obfuscate upstream errors**
+2. [x] **Max Aliases**
+3. [x] **Max Tokens**
+4. [x] **Max Depth**
+5. [x] **Max Batch**
+6. [x] **Block Field Suggestions**
+7. [x] **Obfuscate upstream errors**
 8. [x] **Enforce POST**
 9. [x] **Access Logging**
 10. [x] [... and more!](https://github.com/ldebruijn/graphql-protect?tab=readme-ov-file#features)
 
-
 Protecting your GraphQL API against abuse has never been easier, start protecting your API today.
 
 The full [example can be found on GitHub](https://github.com/ldebruijn/graphql-protect?tab=readme-ov-file#installation).