fix: hide property to hide or use initial (default) display behavior (#…

…45)
pindoio · Jun 28, 2020 · 46d5d86 · 46d5d86
1 parent ec24709
commit 46d5d86
Show file tree

Hide file tree

Showing 3 changed files with 29 additions and 27 deletions.
diff --git a/packages/blocjs/src/box.js b/packages/blocjs/src/box.js
@@ -21,7 +21,7 @@ const Box = styled("div")(
   system({
     hide: {
       property: "display",
-      transform: n => (n ? "none" : "block")
+      transform: n => (n ? "none" : "initial")
     }
   })
 );

diff --git a/packages/docs/src/App.js b/packages/docs/src/App.js
@@ -7,7 +7,9 @@ import theme from "./theme";
 const App = () => {
   return (
     <ThemeProvider theme={theme}>
-      <Bloc color="primaryDark">Bloc</Bloc>
+      <Bloc color="surface" bg="primaries.4">
+        Bloc
+      </Bloc>
       <Bloc color="primary">BlocJS</Bloc>
       <Bloc color="primaryLight">BlocJS Library</Bloc>
     </ThemeProvider>

diff --git a/packages/docs/src/theme.js b/packages/docs/src/theme.js
@@ -1,32 +1,32 @@
 const colors = {
-  primary: "#2757B6",
-  primaryDark: "#0D285C",
-  primaryLight: "#89ACF0",
+  primary: "#FF3049",
+  primaryDark: "#CF1229",
+  primaryLight: "#FF7888",
   primaries: [
-    "#0D285C",
-    "#183D85",
-    "#2757B6",
-    "#628EE4",
-    "#89ACF0",
-    "#AECAFF",
-    "#CBDDFF",
-    "#E8F0FF"
+    "#CF1229",
+    "#E5223A",
+    "#FF3049",
+    "#FF5E71",
+    "#FF7888",
+    "#FF96A3",
+    "#FFB9C1",
+    "#FFDCE0"
   ],
-  accent: "#38CACA",
-  accentDark: "#087C7C",
-  accentLight: "#73F3F3",
+  accent: "#16C1AD",
+  accentDark: "#088C7D",
+  accentLight: "#8EF3E7",
   accents: [
-    "#087C7C",
-    "#24AFAF",
-    "#38CACA",
-    "#55E2E2",
-    "#73F3F3",
-    "#90FBFB",
-    "#AFFFFF",
-    "#E8FFFF"
+    "#088C7D",
+    "#0BAF9C",
+    "#16C1AD",
+    "#57E0D0",
+    "#8EF3E7",
+    "#BDFBF3",
+    "#E4FFFC",
+    "#F6FFFE"
   ],
-  surface: "#F9FFFF",
-  surfaces: ["#FFFFFF", "#F9FFFF", "#5D5E6E", "#EB5757"]
+  surface: "#FFF9F9",
+  surfaces: ["#FFFFFF", "#FFF9F9", "#3E484D", "#EC0000"]
 };
 colors.lightAccent = colors["accents"][7];
 
@@ -42,7 +42,7 @@ shadows.medium = shadows[2];
 shadows.large = shadows[3];
 
 const fonts = {
-  sans: "'Public Sans', sans-serif",
+  sans: "'Space Grotesk', sans-serif",
   mono: "Iosevka, Menlo, monospace"
 };