From 83496487d4449337306bd1114053144a66615535 Mon Sep 17 00:00:00 2001
From: Anmol Singh Bhatia <121005188+anmolsinghbhatia@users.noreply.github.com>
Date: Sun, 21 Dec 2025 12:41:11 +0530
Subject: [PATCH] [WEB-5614] chore: package and layout enhancements #8403

---
 .../issues/issue-layouts/roots/project-layout-root.tsx        | 2 +-
 apps/web/core/components/rich-filters/filters-row.tsx         | 4 ++--
 packages/propel/src/button/helper.tsx                         | 2 +-
 packages/propel/src/icon-button/helper.tsx                    | 2 +-
 packages/ui/src/button/helper.tsx                             | 2 +-
 5 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/apps/web/core/components/issues/issue-layouts/roots/project-layout-root.tsx b/apps/web/core/components/issues/issue-layouts/roots/project-layout-root.tsx
index 96c9ee3df..79d4324f7 100644
--- a/apps/web/core/components/issues/issue-layouts/roots/project-layout-root.tsx
+++ b/apps/web/core/components/issues/issue-layouts/roots/project-layout-root.tsx
@@ -80,7 +80,7 @@ export const ProjectLayoutRoot = observer(function ProjectLayoutRoot() {
                 }}
               />
             )}
-            <div className="relative h-full w-full overflow-auto bg-layer-2">
+            <div className="relative h-full w-full overflow-auto bg-surface-1">
               {/* mutation loader */}
               {issues?.getIssueLoader() === "mutation" && (
                 <div className="fixed w-[40px] h-[40px] z-50 right-[20px] top-[70px] flex justify-center items-center bg-layer-1 shadow-sm rounded-sm">
diff --git a/apps/web/core/components/rich-filters/filters-row.tsx b/apps/web/core/components/rich-filters/filters-row.tsx
index 60d568b5e..30316890f 100644
--- a/apps/web/core/components/rich-filters/filters-row.tsx
+++ b/apps/web/core/components/rich-filters/filters-row.tsx
@@ -119,7 +119,7 @@ export const FiltersRow = observer(function FiltersRow<K extends TFilterProperty
   );
 
   const mainContent = (
-    <div className="w-full flex items-start gap-2">
+    <div className="w-full flex items-start gap-2 bg-layer-1 px-4 py-2 rounded-lg">
       <div className="w-full flex flex-wrap items-center gap-2">{leftContent}</div>
       <div
         className={cn("flex items-center gap-2 border-l border-subtle pl-4", {
@@ -136,7 +136,7 @@ export const FiltersRow = observer(function FiltersRow<K extends TFilterProperty
   );
 
   const HeaderVariant = (
-    <Header variant={EHeaderVariant.TERNARY} className="min-h-11 bg-layer-1">
+    <Header variant={EHeaderVariant.TERNARY} className="!px-3 min-h-11 bg-surface-1">
       {mainContent}
     </Header>
   );
diff --git a/packages/propel/src/button/helper.tsx b/packages/propel/src/button/helper.tsx
index 928dd4dc6..71a91aa0f 100644
--- a/packages/propel/src/button/helper.tsx
+++ b/packages/propel/src/button/helper.tsx
@@ -7,7 +7,7 @@ export const buttonVariants = cva(
     variants: {
       variant: {
         primary:
-          "bg-accent-primary hover:bg-accent-primary-hover active:bg-accent-primary-active disabled:bg-layer-disabled text-on-color disabled:text-disabled",
+          "bg-accent-primary hover:bg-accent-primary-hover active:bg-accent-primary-active disabled:bg-layer-disabled text-on-color disabled:text-on-color-disabled",
         "error-fill":
           "bg-danger-primary hover:bg-danger-primary-hover active:bg-danger-primary-active disabled:bg-layer-disabled text-on-color disabled:text-disabled",
         "error-outline":
diff --git a/packages/propel/src/icon-button/helper.tsx b/packages/propel/src/icon-button/helper.tsx
index ddae1dd45..e012e1f25 100644
--- a/packages/propel/src/icon-button/helper.tsx
+++ b/packages/propel/src/icon-button/helper.tsx
@@ -8,7 +8,7 @@ export const iconButtonVariants = cva(
     variants: {
       variant: {
         primary:
-          "bg-accent-primary hover:bg-accent-primary-hover active:bg-accent-primary-active focus:bg-accent-primary-active disabled:bg-layer-disabled text-on-color disabled:text-disabled",
+          "bg-accent-primary hover:bg-accent-primary-hover active:bg-accent-primary-active focus:bg-accent-primary-active disabled:bg-layer-disabled text-on-color disabled:text-on-color-disabled",
         "error-fill":
           "bg-danger-primary hover:bg-danger-primary-hover active:bg-danger-primary-active focus:bg-danger-primary-active disabled:bg-layer-disabled text-on-color disabled:text-disabled",
         "error-outline":
diff --git a/packages/ui/src/button/helper.tsx b/packages/ui/src/button/helper.tsx
index 124ffbcf2..af923cdf5 100644
--- a/packages/ui/src/button/helper.tsx
+++ b/packages/ui/src/button/helper.tsx
@@ -41,7 +41,7 @@ export const buttonStyling: IButtonStyling = {
     default: `text-on-color bg-accent-primary`,
     hover: `hover:bg-accent-primary/80`,
     pressed: `focus:text-custom-brand-40 focus:bg-accent-primary/80`,
-    disabled: `cursor-not-allowed !bg-layer-1 !text-placeholder`,
+    disabled: `cursor-not-allowed !bg-layer-1 !text-on-color-disabled`,
   },
   "accent-primary": {
     default: `bg-accent-primary/20 text-accent-primary`,