Atlas48/grungnet
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add fill option to divider

Browse Source
This commit is contained in:
Mitchell McCaffrey 2020-05-31 16:24:17 +10:00
parent 98543f60eb
commit a5a2c1ac77
1 changed files with 4 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/components/Divider.js
View File

@ -1,15 +1,15 @@
import React from "react";
import { Divider } from "theme-ui";
function StyledDivider({ vertical, color }) {
function StyledDivider({ vertical, color, fill }) {
return (
<Divider
my={vertical ? 0 : 2}
mx={vertical ? 2 : 0}
bg={color}
sx={{
height: vertical ? "24px" : "2px",
width: vertical ? "2px" : "24px",
height: vertical ? (fill ? "100%" : "24px") : "2px",
width: vertical ? "2px" : fill ? "100%" : "24px",
borderRadius: "2px",
opacity: 0.5,
}}
@ -20,6 +20,7 @@ function StyledDivider({ vertical, color }) {
StyledDivider.defaultProps = {
vertical: false,
color: "text",
fill: false,
};
export default StyledDivider;