-
Notifications
You must be signed in to change notification settings - Fork 17
/
progress.js
29 lines (28 loc) · 960 Bytes
/
progress.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
module.exports = ({ theme }) => {
let valueStyles = {
// Applied to the "progress" part of the progress bar itself
// Note that this component doesn't care about @low and @high
"background-color": "var(--color-accent-high)",
"border": "none"
};
return {
".progress": {
"appearance": "none",
"height": "1em",
"display": "block",
"overflow": "hidden",
"width": "100%",
"padding": "0",
"border": "none",
"writing-mode": "horizontal-tb",
"border-radius": theme("borderRadius.xl"),
"&::-webkit-progress-bar": {
"background-color": theme("colors.gray.200"),
},
"&::-webkit-progress-value": valueStyles,
"&::selection": valueStyles,
"&::-moz-progress-bar": valueStyles,
"&::-ms-fill": valueStyles
}
}
}