From ea5932490ab62a14dd6ef7b0d0be8e361327f092 Mon Sep 17 00:00:00 2001
From: "P. Reis" <patrickpereirareal1@gmail.com>
Date: Mon, 22 Sep 2025 17:03:58 -0300
Subject: [PATCH] Improve SignupDialog key icon: make larger, add grey
 background, fix scrollbar

---
 src/components/auth/SignupDialog.tsx | 18 ++++++++++--------
 1 file changed, 10 insertions(+), 8 deletions(-)

diff --git a/src/components/auth/SignupDialog.tsx b/src/components/auth/SignupDialog.tsx
index efe744b..f700c98 100644
--- a/src/components/auth/SignupDialog.tsx
+++ b/src/components/auth/SignupDialog.tsx
@@ -270,8 +270,8 @@ const SignupDialog: React.FC<SignupDialogProps> = ({ isOpen, onClose, onComplete
             {getTitle()}
           </DialogTitle>
         </DialogHeader>
-        
-        <div className='px-6 pt-2 pb-6 space-y-6 overflow-y-scroll flex-1'>
+
+        <div className='px-6 pt-2 pb-6 space-y-6 overflow-y-auto flex-1'>
           {/* Initial Key Step - Soapbox style */}
           {step === 'key' && (
             <div className='flex flex-col items-center space-y-6'>
@@ -279,21 +279,23 @@ const SignupDialog: React.FC<SignupDialogProps> = ({ isOpen, onClose, onComplete
                 You need a key to continue
               </p>
 
-              <div className='text-6xl'>
-                🔑
+              <div className='rounded-full bg-gray-100 p-8 dark:bg-gray-800'>
+                <div className='text-8xl'>
+                  🔑
+                </div>
               </div>
 
               <div className='flex flex-col items-center space-y-3 w-full'>
-                <Button 
+                <Button
                   className='bg-blue-600 hover:bg-blue-700 text-white font-medium py-3 px-6 rounded-lg'
-                  size='lg' 
+                  size='lg'
                   onClick={handleGenerateKey}
                 >
                   Generate key
                 </Button>
 
-                <Button 
-                  variant='ghost' 
+                <Button
+                  variant='ghost'
                   className='text-gray-600 hover:text-gray-800 dark:text-gray-400 dark:hover:text-gray-200'
                   onClick={handleHasKey}
                 >