Refine spacing in style constants, update snapshots

Author: simpletrontdip

packages/chakra-ui-core/src/CAlertDialog/tests/__snapshots__/CAlertDialog.test.js.snap

@@ -9,7 +9,7 @@ exports[`should render correctly 1`] = `
   </div>
   .emotion-0 {
   position: fixed;
-  background: rgba(0,0,0,0.4);
+  background: rgba( 0, 0, 0, 0.4);
   left: var(--space-0);
   top: var(--space-0);
   width: 100vw;
@@ -44,7 +44,7 @@ exports[`should render correctly 1`] = `
   z-index: var(--zIndices-modal);
   font-family: var(--fonts-body);
   background: var(--colors-white);
-  box-shadow: 0 7px 14px 0 rgba(0,0,0, 0.1),0 3px 6px 0 rgba(0, 0, 0, .07);
+  box-shadow: 0 7px 14px 0 rgba(0, 0, 0, 0.1),0 3px 6px 0 rgba(0, 0, 0, .07);
   top: var(--space-0);
   -webkit-margin-start: auto;
   margin-inline-start: auto;

packages/chakra-ui-core/src/CDrawer/tests/__snapshots__/CDrawer.test.js.snap

@@ -161,7 +161,7 @@ exports[`should render correctly 1`] = `
   </div>
   .emotion-0 {
   position: fixed;
-  background: rgba(0,0,0,0.4);
+  background: rgba( 0, 0, 0, 0.4);
   left: var(--space-0);
   top: var(--space-0);
   width: 100vw;
@@ -194,7 +194,7 @@ exports[`should render correctly 1`] = `
   z-index: var(--zIndices-modal);
   font-family: var(--fonts-body);
   background: var(--colors-white);
-  box-shadow: 0 7px 14px 0 rgba(0,0,0, 0.1),0 3px 6px 0 rgba(0, 0, 0, .07);
+  box-shadow: 0 7px 14px 0 rgba(0, 0, 0, 0.1),0 3px 6px 0 rgba(0, 0, 0, .07);
   right: var(--space-0);
   top: var(--space-0);
   height: 100vh;

packages/chakra-ui-core/src/CModal/CModal.js

@@ -270,7 +270,7 @@ const CModalOverlay = {
       ...rest,
       attrs: {
         pos: 'fixed',
-        bg: 'rgba(0,0,0,0.4)',
+        bg: 'rgba( 0, 0, 0, 0.4)',
         left: '0',
         top: '0',
         w: '100vw',
@@ -307,7 +307,7 @@ const CModalContent = {
       colorModeStyles: {
         light: {
           bg: 'white',
-          shadow: '0 7px 14px 0 rgba(0,0,0, 0.1), 0 3px 6px 0 rgba(0, 0, 0, .07)'
+          shadow: '0 7px 14px 0 rgba(0, 0, 0, 0.1), 0 3px 6px 0 rgba(0, 0, 0, .07)'
         },
         dark: {
           bg: 'gray.700',

packages/chakra-ui-core/src/CModal/tests/__snapshots__/CModal.test.js.snap

@@ -161,7 +161,7 @@ exports[`should render correctly 1`] = `
   </div>
   .emotion-0 {
   position: fixed;
-  background: rgba(0,0,0,0.4);
+  background: rgba( 0, 0, 0, 0.4);
   left: var(--space-0);
   top: var(--space-0);
   width: 100vw;
@@ -196,7 +196,7 @@ exports[`should render correctly 1`] = `
   z-index: var(--zIndices-modal);
   font-family: var(--fonts-body);
   background: var(--colors-white);
-  box-shadow: 0 7px 14px 0 rgba(0,0,0, 0.1),0 3px 6px 0 rgba(0, 0, 0, .07);
+  box-shadow: 0 7px 14px 0 rgba(0, 0, 0, 0.1),0 3px 6px 0 rgba(0, 0, 0, .07);
   top: var(--space-0);
   -webkit-margin-start: auto;
   margin-inline-start: auto;

packages/chakra-ui-core/src/CProgress/CProgress.js

@@ -182,7 +182,7 @@ const CProgress = {
       return {
         light: generateStripe({}),
         dark: generateStripe({
-          color: 'rgba(0,0,0,0.1)'
+          color: 'rgba( 0, 0, 0, 0.1)'
         })
       }
     },
@@ -199,7 +199,7 @@ const CProgress = {
     const stripeStyle = {
       light: generateStripe({}),
       dark: generateStripe({
-        color: 'rgba(0,0,0,0.1)'
+        color: 'rgba( 0, 0, 0, 0.1)'
       })
     }
 

packages/chakra-ui-core/src/CThemeProvider/tests/__snapshots__/CThemeProvider.test.js.snap

@@ -211,7 +211,7 @@ exports[`CThemeProvider should inject global Css variables to root 1`] = `
  --shadows-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1),0 10px 10px -5px rgba(0, 0, 0, 0.04);
  --shadows-2xl: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
  --shadows-outline: 0 0 0 3px rgba(66, 153, 225, 0.6);
- --shadows-inner: inset 0 2px 4px 0 rgba(0,0,0,0.06);
+ --shadows-inner: inset 0 2px 4px 0 rgba( 0, 0, 0, 0.06);
  --shadows-none: none;
  --sizes-0: 0;
  --sizes-1: 0.25rem;

packages/chakra-ui-theme/src/theme/shadows.js

@@ -9,7 +9,7 @@ const shadows = {
     '0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)',
   '2xl': '0 25px 50px -12px rgba(0, 0, 0, 0.25)',
   outline: '0 0 0 3px rgba(66, 153, 225, 0.6)',
-  inner: 'inset 0 2px 4px 0 rgba(0,0,0,0.06)',
+  inner: 'inset 0 2px 4px 0 rgba( 0, 0, 0, 0.06)',
   none: 'none'
 }