1 @import "config.less";
\r
3 @unit_base_multimediaview : @unit_base * 0.5;
\r
6 background-color : @color_multimediaview_bg;
\r
10 .ui-multimediaview-wrap {
\r
17 .ui-multimediaview-fullscreen {
\r
18 position : absolute !important;
\r
19 z-index : @z_base_header_footer + 100 !important;
\r
22 .ui-multimediaview-control span {
\r
23 display : inline-block;
\r
26 .ui-multimediaview-control {
\r
27 position : absolute;
\r
29 z-index : @z_base_header_footer + 101 !important;
\r
34 height : 84 * @unit_base_multimediaview;
\r
37 .ui-multimediaview-control span.ui-button {
\r
38 background-position : center center;
\r
39 background-size : 80%;
\r
40 background-repeat : no-repeat;
\r
41 width : 74 * @unit_base_multimediaview;
\r
42 height : 74 * @unit_base_multimediaview;
\r
43 margin : 4 * @unit_base_multimediaview;
\r
46 .ui-multimediaview-control .ui-playpausebutton {
\r
50 .ui-multimediaview-control .ui-timestamplabel {
\r
51 text-align : center;
\r
55 .ui-multimediaview-control .ui-timestamplabel p {
\r
56 margin-top : -9.8 * @unit_base_multimediaview;
\r
57 margin-left : 4 * @unit_base_multimediaview;
\r
59 text-align : center;
\r
60 font-size : 22 * @unit_base_multimediaview;
\r
61 line-height : 28 * @unit_base_multimediaview;
\r
65 .ui-multimediaview-control .ui-durationlabel {
\r
66 text-align : center;
\r
70 .ui-multimediaview-control .ui-durationlabel p {
\r
71 margin-top : -9.8 * @unit_base_multimediaview;
\r
72 margin-right : 4 * @unit_base_multimediaview;
\r
74 text-align : center;
\r
75 font-size : 22 * @unit_base_multimediaview;
\r
76 line-height : 28 * @unit_base_multimediaview;
\r
80 .ui-multimediaview-control .ui-seekbar {
\r
81 margin-top : 11.5 * @unit_base_multimediaview;
\r
82 padding-left : 4 * @unit_base_multimediaview;
\r
83 padding-right : 4 * @unit_base_multimediaview;
\r
84 height : 16 * @unit_base_multimediaview;
\r
88 .ui-multimediaview-control .ui-seekbar .ui-duration {
\r
92 height : 16 * @unit_base_multimediaview;
\r
93 border-radius : 1.5em;
\r
96 .ui-multimediaview-control .ui-seekbar .ui-currenttime {
\r
99 height : 16 * @unit_base_multimediaview;
\r
100 position : absolute;
\r
101 border-radius : 1.5em;
\r
104 .ui-multimediaview-control .ui-volumecontrol {
\r
105 width : 220 * @unit_base_multimediaview;
\r
110 .ui-multimediaview-control .ui-volumecontrol .ui-volumebar {
\r
112 padding-top : 35 * @unit_base_multimediaview;
\r
113 padding-left : 40 * @unit_base_multimediaview;
\r
117 .ui-multimediaview-control .ui-volumecontrol .ui-volumebar .ui-guide {
\r
118 width : 160 * @unit_base_multimediaview;
\r
119 height : 16 * @unit_base_multimediaview;
\r
120 position : absolute;
\r
121 border-radius : 1.5em;
\r
124 .ui-multimediaview-control .ui-volumecontrol .ui-volumebar .ui-value {
\r
127 height : 16 * @unit_base_multimediaview;
\r
128 position : absolute;
\r
129 border-radius : 1.5em;
\r
132 .ui-multimediaview-control .ui-volumecontrol .ui-volumebar .ui-handler {
\r
135 width : 30 * @unit_base_multimediaview;
\r
136 height : 30 * @unit_base_multimediaview;
\r
137 position : absolute;
\r
138 border-style: solid;
\r
140 border-radius : 1.5em;
\r
144 -----------------------------------------------------------------------------------------------------------*/
\r
146 .ui-multimediaview-s {
\r
147 .ui-multimediaview-video {
\r
148 background-color : @color_multimediaview_control_bg;
\r
151 .ui-timestamplabel {
\r
152 color : @color_multimediaview_timestamp_text;
\r
155 .ui-durationlabel {
\r
156 color : @color_multimediaview_duration_text;
\r
160 background-color : @color_multimediaview_button_bg;
\r
163 span.ui-play-icon {
\r
164 background-image : url(./images/00_button_play.png);
\r
167 span.ui-pause-icon {
\r
168 background-image : url(./images/00_button_pause.png);
\r
171 span.ui-volume-icon {
\r
172 background-image : url(./images/controls/00_slider_button_volume_02.png);
\r
175 span.ui-mute-icon {
\r
176 background-image : url(./images/controls/00_slider_button_volume_01.png);
\r
179 span.ui-fullscreen-on {
\r
180 background-image : url(./images/00_button_fullscreen_on.png);
\r
183 span.ui-fullscreen-off {
\r
184 background-image : url(./images/00_button_fullscreen_off.png);
\r
189 background-color : @color_multimediaview_bar_gray;
\r
193 .LESSmultimediaview_bar_active_style();
\r
199 background-color : @color_multimediaview_bar_gray;
\r
203 .LESSmultimediaview_bar_active_style();
\r
207 .LESSmultimediaview_bar_handle_style();
\r
208 border-color : @color_multimediaview_button_border;
\r