From 95d6cc192daae018cb66e756ab38472497e2e6e6 Mon Sep 17 00:00:00 2001
From: Amirhossein Khalili <amirhosseinkhalili901@gmail.com>
Date: Fri, 1 May 2026 02:17:31 +0330
Subject: [PATCH] feat(auth): add branded google sign-in button

---
 src/pages/Auth.tsx | 24 +++++++++++++++++++++++-
 1 file changed, 23 insertions(+), 1 deletion(-)

diff --git a/src/pages/Auth.tsx b/src/pages/Auth.tsx
index 8221e3e..a3b558d 100644
--- a/src/pages/Auth.tsx
+++ b/src/pages/Auth.tsx
@@ -21,6 +21,27 @@ const PERSIAN_DIGITS = ["۰", "۱", "۲", "۳", "۴", "۵", "۶", "۷", "۸", "
 const toPersianDigits = (value: string) =>
   value.replace(/\d/g, (digit) => PERSIAN_DIGITS[Number.parseInt(digit, 10)] ?? digit)
 
+const GoogleIcon = () => (
+  <svg aria-hidden="true" className="h-5 w-5" viewBox="0 0 24 24">
+    <path
+      d="M21.805 10.023h-9.72v3.955h5.57c-.24 1.272-.96 2.35-2.042 3.07v2.548h3.3c1.933-1.78 3.042-4.4 3.042-7.506 0-.692-.062-1.357-.15-2.067Z"
+      fill="#4285F4"
+    />
+    <path
+      d="M12.085 22c2.79 0 5.13-.925 6.84-2.504l-3.3-2.548c-.924.617-2.103.986-3.54.986-2.705 0-4.99-1.823-5.807-4.28H2.87v2.626A10.33 10.33 0 0 0 12.085 22Z"
+      fill="#34A853"
+    />
+    <path
+      d="M6.278 13.654A6.214 6.214 0 0 1 5.95 11.7c0-.68.117-1.34.328-1.954V7.12H2.87A10.31 10.31 0 0 0 1.75 11.7c0 1.65.39 3.218 1.12 4.58l3.408-2.626Z"
+      fill="#FBBC05"
+    />
+    <path
+      d="M12.085 5.466c1.52 0 2.882.522 3.955 1.55l2.966-2.966C17.21 2.387 14.874 1.4 12.085 1.4A10.33 10.33 0 0 0 2.87 7.12l3.408 2.626c.818-2.457 3.103-4.28 5.807-4.28Z"
+      fill="#EA4335"
+    />
+  </svg>
+)
+
 export default function Auth() {
   const navigate = useNavigate()
   const { t, lang } = useTranslation()
@@ -306,7 +327,8 @@ export default function Auth() {
                   disabled={loading}
                   className="h-11 w-full"
                 >
-                  {t.login.continueWithGoogle}
+                  <GoogleIcon />
+                  <span className="ms-3">{t.login.continueWithGoogle}</span>
                 </Button>
 
                 <div className="grid grid-cols-2 gap-4">