Merge pull request #22497 from storybookjs/chore/fix-css-inconsistency

Maintenance: Fix css inconsistency in Button and Icon components

Author: yannbf

code/ui/components/src/Button/Button.tsx

@@ -27,8 +27,9 @@ const ButtonWrapper = styled.button<{
     position: 'relative',
     textAlign: 'center',
     textDecoration: 'none',
-    transition: 'all 150ms ease-out',
-    transform: 'translate3d(0,0,0)',
+    transitionProperty: 'background, box-shadow',
+    transitionDuration: '150ms',
+    transitionTimingFunction: 'ease-out',
     verticalAlign: 'top',
     whiteSpace: 'nowrap',
     userSelect: 'none',

code/ui/components/src/icon/icon.tsx

@@ -7,7 +7,6 @@ import { icons } from './icons';
 const Svg = styled.svg`
   display: inline-block;
   shape-rendering: inherit;
-  transform: translate3d(0, 0, 0);
   vertical-align: middle;
   fill: currentColor;