X-Git-Url: https://gerrit.automotivelinux.org/gerrit/gitweb?p=src%2Fapp-framework-demo.git;a=blobdiff_plain;f=afb-client%2Fapp%2FFrontend%2Fwidgets%2FRangeSliders%2FRangeslider.scss;fp=afb-client%2Fapp%2FFrontend%2Fwidgets%2FRangeSliders%2FRangeslider.scss;h=6717d0e32ef6ec4d798195a30bc6cf58a4a3ab37;hp=0000000000000000000000000000000000000000;hb=5b1e6cc132f44262a873fa8296a2a3e1017b0278;hpb=f7d2f9ac4168ee5064580c666d508667a73cefc0 diff --git a/afb-client/app/Frontend/widgets/RangeSliders/Rangeslider.scss b/afb-client/app/Frontend/widgets/RangeSliders/Rangeslider.scss new file mode 100644 index 0000000..6717d0e --- /dev/null +++ b/afb-client/app/Frontend/widgets/RangeSliders/Rangeslider.scss @@ -0,0 +1,67 @@ +/* + * ibz-Datepicker for Foundation + * + * Author: Fulup Ar Foll + * Date : March-2015 + * Object: SASS stylesheet, customized to Foundation + * References: https://css-tricks.com/stripes-css/ + * + */ +@import "app/ibz-mixins"; + +.range-slider-handle { + display: inline-block; + position: absolute; + z-index: 1; + top: -0.2rem; + width: 2rem; + height: 1.375rem; + border: 1px solid none; + cursor: pointer; + background: #008cba; +} + +.range-slider.radius, .range-slider-handle { + background: #008cba; + -webkit-border-radius: 3px; + border-radius: 3px; +} + +.range-slider-active-segment { + display: inline-block; + top: 0.07rem; + position: absolute; + height: 0.80rem; + background: #e5e5e5; +} + +.ibz-range-slider { + background-color: rgba(154, 205, 50, 0.6) !important; + height: 1rem; + position: relative; + + .range-slider-active-segment { + background-color: rgba(82, 168, 200, 0.6); + } + + &-display { + background-color: rgba(82, 168, 200, 0.6) !important; + width : 4rem !important; + padding: .25rem; + text-align:center + } + + &-start,&-stop { + display: inline-block; + position: absolute; + padding-top: 2px; + height: 95%; + background: repeating-linear-gradient( + 45deg, + #606dbc, + #606dbc 10px, + #465298 10px, + #465298 20px + );} + +}