From c133c1aff1036c00069c72b84efa72923071bf97 Mon Sep 17 00:00:00 2001
From: "[dyad]" <cetinmustafa83@gmail.com>
Date: Sat, 1 Aug 2026 21:58:28 +0200
Subject: [PATCH] =?UTF-8?q?[dyad]=20Demo=20buton=20breakpoint=20d=C3=BCzen?=
 =?UTF-8?q?ini=20do=C4=9Frula?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/auth-view.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/auth-view.tsx b/src/components/auth-view.tsx
index d61a0e8..16a63b5 100755
--- a/src/components/auth-view.tsx
+++ b/src/components/auth-view.tsx
@@ -819,7 +819,7 @@ export default function AuthView() {
                     </div>
                     <p className="text-xs text-gray-500 dark:text-gray-400 mt-0.5">{t('auth.demo_section_subtitle')}</p>
                   </div>
-                  <div className="grid grid-cols-1 gap-2">
+                  <div className="grid grid-cols-1 gap-2 sm:grid-cols-2">
                     {DEMO_ACCOUNTS.map((demo, i) => (
                       <motion.div
                         key={demo.email}
@@ -832,12 +832,12 @@ export default function AuthView() {
                           variant="outline"
                           onClick={() => handleDemoLogin(demo.email, demo.password)}
                           disabled={loading || demoLoading}
-                          className={`group h-12 w-full px-4 rounded-xl border-0 bg-gradient-to-r ${demo.colorClass} text-white font-semibold text-sm shadow-lg flex items-center justify-center gap-2 hover:shadow-xl hover:scale-[1.01] active:scale-[0.99] transition-all duration-200`}
+                          className={`group min-h-12 h-auto w-full min-w-0 px-2 py-2 rounded-xl border-0 bg-gradient-to-r ${demo.colorClass} text-white font-semibold text-sm shadow-lg flex items-center justify-center gap-1.5 hover:shadow-xl hover:scale-[1.01] active:scale-[0.99] transition-all duration-200`}
                         >
                           <span className="flex h-6 w-6 shrink-0 items-center justify-center rounded-full bg-white/90 text-emerald-600">
                             <demo.icon className="h-4 w-4 transition-transform duration-200 group-hover:scale-110" />
                           </span>
-                          <span className="truncate">{t(demo.labelKey)}</span>
+                          <span className="min-w-0 break-words text-center leading-tight">{t(demo.labelKey)}</span>
                         </Button>
                       </motion.div>
                     ))}