@sk-web-gui/core 0.1.44 → 0.1.45

package/src/components/dot.js

@@ -1,84 +1,84 @@
-module.exports = Dot = (colors) => ({
-  '.dot': {
-    '@apply relative inline-flex rounded-full': {},
-    '&-solid': {
-      '@apply bg-neutral-500': {},
-
-      ...colors.reduce(
-        (styles, color) => ({
-          ...styles,
-          [`&[data-color="${color}"]`]: {
-            [`@apply bg-${color}-500`]: {},
-          },
-        }),
-        {}
-      ),
-
-      '&.dot-bordered': {
-        '@apply border-2 border-white': {},
-        '@apply dark:border-neutral-800': {},
-      },
-
-      ...colors.reduce(
-        (styles, color) => ({
-          ...styles,
-          [`&.dot-bordered[data-color="${color}"]`]: {
-            [`@apply border-${color}-100`]: {},
-            [`@apply dark:border-${color}-300`]: {},
-          },
-        }),
-        {}
-      ),
-    },
-
-    '&-outline': {
-      '@apply bg-white border-2 border-neutral-500': {},
-      '@apply dark:bg-neutral-800': {},
-      ...colors.reduce(
-        (styles, color) => ({
-          ...styles,
-          [`&[data-color="${color}"]`]: {
-            [`@apply border-${color}-500`]: {},
-          },
-        }),
-        {}
-      ),
-    },
-
-    '&-3xs': {
-      '@apply w-1.5 h-1.5': {},
-    },
-
-    '&-2xs': {
-      '@apply w-2 h-2': {},
-    },
-
-    '&-xs': {
-      '@apply w-2.5 h-2.5': {},
-    },
-
-    '&-sm': {
-      '@apply w-3 h-3': {},
-    },
-
-    '&-md': {
-      '@apply w-3.5 h-3.5': {},
-    },
-
-    '&-lg': {
-      '@apply w-4 h-4': {},
-    },
-
-    '&-xl': {
-      '@apply w-5 h-5': {},
-    },
-
-    '&-2xl': {
-      '@apply w-6 h-6': {},
-    },
-
-    '&-3xl': {
-      '@apply w-8 h-8': {},
-    },
-  },
-});
+module.exports = Dot = (colors) => ({
+  '.dot': {
+    '@apply relative inline-flex rounded-full': {},
+    '&-solid': {
+      '@apply bg-neutral-500': {},
+
+      ...colors.reduce(
+        (styles, color) => ({
+          ...styles,
+          [`&[data-color="${color}"]`]: {
+            [`@apply bg-${color}-500`]: {},
+          },
+        }),
+        {}
+      ),
+
+      '&.dot-bordered': {
+        '@apply border-2 border-white': {},
+        '@apply dark:border-neutral-800': {},
+      },
+
+      ...colors.reduce(
+        (styles, color) => ({
+          ...styles,
+          [`&.dot-bordered[data-color="${color}"]`]: {
+            [`@apply border-${color}-100`]: {},
+            [`@apply dark:border-${color}-300`]: {},
+          },
+        }),
+        {}
+      ),
+    },
+
+    '&-outline': {
+      '@apply bg-white border-2 border-neutral-500': {},
+      '@apply dark:bg-neutral-800': {},
+      ...colors.reduce(
+        (styles, color) => ({
+          ...styles,
+          [`&[data-color="${color}"]`]: {
+            [`@apply border-${color}-500`]: {},
+          },
+        }),
+        {}
+      ),
+    },
+
+    '&-3xs': {
+      '@apply w-1.5 h-1.5': {},
+    },
+
+    '&-2xs': {
+      '@apply w-2 h-2': {},
+    },
+
+    '&-xs': {
+      '@apply w-2.5 h-2.5': {},
+    },
+
+    '&-sm': {
+      '@apply w-3 h-3': {},
+    },
+
+    '&-md': {
+      '@apply w-3.5 h-3.5': {},
+    },
+
+    '&-lg': {
+      '@apply w-4 h-4': {},
+    },
+
+    '&-xl': {
+      '@apply w-5 h-5': {},
+    },
+
+    '&-2xl': {
+      '@apply w-6 h-6': {},
+    },
+
+    '&-3xl': {
+      '@apply w-8 h-8': {},
+    },
+  },
+});

package/src/components/dropdown-filter.js

