display: none;
}
-.ui-slider-bg,
-.ui-slider-icon-bg {
+.ui-slider-container {
position: relative;
vertical-align: middle;
+ height: 18 * @unit_base;
margin-left: 16 * @unit_base;
margin-right: 16 * @unit_base;
+ margin-top: 18 * @unit_base;
+ margin-bottom: 18 * @unit_base;
+
+ background-image: -webkit-gradient(
+ linear,
+ left bottom,
+ left top,
+ color-stop(0, @color_progress_bar1),
+ color-stop(1, @color_progress_bar0)
+ );
+ .LESSbox-shadow(1px, 1px, 0px, white);
+ .LESSborder-radius-all( 10 * @unit_base );
}
-.ui-slider-icon-bg {
- margin-left: 58 * @unit_base;
- margin-right: 58 * @unit_base;
+.ui-li > .ui-slider-container {
+ margin-top: 0;
+ margin-bottom: 0;
}
.ui-slider-left-volume,
position: absolute;
vertical-align: middle;
- top: -0.35rem;
+ top: -0.5rem;
left: -50 * @unit_base;
height: @img-height;
width: @img-width;
- background: url(images/00_slider_button_brightness_01.png) no-repeat;
+ background: url(images/controls/00_slider_button_brightness_01.png) no-repeat;
.LESSbackground-size(@img-width, @img-height);
}
.ui-slider-left-volume {
- background: url(images/00_slider_button_volume_01.png) no-repeat;
+ background: url(images/controls/00_slider_button_volume_01.png) no-repeat;
.LESSbackground-size(@img-width, @img-height);
}
.ui-slider-right-bright {
position: absolute;
- top: -0.35rem;
+ top: -0.5rem;
right: -50 * @unit_base;
height: @img-height;
width: @img-width;
vertical-align: middle;
- background: url(images/00_slider_button_brightness_02.png) no-repeat;
+ background: url(images/controls/00_slider_button_brightness_02.png) no-repeat;
.LESSbackground-size(@img-width, @img-height);
}
.ui-slider-right-volume {
- background: url(images/00_slider_button_volume_02.png) no-repeat;
+ background: url(images/controls/00_slider_button_volume_02.png) no-repeat;
.LESSbackground-size(@img-width, @img-height);
}
.ui-slider-left-text {
position: absolute;
- top: -0.35rem;
- left: -52 * @unit_base;
+ top: -0.5rem;
height: 37 * @unit_base;
- width: 37 * @unit_base;
text-align: center;
color: rgb(100, 100, 100);
.ui-slider-right-text {
position: absolute;
- top: -0.35rem;
- right: -52 * @unit_base;
+ top: -0.5rem;
height: 37 * @unit_base;
- width: 37 * @unit_base;
text-align: center;
color: rgb(100, 100, 100);
}
-div.ui-slider {
- display: inline-block;
- overflow: visible;
+div.ui-slider:not(.ui-toggle-switch) {
+ position: relative;
- height: 18 * @unit_base;
- width: 100%;
+ top: 5 * @unit_base;
+ height: 7 * @unit_base;
+ margin-left: 5 * @unit_base;
+ margin-right: 5 * @unit_base;
- //FIXME
- //background-image: url(images/00_progress_bg.9.png);
- background-color: rgb(236,233,229);
+ .LESSborder-radius-all( 10 * @unit_base );
+ border: 1px;
+ border-style: solid;
+ border-color: @color_progress_border;
+ .LESSbox-shadow(1px, -1px, 1px, @color_progress_border);
+ background-color: @color_progress_bar0;
.ui-btn {
- top: -0.45rem;
+ top: -0.75rem;
margin-top: 0;
}
.ui-btn-inner {
color: @color_slider_handle_text;
font-size: 0.95rem;
- background: url(images/00_slider_handle.png) no-repeat;
+ background: url(images/controls/00_slider_handle.png) no-repeat;
.LESSbackground-size(@handle-width, @handle-height);
}
width: @popup-width;
height: @popup-height;
- top: -56 * @unit_base;
+ top: -60 * @unit_base;
padding-top: 0.1rem;
color: @color_slider_popup_text;
text-align: center;
font-size: 1.5rem;
- background: url(images/00_slider_popup_bg.png) no-repeat;
+ background: url(images/controls/00_slider_popup_bg.png) no-repeat;
.LESSbackground-size(@popup-width, @popup-height);
}
-.ui-slider-bar {
- position: relative;
+.ui-slider-bg {
+ position: absolute;
- top: -36 * @unit_base;
- height: 18 * @unit_base;
+ height: 7 * @unit_base;
width: 0;
- //FIXME
- //background-image: url(images/00_progress_bar.9.png);
background-image: -webkit-gradient(
linear,
left bottom,
left top,
- color-stop(0.2, rgb(236,233,229)),
- color-stop(0.2, rgb(54,119,155)),
- color-stop(0.8, rgb(54,119,195)),
- color-stop(0.8, rgb(236,233,229))
+ color-stop(0, @color_progress_value0),
+ color-stop(1, @color_progress_value1)
);
+ .LESSborder-radius-all( 10 * @unit_base );
+ .LESSbox-shadow(-1px, -1px, 1px, rgb(179, 200, 226));
}
.ui-slider-handle-press {
height: 37 * @unit_base;
//FIXME
- background: url(images/00_slider_handle_press.png) no-repeat;
+ background: url(images/controls/00_slider_handle_press.png) no-repeat;
.LESSbackground-size(@handle-width, @handle-height);
}