diff options
author | Yan Zhu <picturepan2@hotmail.com> | 2017-08-29 13:07:53 +0300 |
---|---|---|
committer | Yan Zhu <picturepan2@hotmail.com> | 2017-08-29 13:07:53 +0300 |
commit | e78b3c34348f26d40a813612c5a3786f1c56607a (patch) | |
tree | f857491026c5f728fe95fe1564ec30c931a1b30a /src/_meters.scss | |
parent | 66c492fd05c2d720c81e2be8d6845560b868e7ff (diff) |
Initial SASS build
Diffstat (limited to 'src/_meters.scss')
-rw-r--r-- | src/_meters.scss | 57 |
1 files changed, 57 insertions, 0 deletions
diff --git a/src/_meters.scss b/src/_meters.scss new file mode 100644 index 0000000..9fd98b0 --- /dev/null +++ b/src/_meters.scss @@ -0,0 +1,57 @@ +// Meters +// Credit: https://css-tricks.com/html5-meter-element/ +.meter { + appearance: none; + background: $bg-color; + border: 0; + border-radius: $border-radius; + display: block; + width: 100%; + height: $unit-4; + + &::-webkit-meter-inner-element { + display: block; + } + + &::-webkit-meter-bar, + &::-webkit-meter-optimum-value, + &::-webkit-meter-suboptimum-value, + &::-webkit-meter-even-less-good-value { + border-radius: $border-radius; + } + + &::-webkit-meter-bar { + background: $bg-color; + } + + &::-webkit-meter-optimum-value { + background: $success-color; + } + + &::-webkit-meter-suboptimum-value { + background: $warning-color; + } + + &::-webkit-meter-even-less-good-value { + background: $error-color; + } + + &::-moz-meter-bar, + &:-moz-meter-optimum, + &:-moz-meter-sub-optimum, + &:-moz-meter-sub-sub-optimum { + border-radius: $border-radius; + } + + &:-moz-meter-optimum::-moz-meter-bar { + background: $success-color; + } + + &:-moz-meter-sub-optimum::-moz-meter-bar { + background: $warning-color; + } + + &:-moz-meter-sub-sub-optimum::-moz-meter-bar { + background: $error-color; + } +} |