fix: divider margin (#508)

* fix: divider margin

* fix: tests

Author: dornelasnelson

src/components/experimental/Divider/Divider.spec.tsx

@@ -38,16 +38,16 @@ describe('Experimental: Divider', () => {
         const dividerInstance = screen.getByTestId('vertical-divider-experimental');
         const dividerStyle = window.getComputedStyle(dividerInstance);
 
-        expect(dividerStyle.marginTop).toBe('1rem');
-        expect(dividerStyle.marginBottom).toBe('1rem');
+        expect(dividerStyle.marginTop).toBe('0.5rem');
+        expect(dividerStyle.marginBottom).toBe('0.5rem');
     });
 
     it('renders vertical divider with 1rem offset when variant is inset', () => {
         render(<Divider vertical variant="inset" />);
         const dividerInstance = screen.getByTestId('vertical-divider-experimental');
         const dividerStyle = window.getComputedStyle(dividerInstance);
 
-        expect(dividerStyle.marginTop).toBe('1rem');
+        expect(dividerStyle.marginTop).toBe('0.5rem');
         expect(dividerStyle.marginBottom).toBe('');
     });
 
@@ -57,7 +57,7 @@ describe('Experimental: Divider', () => {
         const dividerStyle = window.getComputedStyle(dividerInstance);
 
         expect(dividerStyle.marginRight).toBe('');
-        expect(dividerStyle.marginLeft).toBe('1rem');
+        expect(dividerStyle.marginLeft).toBe('0.5rem');
     });
 
     it('renders horizontal divider with overridden offset when variant is inset', () => {
@@ -74,8 +74,8 @@ describe('Experimental: Divider', () => {
         const dividerInstance = screen.getByTestId('horizontal-divider-experimental');
         const dividerStyle = window.getComputedStyle(dividerInstance);
 
-        expect(dividerStyle.marginRight).toBe('1rem');
-        expect(dividerStyle.marginLeft).toBe('1rem');
+        expect(dividerStyle.marginRight).toBe('0.5rem');
+        expect(dividerStyle.marginLeft).toBe('0.5rem');
     });
 
     it('renders horizontal divider with overridden offset when variant is middle-inset', () => {
@@ -84,6 +84,6 @@ describe('Experimental: Divider', () => {
         const dividerStyle = window.getComputedStyle(dividerInstance);
 
         expect(dividerStyle.marginRight).toBe('2rem');
-        expect(dividerStyle.marginLeft).toBe('1rem');
+        expect(dividerStyle.marginLeft).toBe('0.5rem');
     });
 });

src/components/experimental/Divider/Divider.tsx

@@ -22,11 +22,11 @@ const horizontalVariants = variant({
             minWidth: '100%'
         },
         inset: {
-            marginLeft: '1rem'
+            marginLeft: '0.5rem'
         },
         'middle-inset': {
-            marginLeft: '1rem',
-            marginRight: '1rem'
+            marginLeft: '0.5rem',
+            marginRight: '0.5rem'
         }
     }
 });
@@ -38,11 +38,11 @@ const verticalVariants = variant({
             minHeight: '100%'
         },
         inset: {
-            marginTop: '1rem'
+            marginTop: '0.5rem'
         },
         'middle-inset': {
-            marginTop: '1rem',
-            marginBottom: '1rem'
+            marginTop: '0.5rem',
+            marginBottom: '0.5rem'
         }
     }
 });