fix: fix border width in components

woly-ui · Apr 26, 2021 · 7f848c0 · 7f848c0
1 parent 75093a0
commit 7f848c0
Show file tree

Hide file tree

Showing 7 changed files with 9 additions and 13 deletions.
diff --git a/src/lib/box-styles.tsx b/src/lib/box-styles.tsx
@@ -26,7 +26,7 @@ export const Global = styled.div`
   --woly-neutral: var(--palette-snow-500);
   --woly-focus: var(--palette-lavender-500);
   --woly-background: var(--palette-snow-0);
-  
+
   [data-variant='primary'] {
     --woly-shape-default: var(--palette-lavender-300);
     --woly-shape-disabled: var(--palette-snow-300);
@@ -50,8 +50,6 @@ export const Global = styled.div`
   }
 
   [data-variant='secondary'] {
-    --woly-border-width: 1.5px;
-
     --woly-background: #ffffff;
     --woly-border: #b0a3f4;
     --woly-color: #b0a3f4;
@@ -69,8 +67,6 @@ export const Global = styled.div`
     --woly-fill-disabled: #e4e4e4;
   }
   [data-variant='error'] {
-    --woly-border-width: 1.5px;
-
     --woly-background: #ffffff;
     --woly-border: #eb5656;
     --woly-color: #eb5656;
@@ -171,7 +167,7 @@ const Frame = styled.div`
   max-width: 100%;
   padding: 1rem;
   overflow: auto;
-  border: 2px solid var(--base, rgb(246, 248, 250));
+  border: 2px solid rgb(246, 248, 250);
   border-radius: 4px;
   border-bottom-right-radius: 0;
   border-bottom-left-radius: 0;

diff --git a/src/ui/atoms/button-floating/index.tsx b/src/ui/atoms/button-floating/index.tsx
@@ -56,7 +56,7 @@ export const ButtonFloating = styled(ButtonFloatingBase)`
   border-color: var(--woly-border, #000000);
   border-style: solid;
 
-  border-width: var(--woly-border-width, 0);
+  border-width: var(--woly-border-width);
   border-radius: 50%;
 
   cursor: pointer;

diff --git a/src/ui/atoms/chip/index.tsx b/src/ui/atoms/chip/index.tsx
@@ -158,7 +158,7 @@ export const Chip = styled(ChipBase)`
 
     border-color: var(--woly-border, transparent);
     border-style: solid;
-    border-width: var(--woly-border-width, 0);
+    border-width: var(--woly-border-width);
     border-radius: var(--woly-rounding, 3px);
 
     outline: none;

diff --git a/src/ui/atoms/list/index.tsx b/src/ui/atoms/list/index.tsx
@@ -98,7 +98,7 @@ export const List = styled(ListBase)`
     &:active {
       border-color: var(--woly-border-focus, #1f68f5);
       border-style: solid;
-      border-width: var(--woly-border-width, 1.5px);
+      border-width: var(--woly-border-width);
     }
 
     &[data-disabled='true'] {

diff --git a/src/ui/atoms/surface/index.tsx b/src/ui/atoms/surface/index.tsx
@@ -10,7 +10,7 @@ export const Surface = styled.div.attrs(map)`
   background-color: var(--woly-canvas, #ffffff);
   border-color: var(--woly-border, #000000);
   border-style: solid;
-  border-width: var(--woly-border-width, 0);
+  border-width: var(--woly-border-width);
   border-radius: var(--woly-rounding, 3px);
   box-shadow: var(--woly-box-shadow, 3px 3px 8px rgba(11, 31, 53, 0.04));
 `;
diff --git a/src/ui/atoms/tooltip/index.tsx b/src/ui/atoms/tooltip/index.tsx
@@ -88,7 +88,7 @@ export const Tooltip = styled(TooltipBase)`
     background-color: var(--woly-background, #ffffff);
     border-color: var(--woly-border, var(--woly-background, #ffffff));
     border-style: solid;
-    border-width: var(--woly-border-width, 0);
+    border-width: var(--woly-border-width);
     border-radius: var(--woly-rounding, 6px);
 
     transition: all 0.3s ease-in-out;

diff --git a/src/ui/molecules/select/index.tsx b/src/ui/molecules/select/index.tsx
@@ -156,7 +156,7 @@ export const Select = styled(SelectBase)`
     background: var(--woly-canvas, #ffffff);
     border-color: var(--woly-border, var(--woly-background, #f8f7f7));
     border-style: solid;
-    border-width: var(--woly-border-width, 1.5px);
+    border-width: var(--woly-border-width);
     border-radius: var(--woly-rounding, 3px);
     box-sizing: border-box;
     color: var(--woly-color, #000000);
@@ -181,7 +181,7 @@ export const Select = styled(SelectBase)`
     background-color: var(--woly-canvas, #ffffff);
     border-color: var(--woly-border, var(--woly-background, #f8f7f7));
     border-style: solid;
-    border-width: var(--woly-border-width, 1px);
+    border-width: var(--woly-border-width);
     border-radius: var(--woly-rounding, 3px);
     padding: 0;
     z-index: 1;