From 3fd295c4623761cbf5a2ff550485e6638d7ca6a4 Mon Sep 17 00:00:00 2001
From: celine <celine@hyperlink.academy>
Date: Mon, 9 Feb 2026 04:47:28 -0500
Subject: [PATCH] adjust width of ActionButon in desktop

---
 components/ActionBar/ActionButton.tsx | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/components/ActionBar/ActionButton.tsx b/components/ActionBar/ActionButton.tsx
index 31c54f36..6dc14129 100644
--- a/components/ActionBar/ActionButton.tsx
+++ b/components/ActionBar/ActionButton.tsx
@@ -58,7 +58,8 @@ export const ActionButton = forwardRef<
       actionButton relative font-bold
       rounded-md border
       flex gap-2 items-center justify-start
-      w-max sm:w-[1000px] sm:max-w-full p-1
+      sm:w-full sm:max-w-full p-1
+      w-max
       ${smallOnMobile && "sm:text-base text-sm py-0! sm:py-1! sm:h-fit h-6"}
       ${
         primary
@@ -74,7 +75,8 @@ export const ActionButton = forwardRef<
     >
       <div className="shrink-0 flex flex-row gap-0.5">{icon}</div>
       <div
-        className={`flex flex-col ${subtext && "leading-snug"} max-w-full min-w-0 mr-1  ${sidebar.open ? "block" : showLabelOnMobile ? "sm:hidden block" : "hidden"}`}
+        className={`flex flex-col ${subtext && "leading-snug"}  sm:max-w-full min-w-0 mr-1  ${sidebar.open ? "block" : showLabelOnMobile ? "sm:hidden block" : "hidden"}`}
+        style={{ width: "-webkit-fill-available" }}
       >
         <div className="truncate text-left">{label}</div>
         {subtext && (
-- 
2.51.2