3 @popup-height: 54 * @unit_base;
4 @popup-width: 45 * @unit_base;
5 @img-height: 37 * @unit_base;
6 @img-width: 37 * @unit_base;
7 @handle-height: 36 * @unit_base;
8 @handle-width: 36 * @unit_base;
14 select.ui-slider-switch {
21 vertical-align: middle;
23 height: 18 * @unit_base;
24 margin-left: 16 * @unit_base;
25 margin-right: 16 * @unit_base;
27 background-image: -webkit-gradient(
31 color-stop(0, @color_progress_bar1),
32 color-stop(1, @color_progress_bar0)
34 .LESSbox-shadow(1px, 1px, 0px, white);
35 .LESSborder-radius-all( 10 * @unit_base );
39 margin-left: 58 * @unit_base;
40 margin-right: 58 * @unit_base;
43 .ui-slider-left-volume,
44 .ui-slider-left-bright {
46 vertical-align: middle;
49 left: -50 * @unit_base;
53 background: url(images/controls/00_slider_button_brightness_01.png) no-repeat;
54 .LESSbackground-size(@img-width, @img-height);
57 .ui-slider-left-volume {
58 background: url(images/controls/00_slider_button_volume_01.png) no-repeat;
59 .LESSbackground-size(@img-width, @img-height);
62 .ui-slider-right-volume,
63 .ui-slider-right-bright {
67 right: -50 * @unit_base;
71 vertical-align: middle;
73 background: url(images/controls/00_slider_button_brightness_02.png) no-repeat;
74 .LESSbackground-size(@img-width, @img-height);
77 .ui-slider-right-volume {
78 background: url(images/controls/00_slider_button_volume_02.png) no-repeat;
79 .LESSbackground-size(@img-width, @img-height);
82 .ui-slider-left-text {
86 left: -52 * @unit_base;
87 height: 37 * @unit_base;
88 width: 37 * @unit_base;
91 color: rgb(100, 100, 100);
94 .ui-slider-right-text {
98 right: -52 * @unit_base;
99 height: 37 * @unit_base;
100 width: 37 * @unit_base;
103 color: rgb(100, 100, 100);
106 div.ui-slider:not(.ui-toggle-switch) {
110 height: 7 * @unit_base;
111 margin-left: 5 * @unit_base;
112 margin-right: 5 * @unit_base;
114 .LESSborder-radius-all( 10 * @unit_base );
117 border-color: @color_progress_boarder;
118 .LESSbox-shadow(1px, -1px, 1px, @color_progress_boarder);
119 background-color: @color_progress_bar0;
126 padding: 0.3rem 0 0 0;
129 color: @color_slider_handle_text;
137 width: 36 * @unit_base;
138 height: 36 * @unit_base;
139 margin-left: -19 * @unit_base;
141 color: @color_slider_handle_text;
144 background: url(images/controls/00_slider_handle.png) no-repeat;
145 .LESSbackground-size(@handle-width, @handle-height);
149 position: absolute !important;
153 height: @popup-height;
154 top: -60 * @unit_base;
157 color: @color_slider_popup_text;
161 background: url(images/controls/00_slider_popup_bg.png) no-repeat;
162 .LESSbackground-size(@popup-width, @popup-height);
168 top: -36 * @unit_base;
169 height: 7 * @unit_base;
172 background-image: -webkit-gradient(
176 color-stop(0, @color_progress_value0),
177 color-stop(1, @color_progress_value1)
179 .LESSborder-radius-all( 10 * @unit_base );
180 .LESSbox-shadow(-1px, -1px, 1px, rgb(179, 200, 226));
183 .ui-slider-handle-press {
187 width: 37 * @unit_base;
188 height: 37 * @unit_base;
191 background: url(images/controls/00_slider_handle_press.png) no-repeat;
192 .LESSbackground-size(@handle-width, @handle-height);