done

artsy · Jan 4, 2023 · 4d227df · 4d227df
1 parent 9537786
commit 4d227df
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 1 deletion.
diff --git a/.storybook/storybook.requires.js b/.storybook/storybook.requires.js
@@ -26,6 +26,7 @@ const getStories = () => {
     require("../lib/elements/Avatar/Avatar.stories.tsx"),
     require("../lib/elements/Checkbox/Checkbox.stories.tsx"),
     require("../lib/elements/Input/Input.stories.tsx"),
+    require("../lib/elements/Separator/Separator.stories.tsx"),
     require("../lib/elements/Touchable/Touchable.stories.tsx"),
     require("../lib/molecules/MenuItem.stories.tsx"),
     require("../lib/svgs/icons.stories.tsx"),

diff --git a/lib/elements/Separator/Separator.stories.tsx b/lib/elements/Separator/Separator.stories.tsx
@@ -0,0 +1,15 @@
+import { Spacer } from "../../atoms"
+import { Separator } from "./Separator"
+
+export default {
+  title: "Separator",
+  component: Separator,
+}
+
+export const Styled = () => (
+  <>
+    <Separator />
+    <Spacer y="2" />
+    <Separator borderColor="red" />
+  </>
+)
diff --git a/lib/elements/Separator/Separator.tsx b/lib/elements/Separator/Separator.tsx
@@ -8,7 +8,7 @@ export interface SeparatorProps extends SpaceProps, WidthProps, BorderProps {}
  * A horizontal divider whose width and spacing can be adjusted
  */
 export const Separator = styled.View<SeparatorProps>`
-  border: 1px solid ${themeGet("colors.black10")};
+  border: 1px solid ${themeGet("colors.onBackgroundLow")};
   border-bottom-width: 0;
   ${space};
   ${width};