Merge branch 'main' of https://github.com/OpenCut-app/OpenCut

11 files changed, 19 insertions, 19 deletions

diff --git a/apps/web/src/app/(auth)/login/page.tsx b/apps/web/src/app/(auth)/login/page.tsx
index 5f37ced9..9935e153 100644
--- a/apps/web/src/app/(auth)/login/page.tsx
+++ b/apps/web/src/app/(auth)/login/page.tsx
@@ -137,7 +137,7 @@ export default function LoginPage() {
   return (
     <div className="flex h-screen items-center justify-center relative">
       <Button
-        variant="ghost"
+        variant="text"
         onClick={() => router.back()}
         className="absolute top-6 left-6"
       >
diff --git a/apps/web/src/app/(auth)/signup/page.tsx b/apps/web/src/app/(auth)/signup/page.tsx
index d1feece2..b28e2226 100644
--- a/apps/web/src/app/(auth)/signup/page.tsx
+++ b/apps/web/src/app/(auth)/signup/page.tsx
@@ -159,7 +159,7 @@ export default function SignUpPage() {
   return (
     <div className="flex h-screen items-center justify-center relative">
       <Button
-        variant="ghost"
+        variant="text"
         onClick={() => router.back()}
         className="absolute top-6 left-6"
       >
diff --git a/apps/web/src/components/auth-form.tsx b/apps/web/src/components/auth-form.tsx
index 72bddd3d..e0f8af2f 100644
--- a/apps/web/src/components/auth-form.tsx
+++ b/apps/web/src/components/auth-form.tsx
@@ -313,7 +313,7 @@ export function AuthForm({ mode }: AuthFormProps) {
   return (

     <div className="flex h-screen items-center justify-center relative">

       <Button

-        variant="ghost"

+        variant="text"

         onClick={() => router.back()}

         className="absolute top-6 left-6"

       >

diff --git a/apps/web/src/components/editor/preview-panel.tsx b/apps/web/src/components/editor/preview-panel.tsx
index 5c27da53..624a549e 100644
--- a/apps/web/src/components/editor/preview-panel.tsx
+++ b/apps/web/src/components/editor/preview-panel.tsx
@@ -149,7 +149,7 @@ export function PreviewPanel() {
         {/* Debug Toggle - Only show in development */}

         {SHOW_DEBUG_INFO && (

           <Button

-            variant="ghost"

+            variant="text"

             size="sm"

             onClick={() => setShowDebug(!showDebug)}

             className="text-xs"

diff --git a/apps/web/src/components/editor/timeline.tsx b/apps/web/src/components/editor/timeline.tsx
index ce81f9e3..9abb5221 100644
--- a/apps/web/src/components/editor/timeline.tsx
+++ b/apps/web/src/components/editor/timeline.tsx
@@ -498,7 +498,7 @@ export function Timeline() {
           <Tooltip>

             <TooltipTrigger asChild>

               <Button

-                variant="ghost"

+                variant="text"

                 size="icon"

                 onClick={toggle}

                 className="mr-2"

@@ -549,7 +549,7 @@ export function Timeline() {
 

           <Tooltip>

             <TooltipTrigger asChild>

-              <Button variant="ghost" size="icon" onClick={handleSplitSelected}>

+              <Button variant="text" size="icon" onClick={handleSplitSelected}>

                 <Scissors className="h-4 w-4" />

               </Button>

             </TooltipTrigger>

@@ -558,7 +558,7 @@ export function Timeline() {
 

           <Tooltip>

             <TooltipTrigger asChild>

-              <Button variant="ghost" size="icon">

+              <Button variant="text" size="icon">

                 <ArrowLeftToLine className="h-4 w-4" />

               </Button>

             </TooltipTrigger>

@@ -567,7 +567,7 @@ export function Timeline() {
 

           <Tooltip>

             <TooltipTrigger asChild>

-              <Button variant="ghost" size="icon">

+              <Button variant="text" size="icon">

                 <ArrowRightToLine className="h-4 w-4" />

               </Button>

             </TooltipTrigger>

@@ -576,7 +576,7 @@ export function Timeline() {
 

           <Tooltip>

             <TooltipTrigger asChild>

-              <Button variant="ghost" size="icon">

+              <Button variant="text" size="icon">

                 <SplitSquareHorizontal className="h-4 w-4" />

               </Button>

             </TooltipTrigger>

@@ -585,7 +585,7 @@ export function Timeline() {
 

           <Tooltip>

             <TooltipTrigger asChild>

-              <Button variant="ghost" size="icon" onClick={handleDuplicateSelected}>

+              <Button variant="text" size="icon" onClick={handleDuplicateSelected}>

                 <Copy className="h-4 w-4" />

               </Button>

             </TooltipTrigger>

@@ -594,7 +594,7 @@ export function Timeline() {
 

           <Tooltip>

             <TooltipTrigger asChild>

-              <Button variant="ghost" size="icon" onClick={handleFreezeSelected}>

+              <Button variant="text" size="icon" onClick={handleFreezeSelected}>

                 <Snowflake className="h-4 w-4" />

               </Button>

             </TooltipTrigger>

@@ -603,7 +603,7 @@ export function Timeline() {
 

           <Tooltip>

             <TooltipTrigger asChild>

-              <Button variant="ghost" size="icon" onClick={handleDeleteSelected}>

+              <Button variant="text" size="icon" onClick={handleDeleteSelected}>

                 <Trash2 className="h-4 w-4" />

               </Button>

             </TooltipTrigger>

@@ -1625,7 +1625,7 @@ function TimelineTrackContent({
                     {/* Clip options menu */}

                     <div className="absolute top-1 right-1 z-10">

                       <Button

-                        variant="ghost"

+                        variant="text"

                         size="icon"

                         className="opacity-0 group-hover:opacity-100 transition-opacity"

                         onClick={() => setClipMenuOpen(clip.id)}

diff --git a/apps/web/src/components/header.tsx b/apps/web/src/components/header.tsx
index d1e0518f..8c3ce610 100644
--- a/apps/web/src/components/header.tsx
+++ b/apps/web/src/components/header.tsx
@@ -38,7 +38,7 @@ export function Header() {
     <nav className="flex items-center">

       <Link href="https://github.com/OpenCut-app/OpenCut" target="_blank">

         <Button

-          variant="ghost"

+          variant="text"

           className="flex items-center text-sm text-muted-foreground hover:text-foreground"

         >

           <span className="hidden sm:inline">GitHub</span>

diff --git a/apps/web/src/components/ui/button.tsx b/apps/web/src/components/ui/button.tsx
index f5863e20..d4406d5b 100644
--- a/apps/web/src/components/ui/button.tsx
+++ b/apps/web/src/components/ui/button.tsx
@@ -17,7 +17,7 @@ const buttonVariants = cva(
           "border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",
         secondary:
           "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
-        ghost: "hover:bg-accent hover:text-accent-foreground",
+        text: "bg-transparent p-0 rounded-none hover:text-muted-foreground", // Instead of ghost (matches app better)
         link: "text-primary underline-offset-4 hover:underline",
       },
       size: {
diff --git a/apps/web/src/components/ui/calendar.tsx b/apps/web/src/components/ui/calendar.tsx
index 2dca9b14..192643cb 100644
--- a/apps/web/src/components/ui/calendar.tsx
+++ b/apps/web/src/components/ui/calendar.tsx
@@ -43,7 +43,7 @@ function Calendar({
             : "[&:has([aria-selected])]:rounded-md"
         ),
         day: cn(
-          buttonVariants({ variant: "ghost" }),
+          buttonVariants({ variant: "text" }),
           "h-8 w-8 p-0 font-normal aria-selected:opacity-100"
         ),
         day_range_start: "day-range-start",
diff --git a/apps/web/src/components/ui/input.tsx b/apps/web/src/components/ui/input.tsx
index 42f4c452..72314045 100644
--- a/apps/web/src/components/ui/input.tsx
+++ b/apps/web/src/components/ui/input.tsx
@@ -41,7 +41,7 @@ const Input = React.forwardRef<HTMLInputElement, InputProps>(
         {showPasswordToggle && (
           <Button
             type="button"
-            variant="ghost"
+            variant="text"
             size="icon"
             onClick={() => onShowPasswordChange?.(!showPassword)}
             className="absolute right-0 top-0 h-full px-3 text-muted-foreground hover:text-foreground"
diff --git a/apps/web/src/components/ui/pagination.tsx b/apps/web/src/components/ui/pagination.tsx
index 79fd268e..61766cec 100644
--- a/apps/web/src/components/ui/pagination.tsx
+++ b/apps/web/src/components/ui/pagination.tsx
@@ -49,7 +49,7 @@ const PaginationLink = ({
     aria-current={isActive ? "page" : undefined}
     className={cn(
       buttonVariants({
-        variant: isActive ? "outline" : "ghost",
+        variant: isActive ? "outline" : "text",
         size,
       }),
       className
diff --git a/apps/web/src/components/ui/sidebar.tsx b/apps/web/src/components/ui/sidebar.tsx
index e69d8751..c1583503 100644
--- a/apps/web/src/components/ui/sidebar.tsx
+++ b/apps/web/src/components/ui/sidebar.tsx
@@ -269,7 +269,7 @@ const SidebarTrigger = React.forwardRef<
     <Button
       ref={ref}
       data-sidebar="trigger"
-      variant="ghost"
+      variant="text"
       size="icon"
       className={cn("h-8 w-8", className)}
       onClick={(event) => {