From cee8c7c15a4d67af6658fdf98fa444fddf32c121 Mon Sep 17 00:00:00 2001 From: PliablePixels Date: Sun, 26 Jul 2015 16:54:12 -0400 Subject: Added slider with alarm frame tick marks and scrubbing --- .../src/css/angular-awesome-slider.css | 531 +++++++++++++++++++++ .../angular-awesome-slider/src/css/less/main.less | 339 +++++++++++++ .../src/css/less/skin-blue.less | 79 +++ .../src/css/less/skin-css.less | 139 ++++++ .../src/css/less/skin-plastic.less | 78 +++ .../src/css/less/skin-round.less | 81 ++++ .../src/css/less/variables.less | 42 ++ .../src/css/sass/core/_variables.sass | 28 ++ .../src/css/sass/horizontal/_horizontal.sass | 23 + .../src/css/sass/horizontal/_labels.sass | 17 + .../src/css/sass/horizontal/_main.sass | 8 + .../src/css/sass/horizontal/_pointers-value.sass | 11 + .../src/css/sass/horizontal/_pointers.sass | 21 + .../src/css/sass/horizontal/_ranges.sass | 31 ++ .../src/css/sass/horizontal/_scale.sass | 15 + .../angular-awesome-slider/src/css/sass/main.sass | 17 + .../src/css/sass/skins/_skin-blue.sass | 55 +++ .../src/css/sass/skins/_skin-css.sass | 110 +++++ .../src/css/sass/skins/_skin-plastic.sass | 51 ++ .../src/css/sass/skins/_skin-round.sass | 56 +++ .../src/css/sass/vertical/_labels.sass | 11 + .../src/css/sass/vertical/_main.sass | 8 + .../src/css/sass/vertical/_pointers-value.sass | 9 + .../src/css/sass/vertical/_pointers.sass | 13 + .../src/css/sass/vertical/_ranges.sass | 46 ++ .../src/css/sass/vertical/_scales.sass | 16 + .../src/css/sass/vertical/_vertical.sass | 13 + .../src/css/scss/core/_variables.scss | 28 ++ .../src/css/scss/horizontal/_horizontal.scss | 24 + .../src/css/scss/horizontal/_labels.scss | 19 + .../src/css/scss/horizontal/_main.scss | 8 + .../src/css/scss/horizontal/_pointers-value.scss | 12 + .../src/css/scss/horizontal/_pointers.scss | 24 + .../src/css/scss/horizontal/_ranges.scss | 34 ++ .../src/css/scss/horizontal/_scale.scss | 16 + .../angular-awesome-slider/src/css/scss/main.scss | 17 + .../src/css/scss/skins/_skin-blue.scss | 60 +++ .../src/css/scss/skins/_skin-css.scss | 116 +++++ .../src/css/scss/skins/_skin-plastic.scss | 56 +++ .../src/css/scss/skins/_skin-round.scss | 61 +++ .../src/css/scss/vertical/_labels.scss | 12 + .../src/css/scss/vertical/_main.scss | 8 + .../src/css/scss/vertical/_pointers-value.scss | 10 + .../src/css/scss/vertical/_pointers.scss | 15 + .../src/css/scss/vertical/_ranges.scss | 48 ++ .../src/css/scss/vertical/_scales.scss | 18 + .../src/css/scss/vertical/_vertical.scss | 14 + 47 files changed, 2448 insertions(+) create mode 100644 www/lib/angular-awesome-slider/src/css/angular-awesome-slider.css create mode 100644 www/lib/angular-awesome-slider/src/css/less/main.less create mode 100644 www/lib/angular-awesome-slider/src/css/less/skin-blue.less create mode 100644 www/lib/angular-awesome-slider/src/css/less/skin-css.less create mode 100644 www/lib/angular-awesome-slider/src/css/less/skin-plastic.less create mode 100644 www/lib/angular-awesome-slider/src/css/less/skin-round.less create mode 100644 www/lib/angular-awesome-slider/src/css/less/variables.less create mode 100644 www/lib/angular-awesome-slider/src/css/sass/core/_variables.sass create mode 100644 www/lib/angular-awesome-slider/src/css/sass/horizontal/_horizontal.sass create mode 100644 www/lib/angular-awesome-slider/src/css/sass/horizontal/_labels.sass create mode 100644 www/lib/angular-awesome-slider/src/css/sass/horizontal/_main.sass create mode 100644 www/lib/angular-awesome-slider/src/css/sass/horizontal/_pointers-value.sass create mode 100644 www/lib/angular-awesome-slider/src/css/sass/horizontal/_pointers.sass create mode 100644 www/lib/angular-awesome-slider/src/css/sass/horizontal/_ranges.sass create mode 100644 www/lib/angular-awesome-slider/src/css/sass/horizontal/_scale.sass create mode 100644 www/lib/angular-awesome-slider/src/css/sass/main.sass create mode 100644 www/lib/angular-awesome-slider/src/css/sass/skins/_skin-blue.sass create mode 100644 www/lib/angular-awesome-slider/src/css/sass/skins/_skin-css.sass create mode 100644 www/lib/angular-awesome-slider/src/css/sass/skins/_skin-plastic.sass create mode 100644 www/lib/angular-awesome-slider/src/css/sass/skins/_skin-round.sass create mode 100644 www/lib/angular-awesome-slider/src/css/sass/vertical/_labels.sass create mode 100644 www/lib/angular-awesome-slider/src/css/sass/vertical/_main.sass create mode 100644 www/lib/angular-awesome-slider/src/css/sass/vertical/_pointers-value.sass create mode 100644 www/lib/angular-awesome-slider/src/css/sass/vertical/_pointers.sass create mode 100644 www/lib/angular-awesome-slider/src/css/sass/vertical/_ranges.sass create mode 100644 www/lib/angular-awesome-slider/src/css/sass/vertical/_scales.sass create mode 100644 www/lib/angular-awesome-slider/src/css/sass/vertical/_vertical.sass create mode 100644 www/lib/angular-awesome-slider/src/css/scss/core/_variables.scss create mode 100644 www/lib/angular-awesome-slider/src/css/scss/horizontal/_horizontal.scss create mode 100644 www/lib/angular-awesome-slider/src/css/scss/horizontal/_labels.scss create mode 100644 www/lib/angular-awesome-slider/src/css/scss/horizontal/_main.scss create mode 100644 www/lib/angular-awesome-slider/src/css/scss/horizontal/_pointers-value.scss create mode 100644 www/lib/angular-awesome-slider/src/css/scss/horizontal/_pointers.scss create mode 100644 www/lib/angular-awesome-slider/src/css/scss/horizontal/_ranges.scss create mode 100644 www/lib/angular-awesome-slider/src/css/scss/horizontal/_scale.scss create mode 100644 www/lib/angular-awesome-slider/src/css/scss/main.scss create mode 100644 www/lib/angular-awesome-slider/src/css/scss/skins/_skin-blue.scss create mode 100644 www/lib/angular-awesome-slider/src/css/scss/skins/_skin-css.scss create mode 100644 www/lib/angular-awesome-slider/src/css/scss/skins/_skin-plastic.scss create mode 100644 www/lib/angular-awesome-slider/src/css/scss/skins/_skin-round.scss create mode 100644 www/lib/angular-awesome-slider/src/css/scss/vertical/_labels.scss create mode 100644 www/lib/angular-awesome-slider/src/css/scss/vertical/_main.scss create mode 100644 www/lib/angular-awesome-slider/src/css/scss/vertical/_pointers-value.scss create mode 100644 www/lib/angular-awesome-slider/src/css/scss/vertical/_pointers.scss create mode 100644 www/lib/angular-awesome-slider/src/css/scss/vertical/_ranges.scss create mode 100644 www/lib/angular-awesome-slider/src/css/scss/vertical/_scales.scss create mode 100644 www/lib/angular-awesome-slider/src/css/scss/vertical/_vertical.scss (limited to 'www/lib/angular-awesome-slider/src/css') diff --git a/www/lib/angular-awesome-slider/src/css/angular-awesome-slider.css b/www/lib/angular-awesome-slider/src/css/angular-awesome-slider.css new file mode 100644 index 00000000..6f363d30 --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/angular-awesome-slider.css @@ -0,0 +1,531 @@ +/*http://codeguide.co/#css-syntax*/ +.jslider { + /* Positioning */ + + position: relative; + top: 0.6em; + /* Box-model */ + + cursor: pointer; + display: block; + width: 100%; + height: 1em; + /* Typography */ + font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; +} +.jslider.disabled { + opacity: 0.5; +} +.jslider table { + border-collapse: collapse; + border: 0; + width: 100%; +} +.jslider table td, +.jslider table th { + width: 100%; + border: 0; + padding: 0; + text-align: left; + vertical-align: top; +} +.jslider div.jslider-bg i, +.jslider div.jslider-pointer { + background: url(../img/jslider.png) no-repeat 0 0; +} +.jslider div.jslider-bg { + position: relative; +} +.jslider div.jslider-bg i { + position: absolute; + top: 0; + height: 5px; +} +.jslider div.jslider-bg i.left { + left: 0; + width: 50%; + background-position: 0 0; +} +.jslider div.jslider-bg i.right { + left: 50%; + width: 50%; + background-position: right 0; +} +.jslider div.jslider-bg i.range { + position: absolute; + top: 0; + left: 20%; + width: 60%; + height: 5px; + z-index: 1; + background-repeat: repeat-x; + background-position: 0 -40px; +} +.jslider div.jslider-bg i.default { + left: 0; + width: 1px; + z-index: 1; + background-color: #185f83; +} +.jslider.jslider-single div.jslider-pointer-to, +.jslider.jslider-single div.jslider-value-to, +.jslider.jslider-single div.jslider-bg .v, +.jslider.jslider-single .jslider-limitless .jslider-label { + display: none; +} +.jslider div.jslider-pointer { + position: absolute; + top: -4px; + left: 20%; + z-index: 2; + width: 15px; + height: 15px; + background-position: 2px -60px; + margin-left: -8px; + cursor: pointer; + cursor: hand; +} +.jslider div.jslider-pointer.jslider-pointer-to { + left: 80%; +} +.jslider div.jslider-pointer.jslider-pointer-hover { + background-position: -18px -60px; +} +.jslider div.jslider-label small, +.jslider div.jslider-value small { + position: relative; + top: -0.4em; +} +.jslider div.jslider-label { + position: absolute; + top: -18px; + left: 0px; + padding: 0px 2px; + opacity: 0.4; + color: #000000; + font-size: 9px; + line-height: 12px; + white-space: nowrap; +} +.jslider div.jslider-label.jslider-label-to { + left: auto; + right: 0; +} +.jslider div.jslider-value { + position: absolute; + top: -19px; + left: 0; + padding: 1px 2px 0; + background: white; + font-size: 9px; + line-height: 12px; + white-space: nowrap; + -moz-border-radius: 2px; + -webkit-border-radius: 2px; + -o-border-radius: 2px; + border-radius: 2px; +} +.jslider div.jslider-value.jslider-value-to { + left: 80%; +} +.jslider div.jslider-scale { + position: relative; + top: 9px; +} +.jslider div.jslider-scale span { + position: absolute; + height: 5px; + border-left: 1px solid #999; + font-size: 0; +} +.jslider div.jslider-scale ins { + position: absolute; + top: 5px; + left: 0px; + font-size: 9px; + text-decoration: none; + color: #999; +} +.jslider.vertical { + display: block; + width: 17px; + height: 100%; + position: relative; + top: 0.6em; + font-family: Arial, sans-serif; +} +.jslider.vertical table { + height: 100%; +} +.jslider.vertical.sliderCSS .jslider-bg i, +.jslider.vertical.jslider-pointer { + background-color: silver; + background-image: none; +} +.jslider.vertical div.jslider-bg i, +.jslider.vertical .jslider-pointer { + background: url(../img/jslider.vertical.png) no-repeat 0 0; +} +.jslider.vertical div.jslider-bg { + position: relative; + height: 100%; +} +.jslider.vertical div.jslider-bg i { + position: absolute; + top: 0; + width: 5px; + font-size: 0; +} +.jslider.vertical div.jslider-bg i.before { + left: 50%; + background: none; +} +.jslider.vertical div.jslider-bg i.left { + top: 0; + left: 50%; + height: 50%; + background-position: right 0; + background-repeat: repeat-y; +} +.jslider.vertical div.jslider-bg i.right { + top: 50%; + left: 50%; + height: 50%; + background-position: right 0; + background-repeat: repeat-y; +} +.jslider.vertical div.jslider-bg i.range { + position: absolute; + top: 0; + left: 50%; + width: 60%; + height: 100%; + z-index: 1; + background-repeat: repeat-y; + background-position: -36px 0px; +} +.jslider.vertical div.jslider-bg i.default { + left: 50%; + width: 5px; + height: 1px; + z-index: 1; + background-color: #185f83; +} +.jslider.vertical div.jslider-pointer { + left: 62%; + background-position: -7px -1px; +} +.jslider.vertical div.jslider-pointer.jslider-pointer-hover { + background-position: -7px -21px; +} +.jslider.vertical div.jslider-pointer.jslider-pointer-to { + left: 62%; +} +.jslider.vertical div.jslider-pointer.jslider-pointer-to.jslider-pointer-hover { + background-position: -7px -21px; +} +.jslider.vertical div.jslider-label { + top: -5px; + margin-left: 22px; +} +.jslider.vertical div.jslider-label.jslider-label-to { + top: 100%; + left: inherit; + right: inherit; + margin-top: -5px; +} +.jslider.vertical div.jslider-value { + top: 0; + left: 0; +} +.jslider.vertical div.jslider-value-to { + top: 80%; + left: 0; +} +.jslider.vertical div.jslider-scale { + position: inherit; +} +.jslider.vertical div.jslider-scale span { + position: absolute; + width: 5px; + height: 1px; + border-left: none; + font-size: 0; + border-top: 1px solid #999; +} +.jslider.vertical div.jslider-scale ins { + position: absolute; + left: 0px; + top: 5px; + font-size: 9px; + text-decoration: none; + color: #999999; +} +.jslider.sliderCSS div.jslider-bg i.left { + left: 0; + width: 50%; + background-color: #c0c0c0; + background-image: none; +} +.jslider.sliderCSS div.jslider-bg i.right { + width: 50%; + left: 50%; + background-color: #c0c0c0; + background-image: none; +} +.jslider.sliderCSS div.jslider-bg i.before { + left: 0; + width: 1px; + background-color: rgba(92, 98, 203, 0.89); + background-image: none; +} +.jslider.sliderCSS div.jslider-bg i.default { + left: 0; + width: 1px; + z-index: 1; + background-color: #ffffff; + background-image: none; +} +.jslider.sliderCSS div.jslider-bg i.after { + left: 0; + background-color: #0e1773; + background-image: none; +} +.jslider.sliderCSS div.jslider-bg i.range { + position: absolute; + top: 0; + left: 20%; + width: 60%; + height: 5px; + z-index: 1; + background-image: none; + background-color: #777575; +} +.jslider.sliderCSS div.jslider-pointer { + top: -3px; + left: 15px; + width: 10px; + height: 10px; + margin-left: -5px; + background-color: silver; + background-color: #615959; + border-radius: 50%; +} +.jslider.sliderCSS div.jslider-bg i, +.jslider.sliderCSS div.jslider-pointer { + background: none; +} +.jslider.sliderCSS.vertical td { + height: 100%; +} +.jslider.sliderCSS.vertical div.jslider-bg i { + left: 50%; + width: 5px; +} +.jslider.sliderCSS.vertical div.jslider-bg i.left { + top: 0; + height: 50%; + background-color: #c0c0c0; + background-image: none; +} +.jslider.sliderCSS.vertical div.jslider-bg i.right { + height: 50%; + top: 50%; + background-color: #c0c0c0; + background-image: none; +} +.jslider.sliderCSS.vertical div.jslider-bg i.range { + height: 100%; + z-index: 1; + background-color: #777575; + background-image: none; +} +.jslider.sliderCSS.vertical div.jslider-bg i.before { + background-color: rgba(92, 98, 203, 0.89); + background-image: none; +} +.jslider.sliderCSS.vertical div.jslider-bg i.default { + height: 1px; + background-color: #ffffff; + background-image: none; + z-index: 2; +} +.jslider.sliderCSS.vertical div.jslider-bg i.after { + background-color: #0e1773; + background-image: none; +} +.jslider.sliderCSS.vertical div.jslider-bg i, +.jslider.sliderCSS.vertical div.jslider-pointer { + background: none; +} +.jslider.sliderCSS.vertical div.jslider-pointer { + left: 50%; + width: 10px; + height: 10px; + background-color: #615959; + border-radius: 50%; + margin-left: -3px; +} +.jslider.sliderCSS.vertical div.jslider-pointer.jslider-pointer-to { + left: 50%; +} +.jslider.jslider_round div.jslider-bg i, +.jslider.jslider_round div.jslider-pointer { + background: url(../img/jslider.round.png) no-repeat 0 0; +} +.jslider.jslider_round div.jslider-bg i { + background-position: 0 -20px; +} +.jslider.jslider_round div.jslider-bg i.default { + background-color: #C2C7CA; +} +.jslider.jslider_round div.jslider-bg i.range { + z-index: 1; + background-position: 0 -40px; +} +.jslider.jslider_round div.jslider-pointer { + top: -6px; + width: 20px; + height: 17px; + background-position: 0 -60px; + z-index: 2; +} +.jslider.jslider_round div.jslider-pointer.jslider-pointer-hover { + background-position: -20px -60px; +} +.jslider.jslider_round.vertical div.jslider-bg i, +.jslider.jslider_round.vertical div.jslider-pointer { + background: url(../img/jslider.round.vertical.png) no-repeat 0 0; +} +.jslider.jslider_round.vertical div.jslider-bg i { + background-position: right 0; +} +.jslider.jslider_round.vertical div.jslider-bg i.range { + background-position: -37px 0; +} +.jslider.jslider_round.vertical div.jslider-bg i.before, +.jslider.jslider_round.vertical div.jslider-bg i.after { + background: none; +} +.jslider.jslider_round.vertical div.jslider-bg i.default { + background-color: #c2c7ca; +} +.jslider.jslider_round.vertical div.jslider-pointer { + top: -6px; + width: 20px; + height: 17px; + background-position: -4px -3px; +} +.jslider.jslider_round.vertical div.jslider-pointer.jslider-pointer-hover { + background-position: -4px -23px; +} +.jslider.jslider_round.vertical div.jslider-pointer.jslider-value-to { + left: 80%; +} +.jslider.jslider_round.vertical div.jslider-value { + left: 0; +} +.jslider.jslider_blue .jslider-bg i, +.jslider.jslider_blue .jslider-pointer { + background: url(../img/jslider.blue.png) no-repeat 0 0; +} +.jslider.jslider_blue .jslider-bg i { + background-position: 2px -20px; +} +.jslider.jslider_blue .jslider-bg i.default { + background-color: #c2c7ca; +} +.jslider.jslider_blue .jslider-bg i.range { + z-index: 1; + background-position: 0 -40px; +} +.jslider.jslider_blue div.jslider-pointer { + top: -6px; + width: 20px; + height: 17px; + background-position: 2px -60px; + z-index: 2; +} +.jslider.jslider_blue div.jslider-pointer.jslider-pointer-hover { + background-position: -20px -60px; +} +.jslider.jslider_blue.vertical div.jslider-bg i, +.jslider.jslider_blue.vertical div.jslider-pointer { + background: url(../img/jslider.blue.vertical.png) no-repeat 0 0; +} +.jslider.jslider_blue.vertical div.jslider-bg i { + background-position: right 0; +} +.jslider.jslider_blue.vertical div.jslider-bg i.range { + background-position: -37px 0; +} +.jslider.jslider_blue.vertical div.jslider-bg i.before, +.jslider.jslider_blue.vertical div.jslider-bg i.after { + background: none; +} +.jslider.jslider_blue.vertical div.jslider-bg i.default { + background-color: #c2c7ca; +} +.jslider.jslider_blue.vertical div.jslider-pointer { + top: -6px; + width: 20px; + height: 17px; + background-position: -7px 0; +} +.jslider.jslider_blue.vertical div.jslider-pointer.jslider-pointer-hover { + background-position: -7px -20px; +} +.jslider.jslider_blue.vertical div.jslider-value { + left: 0; +} +.jslider.jslider_plastic .jslider-bg i, +.jslider.jslider_plastic .jslider-pointer { + background: url(../img/jslider.plastic.png) no-repeat 0 0; +} +.jslider.jslider_plastic .jslider-bg i { + background-position: 2px -20px; +} +.jslider.jslider_plastic .jslider-bg i.default { + background-color: #c2c7ca; +} +.jslider.jslider_plastic .jslider-bg i.range { + z-index: 1; + background-position: 0 -40px; +} +.jslider.jslider_plastic .jslider-pointer { + z-index: 2; + width: 20px; + height: 17px; + top: -4px; + background-position: 2px -60px; +} +.jslider.jslider_plastic .jslider-pointer.jslider-pointer-hover { + background-position: -18px -60px; +} +.jslider.jslider_plastic.vertical div.jslider-bg i, +.jslider.jslider_plastic.vertical div.jslider-pointer { + background: url(../img/jslider.plastic.vertical.png) no-repeat 0 0; +} +.jslider.jslider_plastic.vertical div.jslider-bg i { + background-position: right 0; +} +.jslider.jslider_plastic.vertical div.jslider-bg i.range { + background-position: -35px 0; +} +.jslider.jslider_plastic.vertical div.jslider-bg i.before, +.jslider.jslider_plastic.vertical div.jslider-bg i.after { + background: none; +} +.jslider.jslider_plastic.vertical div.jslider-bg i.default { + background-color: #c2c7ca; +} +.jslider.jslider_plastic.vertical div.jslider-pointer { + top: -6px; + margin-left: -6px; + width: 20px; + height: 17px; + background-position: -7px -1px; +} +.jslider.jslider_plastic.vertical div.jslider-pointer.jslider-pointer-hover { + background-position: -7px -21px; +} diff --git a/www/lib/angular-awesome-slider/src/css/less/main.less b/www/lib/angular-awesome-slider/src/css/less/main.less new file mode 100644 index 00000000..5182d4af --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/less/main.less @@ -0,0 +1,339 @@ +// +// Main slider css rules +// -------------------------------------------------- + +@import "variables.less"; + +/*http://codeguide.co/#css-syntax*/ + +.jslider { + + /* Positioning */ + position: relative; + top: 0.6em; + + /* Box-model */ + cursor: pointer; + display: block; + width: 100%; + height: 1em; + + /* Typography */ + font-family: @font-family-base; + + // disabled + &.disabled { opacity: 0.5; } + + table { + border-collapse: collapse; + border: 0; + width: 100%; + td, th { + width: 100%; + vertical-align: top; + border: 0; + padding: 0; + text-align: left; + vertical-align: top; + } + } + + // RANGES + div.jslider-bg i, div.jslider-pointer { + background: url(../img/jslider.png) no-repeat 0 0; + } + + div.jslider-bg { + position: relative; + i { + position: absolute; + top: 0; + height: 5px; + + &.left { + left: 0; + width: 50%; + background-position: 0 0; + } + + &.right { + left: 50%; + width: 50%; + background-position: right 0; + } + + &.range { + position: absolute; + top: 0; + left: 20%; + width: 60%; + height: 5px; + z-index: 1; + background-repeat: repeat-x; + background-position: 0 -40px; + } + + &.default { + left: 0; + width: 1px; + z-index: 1; + background-color: @color-pointers-default-value; + } + + } + } + // END RANGES + + // POINTERS + // single value hide to + &.jslider-single { + div.jslider-pointer-to, + div.jslider-value-to, + div.jslider-bg .v, + .jslider-limitless .jslider-label { + display: none; + } + } + + div.jslider-pointer { + position: absolute; + top: -4px; + left: 20%; + z-index: 2; + width: 15px; + height: 15px; + background-position: 2px -60px; + margin-left: -8px; + cursor: pointer; + cursor: hand; + + &.jslider-pointer-to { + left: 80%; + } + + &.jslider-pointer-hover { + background-position: -18px -60px; + } + } + // END POINTERS + + // LABELS + div.jslider-label small, + div.jslider-value small { + position: relative; + top: -0.4em; + } + + // limits + div.jslider-label { + position: absolute; + top: -18px; + left: 0px; + padding: 0px 2px; + opacity: 0.4; + color: @color-pointers-label; + font-size: @font-size-pointers-label; + line-height: @line-height-pointers-label; + white-space: nowrap; + + &.jslider-label-to { + left: auto; + right: 0; + } + } + // END LABELS + + // POINTERS VALUE + div.jslider-value { + position: absolute; + top: -19px; + left: 0; + padding: 1px 2px 0; + background: white; + font-size: @font-size-pointers-value; + line-height: @line-height-pointers-value; + white-space: nowrap; + -moz-border-radius: 2px; + -webkit-border-radius: 2px; + -o-border-radius: 2px; + border-radius: 2px; + &.jslider-value-to { + left: 80%; + } + } + // END POINTERS VALUE + + // SCALE + div.jslider-scale { + position: relative; + top: 9px; + span { + position: absolute; + height: 5px; + border-left: 1px solid #999; + font-size: 0; + } + ins { + position: absolute; + top: 5px; + left: 0px; + font-size: 9px; + text-decoration: none; + color: #999; } + } + // END SCALE + + // VERTICAL + &.vertical { + display: block; + width: 17px; + height: 100%; + position: relative; + top: 0.6em; + font-family: Arial, sans-serif; + table { + height: 100%; + } + + &.sliderCSS .jslider-bg i, &.jslider-pointer { + background-color: silver; + background-image: none; + } + + // RANGES + div.jslider-bg i,.jslider-pointer { + background: url(../img/jslider.vertical.png) no-repeat 0 0; + } + + div.jslider-bg { + position: relative; + height:100%; + + i { + position: absolute; + top: 0; + width: 5px; + font-size: 0; + + &.before { + left: 50%; + background: none + } + + &.left { + top: 0; + left: 50%; + height: 50%; + background-position: right 0; + background-repeat: repeat-y + } + + &.right { + top: 50%; + left: 50%; + height: 50%; + background-position: right 0; + background-repeat: repeat-y + } + + &.range { + position: absolute; + top: 0; + left: 50%; + width: 60%; + height: 100%; + z-index: 1; + background-repeat: repeat-y; + background-position: -36px 0px; + } + + &.default { + left: 50%; + width: 5px; + height:1px; + z-index: 1; + background-color: @color-pointers-default-value; + } + + } + } + // END RANGES + + // POINTERS + div.jslider-pointer { + left: 62%; + background-position: -7px -1px; + + &.jslider-pointer-hover { + background-position: -7px -21px; + } + + &.jslider-pointer-to { + left: 62%; + } + + &.jslider-pointer-to.jslider-pointer-hover { + background-position: -7px -21px; + } + } + // END POINTERS + + // LABELS + div.jslider-label { + top: -5px; + margin-left: 22px; + + &.jslider-label-to { + top:100%; + left: inherit; + right: inherit; + margin-top: -5px; + } + } + // END LABELS + + + // POINTERS VALUE + div.jslider-value { + top: 0; + left: 0; + } + + div.jslider-value-to { + top: 80%; + left: 0; + } + // END POINTERS VALUE + + // SCALES + div.jslider-scale { + position: inherit; + span { + position: absolute; + width: 5px; + height: 1px; + border-left: none; + font-size: 0; + border-top: 1px solid #999; + } + ins { + position: absolute; + left: 0px; + top: 5px; + font-size: 9px; + text-decoration: none; + color: @color-scale; + } + } + + } + // END VERTICAL + + + // SKINS + @import "skin-css.less"; + @import "skin-round.less"; + @import "skin-blue.less"; + @import "skin-plastic.less"; +} + diff --git a/www/lib/angular-awesome-slider/src/css/less/skin-blue.less b/www/lib/angular-awesome-slider/src/css/less/skin-blue.less new file mode 100644 index 00000000..931c6afb --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/less/skin-blue.less @@ -0,0 +1,79 @@ +// +// Blue skin +// -------------------------------------------------- + +&.jslider_blue { + .jslider-bg i, + .jslider-pointer { + background: url(../img/jslider.blue.png) no-repeat 0 0; + } + + .jslider-bg { + i { + background-position: 2px -20px; + &.default { + background-color: @color-skin-pointers-default-value; + } + + &.range { + z-index: 1; + background-position: 0 -40px; + } + } + } + + div.jslider-pointer { + top: -6px; + width: 20px; + height: 17px; + background-position: 2px -60px; + z-index: 2; + + &.jslider-pointer-hover { + background-position: -20px -60px; + } + } + + &.vertical { + div.jslider-bg i, + div.jslider-pointer { + background: url(../img/jslider.blue.vertical.png) no-repeat 0 0; + } + + div.jslider-bg { + i { + background-position: right 0; + + &.range { + background-position: -37px 0; + } + + &.before, + &.after { + background: none; + } + + &.default { + background-color: @color-skin-pointers-default-value; + } + } + } + + div.jslider-pointer { + top: -6px; + width: 20px; + height: 17px; + background-position: -7px 0; + + &.jslider-pointer-hover { + background-position: -7px -20px; + } + + } + + div.jslider-value { + left: 0; + } + + } +} diff --git a/www/lib/angular-awesome-slider/src/css/less/skin-css.less b/www/lib/angular-awesome-slider/src/css/less/skin-css.less new file mode 100644 index 00000000..43b45901 --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/less/skin-css.less @@ -0,0 +1,139 @@ +// +// Main slider custom overrided js css rules +// -------------------------------------------------- +&.sliderCSS { + + div.jslider-bg { + + i { + &.left { + left: 0; + width: 50%; + background-color: @color-skin-background; + background-image: none; + } + &.right { + width: 50%; + left: 50%; + background-color: @color-skin-background; + background-image: none; + } + &.before { + left: 0; + width: 1px; + background-color: @color-skin-css-pointers-before-value; + background-image: none; + } + &.default { + left: 0; + width: 1px; + z-index: 1; + background-color: @color-skin-css-pointers-default-value; + background-image: none; + } + &.after { + left: 0; + background-color: @color-skin-css-pointers-after-value; + background-image: none; + } + &.range { + position: absolute; + top: 0; + left: 20%; + width: 60%; + height: 5px; + z-index: 1; + background-image: none; + background-color: #777575 + } + } + } + + div.jslider-pointer { + top: -3px; + left: 15px; + width: 10px; + height: 10px; + margin-left: -5px; + background-color: silver; + background-color: #615959; + border-radius: 50%; + } + + div.jslider-bg i,div.jslider-pointer { + background: none; + } + + // vertical + &.vertical { + + td { + height: 100%; + } + + div.jslider-bg { + + i { + left: 50%; + width: 5px; + + &.left { + top: 0; + height: 50%; + background-color: @color-skin-background; + background-image: none; + } + + &.right { + height: 50%; + top: 50%; + background-color: @color-skin-background; + background-image: none; + } + + &.range { + height: 100%; + z-index: 1; + background-color: #777575; + background-image: none; + } + + &.before { + background-color: @color-skin-css-pointers-before-value; + background-image: none; + } + + &.default { + height: 1px; + background-color: @color-skin-css-pointers-default-value; + background-image: none; + z-index: 2; + } + + &.after { + background-color: @color-skin-css-pointers-after-value; + background-image: none; + } + + } + + } + + div.jslider-bg i,div.jslider-pointer { + background: none; + } + + div.jslider-pointer { + left: 50%; + width: 10px; + height: 10px; + background-color: #615959; + border-radius: 50%; + margin-left: -3px; + + &.jslider-pointer-to { + left: 50%; + } + } + } +} diff --git a/www/lib/angular-awesome-slider/src/css/less/skin-plastic.less b/www/lib/angular-awesome-slider/src/css/less/skin-plastic.less new file mode 100644 index 00000000..31ebf55d --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/less/skin-plastic.less @@ -0,0 +1,78 @@ +// +// Plastic skin +// -------------------------------------------------- + +&.jslider_plastic { + .jslider-bg i, + .jslider-pointer { + background: url(../img/jslider.plastic.png) no-repeat 0 0; + } + + .jslider-bg { + i { + background-position: 2px -20px; + &.default { + background-color: @color-skin-pointers-default-value; + } + + &.range { + z-index: 1; + background-position: 0 -40px; + } + } + } + + .jslider-pointer { + z-index: 2; + width: 20px; + height: 17px; + top: -4px; + background-position: 2px -60px; + + &.jslider-pointer-hover { + background-position: -18px -60px; + } + } + + &.vertical { + div.jslider-bg i, + div.jslider-pointer { + background: url(../img/jslider.plastic.vertical.png) no-repeat 0 0; + } + + div.jslider-bg { + + i { + background-position: right 0; + + &.range { + background-position: -35px 0; + } + + &.before, + &.after { + background: none; + } + + &.default { + background-color: @color-skin-pointers-default-value; + } + } + } + + div.jslider-pointer { + top: -6px; + margin-left: -6px; + width: 20px; + height: 17px; + background-position: -7px -1px; + + &.jslider-pointer-hover { + background-position: -7px -21px; + } + + } + + } +} + diff --git a/www/lib/angular-awesome-slider/src/css/less/skin-round.less b/www/lib/angular-awesome-slider/src/css/less/skin-round.less new file mode 100644 index 00000000..b0247d7b --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/less/skin-round.less @@ -0,0 +1,81 @@ +// +// Round skin +// -------------------------------------------------- + +&.jslider_round { + div.jslider-bg i, + div.jslider-pointer { + background: url(../img/jslider.round.png) no-repeat 0 0; + } + + div.jslider-bg { + i { + background-position: 0 -20px; + &.default { + background-color: #C2C7CA; + } + + &.range { + z-index: 1; + background-position: 0 -40px; + } + } + } + + div.jslider-pointer { + top: -6px; + width: 20px; + height: 17px; + background-position: 0 -60px; + z-index: 2; + + &.jslider-pointer-hover { + background-position: -20px -60px; + } + } + + &.vertical { + div.jslider-bg i, + div.jslider-pointer { + background: url(../img/jslider.round.vertical.png) no-repeat 0 0; + } + + div.jslider-bg { + i { + background-position: right 0; + &.range { + background-position: -37px 0; + } + + &.before, + &.after { + background: none; + } + + &.default { + background-color: @color-skin-pointers-default-value; + } + } + } + + div.jslider-pointer { + top: -6px; + width: 20px; + height: 17px; + background-position: -4px -3px; + + &.jslider-pointer-hover { + background-position: -4px -23px; + } + + &.jslider-value-to { + left: 80%; + } + } + + div.jslider-value { + left: 0; + } + + } +} diff --git a/www/lib/angular-awesome-slider/src/css/less/variables.less b/www/lib/angular-awesome-slider/src/css/less/variables.less new file mode 100644 index 00000000..4e667771 --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/less/variables.less @@ -0,0 +1,42 @@ +// +// Variables +// -------------------------------------------------- + + +//== Colors +// + +@black: #000; +@white: #fff; +@gray: #999; +@gray2: #C2C7CA; +@blue: #185F83; + +//== Typography +// + +@font-family-sans-serif: "Helvetica Neue", Helvetica, Arial, sans-serif; +@font-family-base: @font-family-sans-serif; + +@font-size-pointers-label: 9px; +@line-height-pointers-label: 12px; +@font-size-pointers-value: @font-size-pointers-label; +@line-height-pointers-value: @line-height-pointers-label; + +@color-pointers-label: @black; +@color-pointers-value: @color-pointers-label; +@color-scale: @gray; + +@color-pointers-default-value: @blue; + +//== Skin CSS +// + +@color-skin-pointers-default-value: @gray2; + +@color-skin-background: silver; +@color-skin-css-pointers-default-value: @white; +@color-skin-css-pointers-before-value: rgba(92, 98, 203, 0.89); +@color-skin-css-pointers-after-value: rgb(14, 23, 115); + + diff --git a/www/lib/angular-awesome-slider/src/css/sass/core/_variables.sass b/www/lib/angular-awesome-slider/src/css/sass/core/_variables.sass new file mode 100644 index 00000000..a548321e --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/sass/core/_variables.sass @@ -0,0 +1,28 @@ +// Colors + +$black: #000000 +$white: #ffffff +$gray: #999999 +$gray2: #c2c7Ca +$blue: #185f83 + +// Typography + +$font-family-sans-serif: "Helvetica Neue", Helvetica, Arial, sans-serif +$font-family-base: $font-family-sans-serif +$font-size-pointers-label: 9px +$line-height-pointers-label: 12px +$font-size-pointers-value: $font-size-pointers-label +$line-height-pointers-value: $line-height-pointers-label +$color-pointers-label: $black +$color-pointers-value: $color-pointers-label +$color-scale: $gray +$color-pointers-default-value: $blue + +// Skin CSS + +$color-skin-pointers-default-value: $gray2 +$color-skin-background: silver +$color-skin-css-pointers-default-value: $white +$color-skin-css-pointers-before-value: rgba(92, 98, 203, 0.89) +$color-skin-css-pointers-after-value: rgb(14, 23, 115) diff --git a/www/lib/angular-awesome-slider/src/css/sass/horizontal/_horizontal.sass b/www/lib/angular-awesome-slider/src/css/sass/horizontal/_horizontal.sass new file mode 100644 index 00000000..067fc92b --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/sass/horizontal/_horizontal.sass @@ -0,0 +1,23 @@ +// Horizontal Styles + +.jslider + +position(relative, 0.6em null null null) + cursor: pointer + display: block + +size(100% 1em) + font-family: $font-family-base + + &.disabled + opacity: 0.5 + + table + border-collapse: collapse + border: 0 + width: 100% + + td, th + width: 100% + border: 0 + padding: 0 + text-align: left + vertical-align: top diff --git a/www/lib/angular-awesome-slider/src/css/sass/horizontal/_labels.sass b/www/lib/angular-awesome-slider/src/css/sass/horizontal/_labels.sass new file mode 100644 index 00000000..5150adef --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/sass/horizontal/_labels.sass @@ -0,0 +1,17 @@ +div.jslider-label small, +div.jslider-value small + +position(relative, -0.4em null null null) + +// limits +div.jslider-label + +position(absolute, -18px null 0 null) + padding: 0px 2px + opacity: 0.4 + color: $color-pointers-label + font-size: $font-size-pointers-label + line-height: $line-height-pointers-label + white-space: nowrap + + &.jslider-label-to + left: auto + right: 0 diff --git a/www/lib/angular-awesome-slider/src/css/sass/horizontal/_main.sass b/www/lib/angular-awesome-slider/src/css/sass/horizontal/_main.sass new file mode 100644 index 00000000..d6a774ac --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/sass/horizontal/_main.sass @@ -0,0 +1,8 @@ +// Horizontal Styles + +@import horizontal +@import ranges +@import pointers +@import labels +@import pointers-value +@import scale diff --git a/www/lib/angular-awesome-slider/src/css/sass/horizontal/_pointers-value.sass b/www/lib/angular-awesome-slider/src/css/sass/horizontal/_pointers-value.sass new file mode 100644 index 00000000..f5233608 --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/sass/horizontal/_pointers-value.sass @@ -0,0 +1,11 @@ +div.jslider-value + +position(absolute, -19px null 0 null) + padding: 1px 2px 0 + // background: white + font-size: $font-size-pointers-value + line-height: $line-height-pointers-value + white-space: nowrap + border-radius: 2px + + &.jslider-value-to + left: 80% diff --git a/www/lib/angular-awesome-slider/src/css/sass/horizontal/_pointers.sass b/www/lib/angular-awesome-slider/src/css/sass/horizontal/_pointers.sass new file mode 100644 index 00000000..bee15943 --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/sass/horizontal/_pointers.sass @@ -0,0 +1,21 @@ +// single value hide to +.jslider-single + div.jslider-pointer-to, + div.jslider-value-to, + div.jslider-bg .v, + .jslider-limitless .jslider-label + display: none + +div.jslider-pointer + +position(absolute, -4px null 20% null) + +size(15px) + background-position: 2px -60px + margin-left: -8px + cursor: hand + z-index: 2 + + &.jslider-pointer-to + left: 80% + + &.jslider-pointer-hover + background-position: -19px -60px diff --git a/www/lib/angular-awesome-slider/src/css/sass/horizontal/_ranges.sass b/www/lib/angular-awesome-slider/src/css/sass/horizontal/_ranges.sass new file mode 100644 index 00000000..b47dfa41 --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/sass/horizontal/_ranges.sass @@ -0,0 +1,31 @@ +div.jslider-bg i, div.jslider-pointer + background: url("../img/jslider.png") no-repeat 0 0 + +div.jslider-bg + position: relative + i + +position(absolute, 0 null null null) + height: 5px + + &.left + left: 0 + width: 50% + background-position: 0 0 + + &.right + left: 50% + width: 50% + background-position: right 0 + + &.range + +position(absolute, 0 null null 20%) + +size(60% 5px) + background-repeat: repeat-x + background-position: 0 -40px + z-index: 1 + + &.default + left: 0 + width: 1px + z-index: 1 + background-color: $color-pointers-default-value diff --git a/www/lib/angular-awesome-slider/src/css/sass/horizontal/_scale.sass b/www/lib/angular-awesome-slider/src/css/sass/horizontal/_scale.sass new file mode 100644 index 00000000..59f4828c --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/sass/horizontal/_scale.sass @@ -0,0 +1,15 @@ +div.jslider-scale + position: relative + top: 9px + + span + position: absolute + height: 5px + border-left: 1px solid $gray + font-size: 0 + + ins + +position(absolute, 5px null 0 null) + font-size: 9px + text-decoration: none + color: $gray diff --git a/www/lib/angular-awesome-slider/src/css/sass/main.sass b/www/lib/angular-awesome-slider/src/css/sass/main.sass new file mode 100644 index 00000000..5752ee62 --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/sass/main.sass @@ -0,0 +1,17 @@ +// Import Bourbon Mixins +@import ../../../bower_components/bourbon/app/assets/stylesheets/bourbon + +// Main slider css rules +@import core/variables + +// Horizontal Slider +@import horizontal/main + +// Vertical Slider +@import vertical/main + +// Skins +@import skins/skin-css +@import skins/skin-round +@import skins/skin-blue +@import skins/skin-plastic diff --git a/www/lib/angular-awesome-slider/src/css/sass/skins/_skin-blue.sass b/www/lib/angular-awesome-slider/src/css/sass/skins/_skin-blue.sass new file mode 100644 index 00000000..f6dcb51d --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/sass/skins/_skin-blue.sass @@ -0,0 +1,55 @@ +// Blue Skin + +.jslider_blue + .jslider-bg i, + .jslider-pointer + background: url("../img/jslider.blue.png") no-repeat 0 0 + + .jslider-bg + i + background-position: 2px -20px + + &.default + background-color: $color-skin-pointers-default-value + + &.range + z-index: 1 + background-position: 0 -40px + + div.jslider-pointer + top: -6px + width: 20px + height: 17px + background-position: 2px -60px + z-index: 2 + + &.vertical + div.jslider-bg i, + div.jslider-pointer + background: url("../img/jslider.blue.vertical.png") no-repeat 0 0 + + div.jslider-bg + i + background-position: right 0 + + &.range + background-position: -37px 0 + + &.before, + &.after + background: none + + &.default + background-color: $color-skin-pointers-default-value + + div.jslider-pointer + top: -6px + width: 20px + height: 17px + background-position: -7px 0 + + &.jslider-pointer-hover + background-position: -7px -20px + + div.jslider-value + left: 0 diff --git a/www/lib/angular-awesome-slider/src/css/sass/skins/_skin-css.sass b/www/lib/angular-awesome-slider/src/css/sass/skins/_skin-css.sass new file mode 100644 index 00000000..887d1f99 --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/sass/skins/_skin-css.sass @@ -0,0 +1,110 @@ +$skin-gray: #777575 +$skin-gray-2: #615959 + +// Main slider custom overrided js css rules + +.sliderCSS + div.jslider-bg + i + &.left + left: 0 + width: 50% + background-color: $color-skin-background + background-image: none + + &.right + width: 50% + left: 50% + background-color: $color-skin-background + background-image: none + + &.before + left: 0 + width: 1px + background-color: $color-skin-css-pointers-before-value + background-image: none + + &.default + left: 0 + width: 1px + z-index: 1 + background-color: $color-skin-css-pointers-default-value + background-image: none + + &.after + left: 0 + background-color: $color-skin-css-pointers-after-value + background-image: none + + &.range + +position(absolute, 0 null 20% null) + +size(60% 5px) + background-image: none + background-color: $skin-gray + z-index: 1 + + div.jslider-pointer + top: -3px + left: 15px + +size(10px) + background-color: silver + background-color: $skin-gray-2 + border-radius: 50% + + div.jslider-bg i, div.jslider-pointer + background: none + + // vertical + &.vertical + td { + height: 100%; + } + div.jslider-bg + i + left: 50% + width: 5px + + &.left + top: 0 + height: 50% + background-color: $color-skin-background + background-image: none + + &.right + height: 50% + top: 50% + background-color: $color-skin-background + background-image: none + + &.range + height: 100% + z-index: 1 + background-color: $skin-gray + background-image: none + + &.before + background-color: $color-skin-css-pointers-before-value + background-image: none + + &.default + height: 1px + background-color: $color-skin-css-pointers-default-value + background-image: none + z-index: 2 + + &.after + background-color: $color-skin-css-pointers-after-value + background-image: none + + div.jslider-bg i, div.jslider-pointer + background: none + + div.jslider-pointer + left: 50% + +size(10px) + background-color: $skin-gray-2 + border-radius: 50% + margin-left: -3px + + &.jslider-pointer-to + left: 50% diff --git a/www/lib/angular-awesome-slider/src/css/sass/skins/_skin-plastic.sass b/www/lib/angular-awesome-slider/src/css/sass/skins/_skin-plastic.sass new file mode 100644 index 00000000..5b5b5408 --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/sass/skins/_skin-plastic.sass @@ -0,0 +1,51 @@ +// Plastic Skin + +.jslider_plastic + .jslider-bg i, + .jslider-pointer + background: url("../img/jslider.plastic.png") no-repeat 0 0 + + .jslider-bg + i + background-position: 2px -20px + + &.default + background-color: $color-skin-pointers-default-value + + &.range + z-index: 1 + background-position: 0 -40px + + .jslider-pointer + z-index: 2 + +size(20px 17px) + top: -6px + background-position: 2px -60px + + &.vertical + div.jslider-bg i, + div.jslider-pointer + background: url("../img/jslider.plastic.vertical.png") no-repeat 0 0 + + div.jslider-bg + i + background-position: right 0 + + &.range + background-position: -35px 0 + + &.before, + &.after + background: none + + &.default + background-color: $color-skin-pointers-default-value + + div.jslider-pointer + top: -6px + margin-left: -6px + +size(20px 17px) + background-position: -7px -1px + + &.jslider-pointer-hover + background-position: -7px -21px diff --git a/www/lib/angular-awesome-slider/src/css/sass/skins/_skin-round.sass b/www/lib/angular-awesome-slider/src/css/sass/skins/_skin-round.sass new file mode 100644 index 00000000..48e7cdb2 --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/sass/skins/_skin-round.sass @@ -0,0 +1,56 @@ +// Round Skin + +.jslider_round + div.jslider-bg i, + div.jslider-pointer + background: url("../img/jslider.round.png") no-repeat 0 0 + + div.jslider-bg + i + background-position: 0 -20px + + &.default + background-color: $gray2 + + &.range + z-index: 1 + background-position: 0 -40px + + div.jslider-pointer + top: -6px + +size(20px 17px) + background-position: 0 -60px + z-index: 2 + + &.vertical + div.jslider-bg i, + div.jslider-pointer + background: url("../img/jslider.round.vertical.png") no-repeat 0 0 + + div.jslider-bg + i + background-position: right 0 + + &.range + background-position: -37px 0 + + &.before, + &.after + background: none + + &.default + background-color: $color-skin-pointers-default-value + + div.jslider-pointer + top: -6px + +size(20px 17px) + background-position: -4px -3px + + &.jslider-pointer-hover + background-position: -4px -23px + + &.jslider-value-to + left: 80% + + div.jslider-value + left: 0 diff --git a/www/lib/angular-awesome-slider/src/css/sass/vertical/_labels.sass b/www/lib/angular-awesome-slider/src/css/sass/vertical/_labels.sass new file mode 100644 index 00000000..0ced5eef --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/sass/vertical/_labels.sass @@ -0,0 +1,11 @@ +.vertical + div.jslider-label + top: -5px + margin-left: 22px + + &.jslider-label-to + top: 100% + left: inherit + right: inherit + margin-top: -5px + diff --git a/www/lib/angular-awesome-slider/src/css/sass/vertical/_main.sass b/www/lib/angular-awesome-slider/src/css/sass/vertical/_main.sass new file mode 100644 index 00000000..64ba478f --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/sass/vertical/_main.sass @@ -0,0 +1,8 @@ +// Vertical Styles + +@import vertical +@import ranges +@import pointers +@import labels +@import pointers-value +@import scales diff --git a/www/lib/angular-awesome-slider/src/css/sass/vertical/_pointers-value.sass b/www/lib/angular-awesome-slider/src/css/sass/vertical/_pointers-value.sass new file mode 100644 index 00000000..22a22259 --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/sass/vertical/_pointers-value.sass @@ -0,0 +1,9 @@ +.vertical + div.jslider-value + top: 0 + left: 0 + + div.jslider-value-to + top: 80% + left: 0 + diff --git a/www/lib/angular-awesome-slider/src/css/sass/vertical/_pointers.sass b/www/lib/angular-awesome-slider/src/css/sass/vertical/_pointers.sass new file mode 100644 index 00000000..11eb9984 --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/sass/vertical/_pointers.sass @@ -0,0 +1,13 @@ +.vertical + div.jslider-pointer + left: 62% + background-position: -7px -1px + + &.jslider-pointer-hover + background-position: -7px -21px + + &.jslider-pointer-to + left: 62% + + &.jslider-pointer-to.jslider-pointer-hover + background-position: -7px -21px diff --git a/www/lib/angular-awesome-slider/src/css/sass/vertical/_ranges.sass b/www/lib/angular-awesome-slider/src/css/sass/vertical/_ranges.sass new file mode 100644 index 00000000..f6913499 --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/sass/vertical/_ranges.sass @@ -0,0 +1,46 @@ +.vertical + div.jslider-bg i, + .jslider-pointer + background: url("../img/jslider.vertical.png") no-repeat 0 0 + + div.jslider-bg + position: relative + height: 100% + + i + +position(absolute, 0 null null null) + width: 5px + font-size: 0 + + &.before + left: 50% + background: none + + &.left + top: 0 + left: 50% + height: 50% + background-position: right 0 + background-repeat: repeat-y + + &.right + top: 50% + left: 50% + height: 50% + background-position: right 0 + background-repeat: repeat-y + + &.range + position: absolute + top: 0 + left: 50% + +size(60% 100%) + z-index: 1 + background-repeat: repeat-y + background-position: -36px 0px + + &.default + left: 50% + +size(5px 1px) + z-index: 1 + background-color: $color-pointers-default-value diff --git a/www/lib/angular-awesome-slider/src/css/sass/vertical/_scales.sass b/www/lib/angular-awesome-slider/src/css/sass/vertical/_scales.sass new file mode 100644 index 00000000..f0bf764e --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/sass/vertical/_scales.sass @@ -0,0 +1,16 @@ +.vertical + div.jslider-scale + position: inherit + + span + position: absolute + +size(5px 1px) + border-left: none + font-size: 0 + border-top: 1px solid #999 + + ins + +position(absolute, 5px null 0 null) + font-size: 9px + text-decoration: none + color: $color-scale diff --git a/www/lib/angular-awesome-slider/src/css/sass/vertical/_vertical.sass b/www/lib/angular-awesome-slider/src/css/sass/vertical/_vertical.sass new file mode 100644 index 00000000..b2e510cf --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/sass/vertical/_vertical.sass @@ -0,0 +1,13 @@ +.vertical + +position(relative, 0.6em null null null) + display: block + +size(17px 100%) + font-family: Arial, sans-serif + + table + height: 100% + + &.sliderCSS .jslider-bg i, + &.jslider-pointer + background-color: silver + background-image: none diff --git a/www/lib/angular-awesome-slider/src/css/scss/core/_variables.scss b/www/lib/angular-awesome-slider/src/css/scss/core/_variables.scss new file mode 100644 index 00000000..bb28b9dd --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/scss/core/_variables.scss @@ -0,0 +1,28 @@ +// Colors + +$black: #000000; +$white: #ffffff; +$gray: #999999; +$gray2: #c2c7Ca; +$blue: #185f83; + +// Typography + +$font-family-sans-serif: "Helvetica Neue", Helvetica, Arial, sans-serif; +$font-family-base: $font-family-sans-serif; +$font-size-pointers-label: 9px; +$line-height-pointers-label: 12px; +$font-size-pointers-value: $font-size-pointers-label; +$line-height-pointers-value: $line-height-pointers-label; +$color-pointers-label: $black; +$color-pointers-value: $color-pointers-label; +$color-scale: $gray; +$color-pointers-default-value: $blue; + +// Skin CSS + +$color-skin-pointers-default-value: $gray2; +$color-skin-background: silver; +$color-skin-css-pointers-default-value: $white; +$color-skin-css-pointers-before-value: rgba(92, 98, 203, 0.89); +$color-skin-css-pointers-after-value: rgb(14, 23, 115); diff --git a/www/lib/angular-awesome-slider/src/css/scss/horizontal/_horizontal.scss b/www/lib/angular-awesome-slider/src/css/scss/horizontal/_horizontal.scss new file mode 100644 index 00000000..31a36ac7 --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/scss/horizontal/_horizontal.scss @@ -0,0 +1,24 @@ +// Horizontal Styles + +.jslider { + @include position(relative, 0.6em null null null); + cursor: pointer; + display: block; + @include size(100% 1em); + font-family: $font-family-base; + &.disabled { + opacity: 0.5; + } + table { + border-collapse: collapse; + border: 0; + width: 100%; + td, th { + width: 100%; + border: 0; + padding: 0; + text-align: left; + vertical-align: top; + } + } +} diff --git a/www/lib/angular-awesome-slider/src/css/scss/horizontal/_labels.scss b/www/lib/angular-awesome-slider/src/css/scss/horizontal/_labels.scss new file mode 100644 index 00000000..4dfae6ae --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/scss/horizontal/_labels.scss @@ -0,0 +1,19 @@ +div.jslider-label small, +div.jslider-value small { + @include position(relative, -0.4em null null null); +} + +// limits +div.jslider-label { + @include position(absolute, -18px null 0 null); + padding: 0px 2px; + opacity: 0.4; + color: $color-pointers-label; + font-size: $font-size-pointers-label; + line-height: $line-height-pointers-label; + white-space: nowrap; + &.jslider-label-to { + left: auto; + right: 0; + } +} diff --git a/www/lib/angular-awesome-slider/src/css/scss/horizontal/_main.scss b/www/lib/angular-awesome-slider/src/css/scss/horizontal/_main.scss new file mode 100644 index 00000000..d18ae442 --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/scss/horizontal/_main.scss @@ -0,0 +1,8 @@ +// Horizontal Styles + +@import "horizontal"; +@import "ranges"; +@import "pointers"; +@import "labels"; +@import "pointers-value"; +@import "scale"; diff --git a/www/lib/angular-awesome-slider/src/css/scss/horizontal/_pointers-value.scss b/www/lib/angular-awesome-slider/src/css/scss/horizontal/_pointers-value.scss new file mode 100644 index 00000000..b829c6d1 --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/scss/horizontal/_pointers-value.scss @@ -0,0 +1,12 @@ +div.jslider-value { + @include position(absolute, -19px null 0 null); + padding: 1px 2px 0; + // background: white + font-size: $font-size-pointers-value; + line-height: $line-height-pointers-value; + white-space: nowrap; + border-radius: 2px; + &.jslider-value-to { + left: 80%; + } +} diff --git a/www/lib/angular-awesome-slider/src/css/scss/horizontal/_pointers.scss b/www/lib/angular-awesome-slider/src/css/scss/horizontal/_pointers.scss new file mode 100644 index 00000000..0799afa8 --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/scss/horizontal/_pointers.scss @@ -0,0 +1,24 @@ +// single value hide to +.jslider-single { + div.jslider-pointer-to, + div.jslider-value-to, + div.jslider-bg .v, + .jslider-limitless .jslider-label { + display: none; + } +} + +div.jslider-pointer { + @include position(absolute, -4px null 20% null); + @include size(15px); + background-position: 2px -60px; + margin-left: -8px; + cursor: hand; + z-index: 2; + &.jslider-pointer-to { + left: 80%; + } + &.jslider-pointer-hover { + background-position: (-19px) -60px; + } +} diff --git a/www/lib/angular-awesome-slider/src/css/scss/horizontal/_ranges.scss b/www/lib/angular-awesome-slider/src/css/scss/horizontal/_ranges.scss new file mode 100644 index 00000000..26fb01f8 --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/scss/horizontal/_ranges.scss @@ -0,0 +1,34 @@ +div.jslider-bg i, div.jslider-pointer { + background: url("../img/jslider.png") no-repeat 0 0; +} + +div.jslider-bg { + position: relative; + i { + @include position(absolute, 0 null null null); + height: 5px; + &.left { + left: 0; + width: 50%; + background-position: 0 0; + } + &.right { + left: 50%; + width: 50%; + background-position: right 0; + } + &.range { + @include position(absolute, 0 null null 20%); + @include size(60% 5px); + background-repeat: repeat-x; + background-position: 0 -40px; + z-index: 1; + } + &.default { + left: 0; + width: 1px; + z-index: 1; + background-color: $color-pointers-default-value; + } + } +} diff --git a/www/lib/angular-awesome-slider/src/css/scss/horizontal/_scale.scss b/www/lib/angular-awesome-slider/src/css/scss/horizontal/_scale.scss new file mode 100644 index 00000000..ca4be2cf --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/scss/horizontal/_scale.scss @@ -0,0 +1,16 @@ +div.jslider-scale { + position: relative; + top: 9px; + span { + position: absolute; + height: 5px; + border-left: 1px solid $gray; + font-size: 0; + } + ins { + @include position(absolute, 5px null 0 null); + font-size: 9px; + text-decoration: none; + color: $gray; + } +} diff --git a/www/lib/angular-awesome-slider/src/css/scss/main.scss b/www/lib/angular-awesome-slider/src/css/scss/main.scss new file mode 100644 index 00000000..d00379b2 --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/scss/main.scss @@ -0,0 +1,17 @@ +// Import Bourbon Mixins +@import "../../../bower_components/bourbon/app/assets/stylesheets/bourbon"; + +// Main slider css rules +@import "core/variables"; + +// Horizontal Slider +@import "horizontal/main"; + +// Vertical Slider +@import "vertical/main"; + +// Skins +@import "skins/skin-css"; +@import "skins/skin-round"; +@import "skins/skin-blue"; +@import "skins/skin-plastic"; diff --git a/www/lib/angular-awesome-slider/src/css/scss/skins/_skin-blue.scss b/www/lib/angular-awesome-slider/src/css/scss/skins/_skin-blue.scss new file mode 100644 index 00000000..57011bea --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/scss/skins/_skin-blue.scss @@ -0,0 +1,60 @@ +// Blue Skin + +.jslider_blue { + .jslider-bg i, + .jslider-pointer { + background: url("../img/jslider.blue.png") no-repeat 0 0; + } + .jslider-bg { + i { + background-position: 2px -20px; + &.default { + background-color: $color-skin-pointers-default-value; + } + &.range { + z-index: 1; + background-position: 0 -40px; + } + } + } + div.jslider-pointer { + top: -6px; + width: 20px; + height: 17px; + background-position: 2px -60px; + z-index: 2; + } + &.vertical { + div.jslider-bg i, + div.jslider-pointer { + background: url("../img/jslider.blue.vertical.png") no-repeat 0 0; + } + div.jslider-bg { + i { + background-position: right 0; + &.range { + background-position: (-37px) 0; + } + &.before, + &.after { + background: none; + } + &.default { + background-color: $color-skin-pointers-default-value; + } + } + } + div.jslider-pointer { + top: -6px; + width: 20px; + height: 17px; + background-position: (-7px) 0; + &.jslider-pointer-hover { + background-position: (-7px) -20px; + } + } + div.jslider-value { + left: 0; + } + } +} diff --git a/www/lib/angular-awesome-slider/src/css/scss/skins/_skin-css.scss b/www/lib/angular-awesome-slider/src/css/scss/skins/_skin-css.scss new file mode 100644 index 00000000..dc0c68d4 --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/scss/skins/_skin-css.scss @@ -0,0 +1,116 @@ +$skin-gray: #777575; +$skin-gray-2: #615959; + +// Main slider custom overrided js css rules + +.sliderCSS { + div.jslider-bg { + i { + &.left { + left: 0; + width: 50%; + background-color: $color-skin-background; + background-image: none; + } + &.right { + width: 50%; + left: 50%; + background-color: $color-skin-background; + background-image: none; + } + &.before { + left: 0; + width: 1px; + background-color: $color-skin-css-pointers-before-value; + background-image: none; + } + &.default { + left: 0; + width: 1px; + z-index: 1; + background-color: $color-skin-css-pointers-default-value; + background-image: none; + } + &.after { + left: 0; + background-color: $color-skin-css-pointers-after-value; + background-image: none; + } + &.range { + @include position(absolute, 0 null 20% null); + @include size(60% 5px); + background-image: none; + background-color: $skin-gray; + z-index: 1; + } + } + } + div.jslider-pointer { + top: -3px; + left: 15px; + @include size(10px); + background-color: silver; + background-color: $skin-gray-2; + border-radius: 50%; + } + div.jslider-bg i, div.jslider-pointer { + background: none; + } + // vertical + &.vertical { + td { + height: 100%; + } + div.jslider-bg { + i { + left: 50%; + width: 5px; + &.left { + top: 0; + height: 50%; + background-color: $color-skin-background; + background-image: none; + } + &.right { + height: 50%; + top: 50%; + background-color: $color-skin-background; + background-image: none; + } + &.range { + height: 100%; + z-index: 1; + background-color: $skin-gray; + background-image: none; + } + &.before { + background-color: $color-skin-css-pointers-before-value; + background-image: none; + } + &.default { + height: 1px; + background-color: $color-skin-css-pointers-default-value; + background-image: none; + z-index: 2; + } + &.after { + background-color: $color-skin-css-pointers-after-value; + background-image: none; + } + } + } + div.jslider-bg i, div.jslider-pointer { + background: none; + } + div.jslider-pointer { + left: 50%; + @include size(10px); + background-color: $skin-gray-2; + border-radius: 50%; + margin-left: -3px; + &.jslider-pointer-to { + left: 50%; + } + } + } +} diff --git a/www/lib/angular-awesome-slider/src/css/scss/skins/_skin-plastic.scss b/www/lib/angular-awesome-slider/src/css/scss/skins/_skin-plastic.scss new file mode 100644 index 00000000..04a18bf2 --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/scss/skins/_skin-plastic.scss @@ -0,0 +1,56 @@ +// Plastic Skin + +.jslider_plastic { + .jslider-bg i, + .jslider-pointer { + background: url("../img/jslider.plastic.png") no-repeat 0 0; + } + .jslider-bg { + i { + background-position: 2px -20px; + &.default { + background-color: $color-skin-pointers-default-value; + } + &.range { + z-index: 1; + background-position: 0 -40px; + } + } + } + .jslider-pointer { + z-index: 2; + @include size(20px 17px); + top: -6px; + background-position: 2px -60px; + } + &.vertical { + div.jslider-bg i, + div.jslider-pointer { + background: url("../img/jslider.plastic.vertical.png") no-repeat 0 0; + } + div.jslider-bg { + i { + background-position: right 0; + &.range { + background-position: (-35px) 0; + } + &.before, + &.after { + background: none; + } + &.default { + background-color: $color-skin-pointers-default-value; + } + } + } + div.jslider-pointer { + top: -6px; + margin-left: -6px; + @include size(20px 17px); + background-position: (-7px) -1px; + &.jslider-pointer-hover { + background-position: (-7px) -21px; + } + } + } +} diff --git a/www/lib/angular-awesome-slider/src/css/scss/skins/_skin-round.scss b/www/lib/angular-awesome-slider/src/css/scss/skins/_skin-round.scss new file mode 100644 index 00000000..10ce3395 --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/scss/skins/_skin-round.scss @@ -0,0 +1,61 @@ +// Round Skin + +.jslider_round { + div.jslider-bg i, + div.jslider-pointer { + background: url("../img/jslider.round.png") no-repeat 0 0; + } + div.jslider-bg { + i { + background-position: 0 -20px; + &.default { + background-color: $gray2; + } + &.range { + z-index: 1; + background-position: 0 -40px; + } + } + } + div.jslider-pointer { + top: -6px; + @include size(20px 17px); + background-position: 0 -60px; + z-index: 2; + } + &.vertical { + div.jslider-bg i, + div.jslider-pointer { + background: url("../img/jslider.round.vertical.png") no-repeat 0 0; + } + div.jslider-bg { + i { + background-position: right 0; + &.range { + background-position: (-37px) 0; + } + &.before, + &.after { + background: none; + } + &.default { + background-color: $color-skin-pointers-default-value; + } + } + } + div.jslider-pointer { + top: -6px; + @include size(20px 17px); + background-position: (-4px) -3px; + &.jslider-pointer-hover { + background-position: (-4px) -23px; + } + &.jslider-value-to { + left: 80%; + } + } + div.jslider-value { + left: 0; + } + } +} diff --git a/www/lib/angular-awesome-slider/src/css/scss/vertical/_labels.scss b/www/lib/angular-awesome-slider/src/css/scss/vertical/_labels.scss new file mode 100644 index 00000000..9feca95a --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/scss/vertical/_labels.scss @@ -0,0 +1,12 @@ +.vertical { + div.jslider-label { + top: -5px; + margin-left: 22px; + &.jslider-label-to { + top: 100%; + left: inherit; + right: inherit; + margin-top: -5px; + } + } +} diff --git a/www/lib/angular-awesome-slider/src/css/scss/vertical/_main.scss b/www/lib/angular-awesome-slider/src/css/scss/vertical/_main.scss new file mode 100644 index 00000000..0267be94 --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/scss/vertical/_main.scss @@ -0,0 +1,8 @@ +// Vertical Styles + +@import "vertical"; +@import "ranges"; +@import "pointers"; +@import "labels"; +@import "pointers-value"; +@import "scales"; diff --git a/www/lib/angular-awesome-slider/src/css/scss/vertical/_pointers-value.scss b/www/lib/angular-awesome-slider/src/css/scss/vertical/_pointers-value.scss new file mode 100644 index 00000000..3cea3a72 --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/scss/vertical/_pointers-value.scss @@ -0,0 +1,10 @@ +.vertical { + div.jslider-value { + top: 0; + left: 0; + } + div.jslider-value-to { + top: 80%; + left: 0; + } +} diff --git a/www/lib/angular-awesome-slider/src/css/scss/vertical/_pointers.scss b/www/lib/angular-awesome-slider/src/css/scss/vertical/_pointers.scss new file mode 100644 index 00000000..d5d7ed9c --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/scss/vertical/_pointers.scss @@ -0,0 +1,15 @@ +.vertical { + div.jslider-pointer { + left: 62%; + background-position: (-7px) -1px; + &.jslider-pointer-hover { + background-position: (-7px) -21px; + } + &.jslider-pointer-to { + left: 62%; + } + &.jslider-pointer-to.jslider-pointer-hover { + background-position: (-7px) -21px; + } + } +} diff --git a/www/lib/angular-awesome-slider/src/css/scss/vertical/_ranges.scss b/www/lib/angular-awesome-slider/src/css/scss/vertical/_ranges.scss new file mode 100644 index 00000000..7578ae77 --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/scss/vertical/_ranges.scss @@ -0,0 +1,48 @@ +.vertical { + div.jslider-bg i, + .jslider-pointer { + background: url("../img/jslider.vertical.png") no-repeat 0 0; + } + div.jslider-bg { + position: relative; + height: 100%; + i { + @include position(absolute, 0 null null null); + width: 5px; + font-size: 0; + &.before { + left: 50%; + background: none; + } + &.left { + top: 0; + left: 50%; + height: 50%; + background-position: right 0; + background-repeat: repeat-y; + } + &.right { + top: 50%; + left: 50%; + height: 50%; + background-position: right 0; + background-repeat: repeat-y; + } + &.range { + position: absolute; + top: 0; + left: 50%; + @include size(60% 100%); + z-index: 1; + background-repeat: repeat-y; + background-position: (-36px) 0px; + } + &.default { + left: 50%; + @include size(5px 1px); + z-index: 1; + background-color: $color-pointers-default-value; + } + } + } +} diff --git a/www/lib/angular-awesome-slider/src/css/scss/vertical/_scales.scss b/www/lib/angular-awesome-slider/src/css/scss/vertical/_scales.scss new file mode 100644 index 00000000..c89e60bb --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/scss/vertical/_scales.scss @@ -0,0 +1,18 @@ +.vertical { + div.jslider-scale { + position: inherit; + span { + position: absolute; + @include size(5px 1px); + border-left: none; + font-size: 0; + border-top: 1px solid #999; + } + ins { + @include position(absolute, 5px null 0 null); + font-size: 9px; + text-decoration: none; + color: $color-scale; + } + } +} diff --git a/www/lib/angular-awesome-slider/src/css/scss/vertical/_vertical.scss b/www/lib/angular-awesome-slider/src/css/scss/vertical/_vertical.scss new file mode 100644 index 00000000..64b67040 --- /dev/null +++ b/www/lib/angular-awesome-slider/src/css/scss/vertical/_vertical.scss @@ -0,0 +1,14 @@ +.vertical { + @include position(relative, 0.6em null null null); + display: block; + @include size(17px 100%); + font-family: Arial, sans-serif; + table { + height: 100%; + } + &.sliderCSS .jslider-bg i, + &.jslider-pointer { + background-color: silver; + background-image: none; + } +} -- cgit v1.2.3