refactor: correct elevated bg color, elevation const renamed

callstack · Mar 26, 2022 · 17d618c · 17d618c
1 parent 2290028
commit 17d618c
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 9 deletions.
diff --git a/src/components/Button/Button.tsx b/src/components/Button/Button.tsx
@@ -146,22 +146,22 @@ const Button = ({
   const { roundness, isV3 } = theme;
 
   const isElevationEntitled = isV3 ? isMode('elevated') : isMode('contained');
-  const containedInitialElevation = theme.isV3 ? 1 : 2;
-  const containedActiveElevation = theme.isV3 ? 2 : 8;
+  const initialElevation = theme.isV3 ? 1 : 2;
+  const activeElevation = theme.isV3 ? 2 : 8;
 
   const { current: elevation } = React.useRef<Animated.Value>(
-    new Animated.Value(isElevationEntitled ? containedInitialElevation : 0)
+    new Animated.Value(isElevationEntitled ? initialElevation : 0)
   );
 
   React.useEffect(() => {
-    elevation.setValue(isElevationEntitled ? containedInitialElevation : 0);
-  }, [isElevationEntitled, elevation, containedInitialElevation]);
+    elevation.setValue(isElevationEntitled ? initialElevation : 0);
+  }, [isElevationEntitled, elevation, initialElevation]);
 
   const handlePressIn = () => {
     if (isMode('contained')) {
       const { scale } = theme.animation;
       Animated.timing(elevation, {
-        toValue: containedActiveElevation,
+        toValue: activeElevation,
         duration: 200 * scale,
         useNativeDriver: false,
       }).start();
@@ -172,7 +172,7 @@ const Button = ({
     if (isMode('contained')) {
       const { scale } = theme.animation;
       Animated.timing(elevation, {
-        toValue: containedInitialElevation,
+        toValue: initialElevation,
         duration: 150 * scale,
         useNativeDriver: false,
       }).start();
@@ -181,7 +181,7 @@ const Button = ({
 
   const font = theme.fonts.medium;
 
-  const borderRadius = isV3 ? 20 : roundness;
+  const borderRadius = (isV3 ? 5 : 1) * roundness;
   const iconSize = isV3 ? 18 : 16;
 
   const { backgroundColor, borderColor, textColor, borderWidth } =

diff --git a/src/components/Button/helpers.tsx b/src/components/Button/helpers.tsx
@@ -53,7 +53,7 @@ export const getButtonColors = ({
         textColor = buttonColor || theme.colors.primary;
       } else if (isMode('elevated')) {
         textColor = theme.colors.primary;
-        backgroundColor = buttonColor || theme.colors.surface;
+        backgroundColor = buttonColor || theme.colors.elevation.level1;
       } else if (isMode('contained')) {
         textColor = theme.colors.onPrimary;
         backgroundColor = buttonColor || theme.colors.primary;