@@ -1,73 +1,73 @@
-module.exports = DropdownFilter = () => ({
-    ".DropdownFilter": {
-        position: "relative",
-        height: 44,
-        border: "1px solid #939393",
-        maxWidth: 291,
-        display: "flex",
-        background: "#fff",
-        borderRadius: 2,
-        
-        ".dropdown-button": {
-            justifyContent: "space-between",
-            display: "flex",
-            flexGrow: 1,
-            alignItems: "center",
-            padding: "0 1rem",
-
-            ".arrow-icon": {
-                transform: "rotate(180deg)",
-
-                "&.open": {
-                    transform: "rotate(0)"
-                }
-            }
-        },
-
-        ".fitler-container": {
-            position: "absolute",
-            top: "100%",
-            left: "-1px",
-            index: 10,
-            width: "calc(100% + 2px)",
-            background: "#fff",
-            border: "1px solid #939393",
-            padding: "1rem",
-            borderRadius: 2,
-
-            ".filter-controls": {
-                display: "flex",
-                justifyContent: "flex-end",
-                padding: "0 1rem",
-                paddingBottom: 12,
-
-                "button": {
-                    marginLeft: "1rem",
-                    textDecoration: "underline"
-                }
-            },
-
-            ".FilterItem": {
-                height: 48,
-                display: "flex",
-                justifyContent: "space-between",
-                alignItems: "center",
-                borderBottom: "1px solid #939393",
-                padding: "0 1rem",
-                
-                "&.disabled": {
-                    color: "#939393"
-                },
-
-                "&:first-of-type": {
-                    borderTop: "1px solid #939393",
-                }, 
-
-                "&:last-child": {
-                    borderBottom: "none",
-                }
-            }
-        }
-    }
-});
+module.exports = DropdownFilter = () => ({
+    ".DropdownFilter": {
+        position: "relative",
+        height: 50,
+        border: "1px solid #939393",
+        maxWidth: 291,
+        display: "flex",
+        background: "#fff",
+        borderRadius: 2,
+        
+        ".dropdown-button": {
+            justifyContent: "space-between",
+            display: "flex",
+            flexGrow: 1,
+            alignItems: "center",
+            padding: "0 1rem",
+
+            ".arrow-icon": {
+                transform: "rotate(180deg)",
+
+                "&.open": {
+                    transform: "rotate(0)"
+                }
+            }
+        },
+
+        ".fitler-container": {
+            position: "absolute",
+            top: "100%",
+            left: "-1px",
+            zIndex: 10,
+            width: "calc(100% + 2px)",
+            background: "#fff",
+            border: "1px solid #939393",
+            padding: "1rem",
+            borderRadius: 2,
+
+            ".filter-controls": {
+                display: "flex",
+                justifyContent: "flex-end",
+                padding: "0 1rem",
+                paddingBottom: 12,
+
+                "button": {
+                    marginLeft: "1rem",
+                    textDecoration: "underline"
+                }
+            },
+
+            ".FilterItem": {
+                height: 48,
+                display: "flex",
+                justifyContent: "space-between",
+                alignItems: "center",
+                borderBottom: "1px solid #939393",
+                padding: "0 1rem",
+                
+                "&.disabled": {
+                    color: "#939393"
+                },
+
+                "&:first-of-type": {
+                    borderTop: "1px solid #939393",
+                }, 
+
+                "&:last-child": {
+                    borderBottom: "none",
+                }
+            }
+        }
+    }
+});
   

package/src/components/footer.js

@@ -1,42 +1,42 @@
-module.exports = Footer = (colors) => ({
-  '.footer': {
-    '&-innerwrapper': {
-      '@apply bg-gray text-white py-12': {},
-
-      ...colors.reduce(
-        (styles, color) => ({
-          ...styles,
-          [`&[data-color="${color}"]`]: {
-            [`@apply bg-${color}`]: {},
-          },
-        }),
-        {}
-      ),
-    },
-
-    '&-content': {
-      '@apply px-md md:flex items-center justify-center m-auto': {},
-    },
-
-    '&-bottomlinks': {
-      '@apply bg-gray-middle text-body py-md': {},
-
-      ...colors.reduce(
-        (styles, color) => ({
-          ...styles,
-          [`&[data-color="${color}"]`]: {
-            [`@apply bg-${color}`]: {},
-          },
-        }),
-        {}
-      ),
-
-      '&-container': {
-        '@apply px-md flex items-center items-center justify-center m-auto md:space-x-10 flex-col md:flex-row': {},
-        '> *': {
-          '@apply text-body text-sm leading-sm py-sm': {},
-        },
-      },
-    },
-  },
-});
+module.exports = Footer = (colors) => ({
+  '.footer': {
+    '&-innerwrapper': {
+      '@apply bg-gray text-white py-12': {},
+
+      ...colors.reduce(
+        (styles, color) => ({
+          ...styles,
+          [`&[data-color="${color}"]`]: {
+            [`@apply bg-${color}`]: {},
+          },
+        }),
+        {}
+      ),
+    },
+
+    '&-content': {
+      '@apply px-md md:flex items-center justify-center m-auto': {},
+    },
+
+    '&-bottomlinks': {
+      '@apply bg-gray-middle text-body py-md': {},
+
+      ...colors.reduce(
+        (styles, color) => ({
+          ...styles,
+          [`&[data-color="${color}"]`]: {
+            [`@apply bg-${color}`]: {},
+          },
+        }),
+        {}
+      ),
+
+      '&-container': {
+        '@apply px-md flex items-center items-center justify-center m-auto md:space-x-10 flex-col md:flex-row': {},
+        '> *': {
+          '@apply text-body text-sm leading-sm py-sm': {},
+        },
+      },
+    },
+  },
+});