From 75926318632e316b58badc2607c5f37894ef877c Mon Sep 17 00:00:00 2001
From: Aslam H <iupin5212@gmail.com>
Date: Thu, 12 Sep 2024 06:30:38 +0700
Subject: [PATCH] fix(link): bottom bar

---
 web/components/routes/link/bottom-bar.tsx | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/web/components/routes/link/bottom-bar.tsx b/web/components/routes/link/bottom-bar.tsx
index d41e5dd1..ebffc4da 100644
--- a/web/components/routes/link/bottom-bar.tsx
+++ b/web/components/routes/link/bottom-bar.tsx
@@ -3,7 +3,7 @@ import { motion, AnimatePresence } from "framer-motion"
 import { icons, ZapIcon } from "lucide-react"
 import { Button } from "@/components/ui/button"
 import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip"
-import { getSpecialShortcut, formatShortcut, isMacOS } from "@/lib/utils"
+import { getSpecialShortcut, formatShortcut, isMacOS, cn } from "@/lib/utils"
 import { LaIcon } from "@/components/custom/la-icon"
 import { useAtom } from "jotai"
 import { parseAsBoolean, useQueryState } from "nuqs"
@@ -22,9 +22,9 @@ interface ToolbarButtonProps extends React.ComponentPropsWithoutRef<typeof Butto
 }
 
 const ToolbarButton = React.forwardRef<HTMLButtonElement, ToolbarButtonProps>(
-	({ icon, onClick, tooltip, ...props }, ref) => {
+	({ icon, onClick, tooltip, className, ...props }, ref) => {
 		const button = (
-			<Button variant="ghost" className="h-8 min-w-14" onClick={onClick} ref={ref} {...props}>
+			<Button variant="ghost" className={cn("h-8 min-w-14 p-0", className)} onClick={onClick} ref={ref} {...props}>
 				<LaIcon name={icon} />
 			</Button>
 		)
@@ -148,7 +148,7 @@ export const LinkBottomBar: React.FC = () => {
 				{editId && (
 					<motion.div
 						key="expanded"
-						className="flex items-center justify-center gap-1 px-2 py-1"
+						className="flex h-full items-center justify-center gap-1 px-2"
 						initial={{ opacity: 0, y: 20 }}
 						animate={{ opacity: 1, y: 0 }}
 						exit={{ opacity: 0, y: 20 }}
@@ -168,7 +168,7 @@ export const LinkBottomBar: React.FC = () => {
 				{!editId && (
 					<motion.div
 						key="collapsed"
-						className="flex items-center justify-center gap-1 px-2 py-1"
+						className="flex h-full items-center justify-center gap-1 px-2"
 						initial={{ opacity: 0, y: -20 }}
 						animate={{ opacity: 1, y: 0 }}
 						exit={{ opacity: 0, y: -20 }}