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

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

Issue 2535493002: Reduce webkit CSS prefixes in ui/ styles (Closed)
Patch Set: js Created 4 years 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;
(...skipping 176 matching lines...) Expand 10 before | Expand all | Expand 10 after
187 187
188 .media-button.subtitles:not([showing]) { 188 .media-button.subtitles:not([showing]) {
189 opacity: 0.2; 189 opacity: 0.2;
190 } 190 }
191 191
192 .media-button.subtitles[unavailable] { 192 .media-button.subtitles[unavailable] {
193 display: none; 193 display: none;
194 } 194 }
195 195
196 .playback-state-icon { 196 .playback-state-icon {
197 -webkit-animation: none; 197 animation: none;
198 background-position: center center; 198 background-position: center center;
199 background-repeat: no-repeat; 199 background-repeat: no-repeat;
200 display: none; 200 display: none;
201 height: 32px; 201 height: 32px;
202 left: 50%; 202 left: 50%;
203 margin-left: -16px; 203 margin-left: -16px;
204 margin-top: -16px; 204 margin-top: -16px;
205 opacity: 0; 205 opacity: 0;
206 pointer-events: none; 206 pointer-events: none;
207 position: absolute; 207 position: absolute;
(...skipping 15 matching lines...) Expand all
223 pointer-events: none; 223 pointer-events: none;
224 position: absolute; 224 position: absolute;
225 text-align: center; 225 text-align: center;
226 text-shadow: 0 0 10px black; 226 text-shadow: 0 0 10px black;
227 top: 20%; 227 top: 20%;
228 width: 500px; 228 width: 500px;
229 z-index: 2; 229 z-index: 2;
230 } 230 }
231 231
232 .text-banner[visible] { 232 .text-banner[visible] {
233 -webkit-animation: text-banner-blowup 3000ms; 233 animation: text-banner-blowup 3000ms;
234 display: block; 234 display: block;
235 } 235 }
236 236
237 .playback-state-icon[state] { 237 .playback-state-icon[state] {
238 display: block; 238 display: block;
239 } 239 }
240 240
241 @-webkit-keyframes blowup { 241 @keyframes blowup {
242 from { 242 from {
243 opacity: 1; 243 opacity: 1;
244 } 244 }
245 to { 245 to {
246 transform: scale(3); 246 transform: scale(3);
247 opacity: 0; 247 opacity: 0;
248 } 248 }
249 } 249 }
250 250
251 @-webkit-keyframes text-banner-blowup { 251 @keyframes text-banner-blowup {
252 from { 252 from {
253 transform: scale(0.5); 253 transform: scale(0.5);
254 opacity: 0; 254 opacity: 0;
255 } 255 }
256 20% { 256 20% {
257 transform: scale(1); 257 transform: scale(1);
258 opacity: 0.75; 258 opacity: 0.75;
259 } 259 }
260 80% { 260 80% {
261 transform: scale(1); 261 transform: scale(1);
262 opacity: 0.75; 262 opacity: 0.75;
263 } 263 }
264 to { 264 to {
265 transform: scale(3); 265 transform: scale(3);
266 opacity: 0; 266 opacity: 0;
267 } 267 }
268 } 268 }
269 269
270 .playback-state-icon[state='play'] { 270 .playback-state-icon[state='play'] {
271 -webkit-animation: blowup 500ms; 271 animation: blowup 500ms;
272 background-image: -webkit-image-set( 272 background-image: -webkit-image-set(
273 url(../images/media/media_play_onscreen.png) 1x, 273 url(../images/media/media_play_onscreen.png) 1x,
274 url(../images/media/2x/media_play_onscreen.png) 2x); 274 url(../images/media/2x/media_play_onscreen.png) 2x);
275 } 275 }
276 276
277 .playback-state-icon[state='pause'] { 277 .playback-state-icon[state='pause'] {
278 -webkit-animation: blowup 500ms; 278 animation: blowup 500ms;
279 background-image: -webkit-image-set( 279 background-image: -webkit-image-set(
280 url(../images/media/media_pause_onscreen.png) 1x, 280 url(../images/media/media_pause_onscreen.png) 1x,
281 url(../images/media/2x/media_pause_onscreen.png) 2x); 281 url(../images/media/2x/media_pause_onscreen.png) 2x);
282 } 282 }
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698