Skip to content

Instantly share code, notes, and snippets.

@kstulgys
Last active October 23, 2019 22:41
Show Gist options
  • Save kstulgys/17c215766f63eb1bf4e5fd348b4fb73b to your computer and use it in GitHub Desktop.
Save kstulgys/17c215766f63eb1bf4e5fd348b4fb73b to your computer and use it in GitHub Desktop.
checkboxOverides
const checkboxOverides = {
".form-check-label": {
height: "full",
display: "flex",
alignItems: "center",
minHeight: 10
},
".form-check-label span": {
pl: 2
},
"input[type=checkbox]": {
alignSelf: "flex-start",
cursor: "pointer",
webkitAppearance: "none",
mozAppearance: "none",
appearance: "none",
outline: 0,
height: 8,
width: 8,
border: "2px solid",
borderColor: "primary",
display: "inline-block"
},
"input[type=checkbox]:checked": {
bg: "primary",
border: "none"
},
"input[type=checkbox]:after": {
content: "'✓'",
color: "white",
pl: 2,
pt: 1,
fontWeight: "black",
display: "none"
},
"input[type=checkbox]:checked:after": {
display: "block"
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment