move bg color

Author: langermank

packages/react/src/Button/__tests__/__snapshots__/Button.test.tsx.snap

@@ -100,11 +100,11 @@ exports[`Button respects block prop 1`] = `
   box-shadow: none;
   color: primer.fg.disabled;
   border-color: var(--button-default-borderColor-disabled,undefined);
+  background-color: var(--button-default-bgColor-disabled,undefined);
 }
 
 .c0:disabled [data-component=ButtonCounter] {
   color: inherit;
-  background-color: var(--button-default-bgColor-disabled,undefined);
 }
 
 .c0 [data-component=ButtonCounter] {
@@ -357,11 +357,11 @@ exports[`Button respects the alignContent prop 1`] = `
   box-shadow: none;
   color: primer.fg.disabled;
   border-color: var(--button-default-borderColor-disabled,undefined);
+  background-color: var(--button-default-bgColor-disabled,undefined);
 }
 
 .c0:disabled [data-component=ButtonCounter] {
   color: inherit;
-  background-color: var(--button-default-bgColor-disabled,undefined);
 }
 
 .c0 [data-component=ButtonCounter] {
@@ -613,11 +613,11 @@ exports[`Button respects the large size prop 1`] = `
   box-shadow: none;
   color: primer.fg.disabled;
   border-color: var(--button-default-borderColor-disabled,undefined);
+  background-color: var(--button-default-bgColor-disabled,undefined);
 }
 
 .c0:disabled [data-component=ButtonCounter] {
   color: inherit;
-  background-color: var(--button-default-bgColor-disabled,undefined);
 }
 
 .c0 [data-component=ButtonCounter] {
@@ -870,11 +870,11 @@ exports[`Button respects the small size prop 1`] = `
   box-shadow: none;
   color: primer.fg.disabled;
   border-color: var(--button-default-borderColor-disabled,undefined);
+  background-color: var(--button-default-bgColor-disabled,undefined);
 }
 
 .c0:disabled [data-component=ButtonCounter] {
   color: inherit;
-  background-color: var(--button-default-bgColor-disabled,undefined);
 }
 
 .c0 [data-component=ButtonCounter] {

packages/react/src/Button/styles.ts

@@ -18,9 +18,9 @@ export const getVariantStyles = (variant: VariantType = 'default', theme?: Theme
       '&:disabled': {
         color: 'primer.fg.disabled',
         borderColor: `var(--button-default-borderColor-disabled, ${theme?.colors.btn.border})`,
+        backgroundColor: `var(--button-default-bgColor-disabled, ${theme?.colors.input.disabledBg})`,
         '[data-component=ButtonCounter]': {
           color: 'inherit',
-          backgroundColor: `var(--button-default-bgColor-disabled, ${theme?.colors.input.disabledBg})`,
         },
       },
       '&[aria-expanded=true]': {