From 565a30e246a07b41a81a62f68a94ab8e669a5594 Mon Sep 17 00:00:00 2001
From: v0 <v0[bot]@users.noreply.github.com>
Date: Wed, 4 Feb 2026 16:08:51 +0000
Subject: [PATCH 1/8] feat: add GitHub link button in top-right corner

Use lucide-react Github icon and open repo page in new tab

Co-authored-by: Simon <85533298+handsomezhuzhu@users.noreply.github.com>
---
 app/page.tsx | 17 +++++++++++++++++
 1 file changed, 17 insertions(+)

diff --git a/app/page.tsx b/app/page.tsx
index b84b913..7f1e990 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -27,6 +27,7 @@ import {
   Monitor,
   Languages,
   Check,
+  Github,
 } from "lucide-react"
 import { Button } from "@/components/ui/button"
 import { Input } from "@/components/ui/input"
@@ -657,6 +658,22 @@ export default function TwoFactorAuth() {
               </div>
             </div>
             <div className="flex items-center gap-2">
+              <Button
+                variant="ghost"
+                size="icon"
+                asChild
+              >
+                <a
+                  href="https://github.com/handsomezhuzhu/2fa-tool"
+                  target="_blank"
+                  rel="noopener noreferrer"
+                  title="GitHub"
+                >
+                  <Github className="h-5 w-5" />
+                  <span className="sr-only">GitHub</span>
+                </a>
+              </Button>
+
               <Button
                 variant="ghost"
                 size="icon"

From 94af84288b44195c7169fe50ccc611499a6a048c Mon Sep 17 00:00:00 2001
From: v0 <v0[bot]@users.noreply.github.com>
Date: Wed, 4 Feb 2026 16:15:15 +0000
Subject: [PATCH 2/8] fix: improve ToastClose component visibility and event
 handling

Set default opacity to 100 and stop click event propagation.

Co-authored-by: Simon <85533298+handsomezhuzhu@users.noreply.github.com>
---
 components/ui/toast.tsx | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/components/ui/toast.tsx b/components/ui/toast.tsx
index 40eedf5..de90680 100644
--- a/components/ui/toast.tsx
+++ b/components/ui/toast.tsx
@@ -73,14 +73,18 @@ ToastAction.displayName = ToastPrimitives.Action.displayName
 const ToastClose = React.forwardRef<
   React.ElementRef<typeof ToastPrimitives.Close>,
   React.ComponentPropsWithoutRef<typeof ToastPrimitives.Close>
->(({ className, ...props }, ref) => (
+>(({ className, onClick, ...props }, ref) => (
   <ToastPrimitives.Close
     ref={ref}
     className={cn(
-      'absolute right-2 top-2 rounded-md p-1 text-foreground/50 opacity-0 transition-opacity hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-2 group-hover:opacity-100 group-[.destructive]:text-red-300 group-[.destructive]:hover:text-red-50 group-[.destructive]:focus:ring-red-400 group-[.destructive]:focus:ring-offset-red-600',
+      'absolute right-2 top-2 rounded-md p-1 text-foreground/50 opacity-100 transition-opacity hover:text-foreground focus:outline-none focus:ring-2 group-[.destructive]:text-red-300 group-[.destructive]:hover:text-red-50 group-[.destructive]:focus:ring-red-400 group-[.destructive]:focus:ring-offset-red-600',
       className,
     )}
     toast-close=""
+    onClick={(e) => {
+      e.stopPropagation()
+      onClick?.(e)
+    }}
     {...props}
   >
     <X className="h-4 w-4" />

From 22d3209fc6a27f726441a7d0e8c3a0dcd0d76c78 Mon Sep 17 00:00:00 2001
From: v0 <v0[bot]@users.noreply.github.com>
Date: Wed, 4 Feb 2026 16:21:49 +0000
Subject: [PATCH 3/8] fix: prevent toast interaction from affecting dialog

Add event stopping to Toast root and close button to prevent leaks

Co-authored-by: Simon <85533298+handsomezhuzhu@users.noreply.github.com>
---
 components/ui/toast.tsx | 18 +++++++++++++++++-
 1 file changed, 17 insertions(+), 1 deletion(-)

diff --git a/components/ui/toast.tsx b/components/ui/toast.tsx
index de90680..bdfbb62 100644
--- a/components/ui/toast.tsx
+++ b/components/ui/toast.tsx
@@ -44,11 +44,19 @@ const Toast = React.forwardRef<
   React.ElementRef<typeof ToastPrimitives.Root>,
   React.ComponentPropsWithoutRef<typeof ToastPrimitives.Root> &
     VariantProps<typeof toastVariants>
->(({ className, variant, ...props }, ref) => {
+>(({ className, variant, onPointerDown, onMouseDown, ...props }, ref) => {
   return (
     <ToastPrimitives.Root
       ref={ref}
       className={cn(toastVariants({ variant }), className)}
+      onPointerDown={(e) => {
+        e.stopPropagation()
+        onPointerDown?.(e)
+      }}
+      onMouseDown={(e) => {
+        e.stopPropagation()
+        onMouseDown?.(e)
+      }}
       {...props}
     />
   )
@@ -82,9 +90,17 @@ const ToastClose = React.forwardRef<
     )}
     toast-close=""
     onClick={(e) => {
+      e.preventDefault()
       e.stopPropagation()
+      e.nativeEvent.stopImmediatePropagation()
       onClick?.(e)
     }}
+    onPointerDown={(e) => {
+      e.stopPropagation()
+    }}
+    onMouseDown={(e) => {
+      e.stopPropagation()
+    }}
     {...props}
   >
     <X className="h-4 w-4" />

From 4c67cc066fe1258b285be6d3ba9f74dc9649cd04 Mon Sep 17 00:00:00 2001
From: v0 <v0[bot]@users.noreply.github.com>
Date: Wed, 4 Feb 2026 16:22:56 +0000
Subject: [PATCH 4/8] fix: modify event handling for close button

Remove `e.preventDefault()` to allow close action while
keeping `e.stopPropagation()` for event bubbling control.

Co-authored-by: Simon <85533298+handsomezhuzhu@users.noreply.github.com>
---
 components/ui/toast.tsx | 2 --
 1 file changed, 2 deletions(-)

diff --git a/components/ui/toast.tsx b/components/ui/toast.tsx
index bdfbb62..2dc6668 100644
--- a/components/ui/toast.tsx
+++ b/components/ui/toast.tsx
@@ -90,9 +90,7 @@ const ToastClose = React.forwardRef<
     )}
     toast-close=""
     onClick={(e) => {
-      e.preventDefault()
       e.stopPropagation()
-      e.nativeEvent.stopImmediatePropagation()
       onClick?.(e)
     }}
     onPointerDown={(e) => {

From 25158a5086353c55675f2690fe4624346390af3c Mon Sep 17 00:00:00 2001
From: v0 <v0[bot]@users.noreply.github.com>
Date: Wed, 4 Feb 2026 16:30:43 +0000
Subject: [PATCH 5/8] feat: update delete button color to brighter red

Change button color and add focus styles for better visibility.

Co-authored-by: Simon <85533298+handsomezhuzhu@users.noreply.github.com>
---
 app/page.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/page.tsx b/app/page.tsx
index 7f1e990..fc181ee 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -1254,7 +1254,7 @@ function TokenCard({ token, code, timeLeft, showCode, onCopy, onEdit, onDelete,
                   <Edit2 className="h-4 w-4 mr-2" />
                   {t.edit}
                 </DropdownMenuItem>
-                <DropdownMenuItem onClick={onDelete} className="text-destructive">
+                <DropdownMenuItem onClick={onDelete} className="text-red-500 focus:text-red-500 focus:bg-red-500/10">
                   <Trash2 className="h-4 w-4 mr-2" />
                   {t.delete}
                 </DropdownMenuItem>

From c58326623a6fe35a29de150fc25a463fc5cce1b7 Mon Sep 17 00:00:00 2001
From: v0 <v0[bot]@users.noreply.github.com>
Date: Wed, 4 Feb 2026 16:39:05 +0000
Subject: [PATCH 6/8] feat: limit modal height to 85% of viewport

Improve modal aesthetics by restricting max height and enabling scroll.

Co-authored-by: Simon <85533298+handsomezhuzhu@users.noreply.github.com>
---
 app/page.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/page.tsx b/app/page.tsx
index fc181ee..5d4c769 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -798,7 +798,7 @@ export default function TwoFactorAuth() {
                   {t.addToken}
                 </Button>
               </DialogTrigger>
-              <DialogContent className="max-w-md">
+              <DialogContent className="max-w-md max-h-[85vh] overflow-y-auto">
                 <DialogHeader>
                   <DialogTitle>{t.addNewToken}</DialogTitle>
                   <DialogDescription>{t.addNewTokenDesc}</DialogDescription>

From 52dec921f5ed66b158edf03b37e52d33516a23e7 Mon Sep 17 00:00:00 2001
From: v0 <v0[bot]@users.noreply.github.com>
Date: Wed, 4 Feb 2026 16:43:29 +0000
Subject: [PATCH 7/8] feat: adjust settings layout in advanced config popup

Display "Algorithm" and "Captcha Length" side by side for compact layout.

Co-authored-by: Simon <85533298+handsomezhuzhu@users.noreply.github.com>
---
 app/page.tsx | 72 +++++++++++++++++++++++++++-------------------------
 1 file changed, 37 insertions(+), 35 deletions(-)

diff --git a/app/page.tsx b/app/page.tsx
index 5d4c769..f3ead0c 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -798,7 +798,7 @@ export default function TwoFactorAuth() {
                   {t.addToken}
                 </Button>
               </DialogTrigger>
-              <DialogContent className="max-w-md max-h-[85vh] overflow-y-auto">
+              <DialogContent className="max-w-md">
                 <DialogHeader>
                   <DialogTitle>{t.addNewToken}</DialogTitle>
                   <DialogDescription>{t.addNewTokenDesc}</DialogDescription>
@@ -864,40 +864,42 @@ export default function TwoFactorAuth() {
 
                       {showAdvanced && (
                         <div className="mt-4 space-y-4">
-                          <div className="space-y-2">
-                            <Label>{t.algorithm}</Label>
-                            <Select
-                              value={newToken.algorithm}
-                              onValueChange={(value: "SHA1" | "SHA256" | "SHA512") =>
-                                setNewToken({ ...newToken, algorithm: value })
-                              }
-                            >
-                              <SelectTrigger>
-                                <SelectValue />
-                              </SelectTrigger>
-                              <SelectContent>
-                                <SelectItem value="SHA1">{t.algorithmDefault}</SelectItem>
-                                <SelectItem value="SHA256">SHA-256</SelectItem>
-                                <SelectItem value="SHA512">SHA-512</SelectItem>
-                              </SelectContent>
-                            </Select>
-                          </div>
-                          <div className="space-y-2">
-                            <Label>{t.digits}</Label>
-                            <Select
-                              value={newToken.digits.toString()}
-                              onValueChange={(value) =>
-                                setNewToken({ ...newToken, digits: Number.parseInt(value) as 6 | 8 })
-                              }
-                            >
-                              <SelectTrigger>
-                                <SelectValue />
-                              </SelectTrigger>
-                              <SelectContent>
-                                <SelectItem value="6">{t.digitsDefault}</SelectItem>
-                                <SelectItem value="8">{t.digits8}</SelectItem>
-                              </SelectContent>
-                            </Select>
+                          <div className="grid grid-cols-2 gap-4">
+                            <div className="space-y-2">
+                              <Label>{t.algorithm}</Label>
+                              <Select
+                                value={newToken.algorithm}
+                                onValueChange={(value: "SHA1" | "SHA256" | "SHA512") =>
+                                  setNewToken({ ...newToken, algorithm: value })
+                                }
+                              >
+                                <SelectTrigger>
+                                  <SelectValue />
+                                </SelectTrigger>
+                                <SelectContent>
+                                  <SelectItem value="SHA1">{t.algorithmDefault}</SelectItem>
+                                  <SelectItem value="SHA256">SHA-256</SelectItem>
+                                  <SelectItem value="SHA512">SHA-512</SelectItem>
+                                </SelectContent>
+                              </Select>
+                            </div>
+                            <div className="space-y-2">
+                              <Label>{t.digits}</Label>
+                              <Select
+                                value={newToken.digits.toString()}
+                                onValueChange={(value) =>
+                                  setNewToken({ ...newToken, digits: Number.parseInt(value) as 6 | 8 })
+                                }
+                              >
+                                <SelectTrigger>
+                                  <SelectValue />
+                                </SelectTrigger>
+                                <SelectContent>
+                                  <SelectItem value="6">{t.digitsDefault}</SelectItem>
+                                  <SelectItem value="8">{t.digits8}</SelectItem>
+                                </SelectContent>
+                              </Select>
+                            </div>
                           </div>
                           <div className="space-y-2">
                             <Label>{t.period}</Label>

From bf66b5bed1bb9672152bdbc242633a185a72e752 Mon Sep 17 00:00:00 2001
From: v0 <v0[bot]@users.noreply.github.com>
Date: Wed, 4 Feb 2026 16:47:51 +0000
Subject: [PATCH 8/8] fix: improve contrast for destructive alert in light mode

Use `text-white` and adjust background colors for better readability.

Co-authored-by: Simon <85533298+handsomezhuzhu@users.noreply.github.com>
---
 components/ui/toast.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/components/ui/toast.tsx b/components/ui/toast.tsx
index 2dc6668..926acbc 100644
--- a/components/ui/toast.tsx
+++ b/components/ui/toast.tsx
@@ -31,7 +31,7 @@ const toastVariants = cva(
       variant: {
         default: 'border bg-background text-foreground',
         destructive:
-          'destructive group border-destructive bg-destructive text-destructive-foreground',
+          'destructive group border-red-500 bg-red-500 text-white dark:border-red-600 dark:bg-red-600',
       },
     },
     defaultVariants: {