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

Side by Side Diff: Source/core/css/fullscreen.css

Issue 974783002: Match the Fullscreen spec's CSS as far as currently practical (Closed) Base URL: svn://svn.chromium.org/blink/trunk
Patch Set: address feedback Created 5 years, 9 months 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 | Annotate | Revision Log
OLDNEW
1 /*
2 * User-agent level style sheet defaults for the Fullscreen API
3 * https://fullscreen.spec.whatwg.org/#user-agent-level-style-sheet-defaults
4 *
5 * FIXME: Use the :fullscreen pseudo-class instead of :-webkit-full-screen.
6 * (see crbug.com/402378)
7 */
8
9 :not(:root):-webkit-full-screen {
10 position: fixed !important;
11 top: 0 !important;
12 right: 0 !important;
13 bottom: 0 !important;
14 left: 0 !important;
15 margin: 0 !important;
16 box-sizing: border-box !important;
17 min-width: 0 !important;
18 max-width: none !important;
19 min-height: 0 !important;
20 max-height: none !important;
21 width: 100% !important;
22 height: 100% !important;
23 object-fit: contain !important;
24 }
25
26 iframe:-webkit-full-screen {
27 border: none;
philipj_slow 2015/03/04 07:20:50 This is a change from before, it used to be !impor
Julien - ping for review 2015/03/04 17:50:23 ACK!
28 }
29
30 /* Anything below are extensions over what the Fullscreen API mandates. */
31
32 /*
33 * The flex and transform rules will likely be added to the spec:
34 * https://www.w3.org/Bugs/Public/show_bug.cgi?id=27931
35 */
36 :not(:root):-webkit-full-screen {
37 flex: none !important;
38 transform: none !important;
39 }
40
41
42 /* FIXME: Remove these rules when moving Fullscreen to top layer.
43 (see crbug.com/240576) */
1 :-webkit-full-screen { 44 :-webkit-full-screen {
2 background-color: white; 45 background-color: white;
3 z-index: 2147483647 !important; 46 z-index: 2147483647 !important;
4 } 47 }
5 48
6 :root:-webkit-full-screen-ancestor { 49 video:-webkit-full-screen, audio:-webkit-full-screen {
7 overflow: hidden !important; 50 background-color: transparent !important;
8 } 51 }
9 52
10 :-webkit-full-screen-ancestor:not(iframe) { 53 :-webkit-full-screen-ancestor:not(iframe) {
11 z-index: auto !important; 54 z-index: auto !important;
12 position: static !important; 55 position: static !important;
13 opacity: 1 !important; 56 opacity: 1 !important;
14 transform: none !important; 57 transform: none !important;
15 -webkit-mask: none !important; 58 -webkit-mask: none !important;
16 clip: none !important; 59 clip: none !important;
17 -webkit-filter: none !important; 60 -webkit-filter: none !important;
18 transition: none !important; 61 transition: none !important;
19 -webkit-box-reflect: none !important; 62 -webkit-box-reflect: none !important;
20 -webkit-perspective: none !important; 63 -webkit-perspective: none !important;
21 -webkit-transform-style: flat !important; 64 -webkit-transform-style: flat !important;
22 } 65 }
23 66
24 video:-webkit-full-screen, audio:-webkit-full-screen { 67 /* This prevents video from overflowing the viewport in
25 background-color: transparent !important; 68 virtual/android/fullscreen/video-scrolled-iframe.html
26 position: relative !important; 69 FIXME: We should remove this (see crbug.com/441890). */
27 left: 0 !important; 70 :-webkit-full-screen-ancestor {
28 top: 0 ! important; 71 overflow: hidden !important;
29 margin: 0 !important;
30 min-width: 0 !important;
31 max-width: none !important;
32 min-height: 0 !important;
33 max-height: none !important;
34 width: 100% !important;
35 height: 100% !important;
36 flex: 1 !important;
37 display: block !important;
38 transform: none !important;
39 } 72 }
40
41 img:-webkit-full-screen {
42 width: auto;
43 height: 100%;
44 max-width: 100%;
45 }
46
47 iframe:-webkit-full-screen {
48 margin: 0 !important;
49 padding: 0 !important;
50 border: 0 !important;
51 position: fixed !important;
52 min-width: 0 !important;
53 max-width: none !important;
54 min-height: 0 !important;
55 max-height: none !important;
56 width: 100% !important;
57 height: 100% !important;
58 left: 0 !important;
59 top: 0 !important;
60 }
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698