Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(5)

Side by Side Diff: ui/file_manager/video_player/css/media_controls.css

Issue 1441603002: Revert of Fix accessibility issues in AudioPlayer and VideoPlayer. (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Created 5 years, 1 month ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
1 /* Copyright (c) 2012 The Chromium Authors. All rights reserved. 1 /* Copyright (c) 2012 The Chromium Authors. All rights reserved.
2 * Use of this source code is governed by a BSD-style license that can be 2 * Use of this source code is governed by a BSD-style license that can be
3 * found in the LICENSE file. */ 3 * found in the LICENSE file. */
4 4
5 /* Common styles for media buttons. */ 5 /* Common styles for media buttons. */
6 6
7 .media-button { 7 .media-button {
8 background-position: center; 8 background-position: center;
9 background-repeat: no-repeat; 9 background-repeat: no-repeat;
10 flex: none; 10 flex: none;
11 height: 32px; 11 height: 32px;
12 position: relative; 12 position: relative;
13 width: 32px; 13 width: 32px;
14 } 14 }
15 15
16 .media-button:hover {
17 background-color: rgba(153, 153, 153, 0.2);
18 }
19
20 .media-button:active {
21 background-color: rgba(153, 153, 153, 0.4);
22 }
23
16 .media-button.disabled { 24 .media-button.disabled {
17 background-color: transparent; 25 background-color: transparent;
18 opacity: 0.26; 26 opacity: 0.26;
19 } 27 }
20 28
21 .media-button.disabled, 29 .media-button.disabled,
22 paper-slider[disabled], 30 paper-slider[disabled],
23 paper-slider.readonly { 31 paper-slider.readonly {
24 pointer-events: none; 32 pointer-events: none;
25 } 33 }
(...skipping 101 matching lines...) Expand 10 before | Expand all | Expand 10 after
127 pointer-events: auto; 135 pointer-events: auto;
128 } 136 }
129 137
130 /* Cast button. */ 138 /* Cast button. */
131 139
132 .media-button.cast { 140 .media-button.cast {
133 background-image: -webkit-image-set( 141 background-image: -webkit-image-set(
134 url(../images/media/media_chromecast.png) 1x, 142 url(../images/media/media_chromecast.png) 1x,
135 url(../images/media/2x/media_chromecast.png) 2x); 143 url(../images/media/2x/media_chromecast.png) 2x);
136 display: none; 144 display: none;
137 border-radius: 2px;
138 }
139
140 /* Reset browser's button style. */
141 .media-button.cast {
142 background-color: transparent;
143 border: none;
144 cursor: pointer;
145 outline: none;
146 } 145 }
147 146
148 #video-player[cast-available][castable] .media-button.cast { 147 #video-player[cast-available][castable] .media-button.cast {
149 display: block; 148 display: block;
150 } 149 }
151 150
152 #video-player[casting] .media-button.cast { 151 #video-player[casting] .media-button.cast {
153 background-image: -webkit-image-set( 152 background-image: -webkit-image-set(
154 url(../images/media/media_chromecast_casting.png) 1x, 153 url(../images/media/media_chromecast_casting.png) 1x,
155 url(../images/media/2x/media_chromecast_casting.png) 2x); 154 url(../images/media/2x/media_chromecast_casting.png) 2x);
156 } 155 }
157 156
158 .media-button.cast:focus:not(.using-mouse) {
159 box-shadow: 0 0 0 1px rgba(66, 133, 244, 0.5);
160 }
161
162 /* Fullscreen button. */ 157 /* Fullscreen button. */
163 /* There is no final decision whether we need a separate icon when toggled. */ 158 /* There is no final decision whether we need a separate icon when toggled. */
164 159
165 .media-button.fullscreen { 160 .media-button.fullscreen {
166 background-image: -webkit-image-set( 161 background-image: -webkit-image-set(
167 url(../images/media/media_fullscreen.png) 1x, 162 url(../images/media/media_fullscreen.png) 1x,
168 url(../images/media/2x/media_fullscreen.png) 2x); 163 url(../images/media/2x/media_fullscreen.png) 2x);
169 } 164 }
170 165
171 #controls[fullscreen] .media-button.fullscreen { 166 #video-player[fullscreen] .media-button.fullscreen {
172 background-image: -webkit-image-set( 167 background-image: -webkit-image-set(
173 url(../images/media/media_fullscreen_exit.png) 1x, 168 url(../images/media/media_fullscreen_exit.png) 1x,
174 url(../images/media/2x/media_fullscreen_exit.png) 2x); 169 url(../images/media/2x/media_fullscreen_exit.png) 2x);
175 } 170 }
176 171
177 .playback-state-icon { 172 .playback-state-icon {
178 -webkit-animation: none; 173 -webkit-animation: none;
179 background-position: center center; 174 background-position: center center;
180 background-repeat: no-repeat; 175 background-repeat: no-repeat;
181 display: none; 176 display: none;
(...skipping 72 matching lines...) Expand 10 before | Expand all | Expand 10 after
254 url(../images/media/media_play_onscreen.png) 1x, 249 url(../images/media/media_play_onscreen.png) 1x,
255 url(../images/media/2x/media_play_onscreen.png) 2x); 250 url(../images/media/2x/media_play_onscreen.png) 2x);
256 } 251 }
257 252
258 .playback-state-icon[state='pause'] { 253 .playback-state-icon[state='pause'] {
259 -webkit-animation: blowup 500ms; 254 -webkit-animation: blowup 500ms;
260 background-image: -webkit-image-set( 255 background-image: -webkit-image-set(
261 url(../images/media/media_pause_onscreen.png) 1x, 256 url(../images/media/media_pause_onscreen.png) 1x,
262 url(../images/media/2x/media_pause_onscreen.png) 2x); 257 url(../images/media/2x/media_pause_onscreen.png) 2x);
263 } 258 }
OLDNEW
« no previous file with comments | « ui/file_manager/integration_tests/file_manager/open_audio_files.js ('k') | ui/file_manager/video_player/js/media_controls.js » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698