From e5e30f00b8fb173ce509c7a72e03f11a06ad108d Mon Sep 17 00:00:00 2001
From: Luke Vella <me@lukevella.com>
Date: Fri, 18 Apr 2025 18:21:28 +0100
Subject: [PATCH] =?UTF-8?q?=F0=9F=92=84=20Fix=20paywall=20dialog=20mobile?=
 =?UTF-8?q?=20width=20(#1675)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 apps/web/src/app/[locale]/new/page.tsx      | 2 +-
 apps/web/src/components/pay-wall-dialog.tsx | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/apps/web/src/app/[locale]/new/page.tsx b/apps/web/src/app/[locale]/new/page.tsx
index 4bbf9c08a..aa5d71ee4 100644
--- a/apps/web/src/app/[locale]/new/page.tsx
+++ b/apps/web/src/app/[locale]/new/page.tsx
@@ -24,7 +24,7 @@ export default async function Page({ params }: { params: Params }) {
           </div>
           <div className="flex flex-1 sm:justify-center">
             <div className="flex items-center gap-x-2">
-              <PollPageIcon />
+              <PollPageIcon size="sm" />
               <div className="flex items-baseline gap-x-8">
                 <h1 className="font-semibold">
                   <Trans t={t} i18nKey="poll" defaults="Poll" />
diff --git a/apps/web/src/components/pay-wall-dialog.tsx b/apps/web/src/components/pay-wall-dialog.tsx
index cb37c0923..3dd7a2123 100644
--- a/apps/web/src/components/pay-wall-dialog.tsx
+++ b/apps/web/src/components/pay-wall-dialog.tsx
@@ -38,7 +38,7 @@ export function PayWallDialog({ children, ...forwardedProps }: DialogProps) {
   return (
     <Dialog {...dialog.dialogProps} {...forwardedProps}>
       {children}
-      <DialogContent className="w-[600px] overflow-hidden bg-gray-50 p-4 sm:p-6">
+      <DialogContent className="w-full max-w-[600px] overflow-hidden bg-gray-50 p-4 sm:p-6">
         <SparklesIcon className="absolute -top-4 left-4 size-32 text-gray-500/10" />
         <div className="space-y-6">
           <header>
@@ -73,7 +73,7 @@ export function PayWallDialog({ children, ...forwardedProps }: DialogProps) {
             </DialogDescription>
           </header>
           <section>
-            <ul className="grid grid-cols-2 justify-center gap-2 text-sm font-medium">
+            <ul className="grid justify-center gap-2 text-center text-sm font-medium sm:grid-cols-2">
               <li>
                 <CheckIcon className="mr-2 inline-block size-4 text-green-600" />
                 <Trans i18nKey="featureNameFinalize" defaults="Finalize Poll" />