OLD | NEW |
1 :-webkit-full-screen { | 1 :not(:root):-webkit-full-screen { |
2 background-color: white; | 2 position: fixed !important; |
3 z-index: 2147483647 !important; | 3 top: 0 !important; |
4 } | 4 right: 0 !important; |
5 | 5 bottom: 0 !important; |
6 :root:-webkit-full-screen-ancestor { | |
7 overflow: hidden !important; | |
8 } | |
9 | |
10 :-webkit-full-screen-ancestor:not(iframe) { | |
11 z-index: auto !important; | |
12 position: static !important; | |
13 opacity: 1 !important; | |
14 transform: none !important; | |
15 -webkit-mask: none !important; | |
16 clip: none !important; | |
17 -webkit-filter: none !important; | |
18 transition: none !important; | |
19 -webkit-box-reflect: none !important; | |
20 -webkit-perspective: none !important; | |
21 -webkit-transform-style: flat !important; | |
22 will-change: auto !important; | |
23 } | |
24 | |
25 video:-webkit-full-screen, audio:-webkit-full-screen { | |
26 background-color: transparent !important; | |
27 position: relative !important; | |
28 left: 0 !important; | 6 left: 0 !important; |
29 top: 0 ! important; | |
30 margin: 0 !important; | 7 margin: 0 !important; |
| 8 box-sizing: border-box !important; |
31 min-width: 0 !important; | 9 min-width: 0 !important; |
32 max-width: none !important; | 10 max-width: none !important; |
33 min-height: 0 !important; | 11 min-height: 0 !important; |
34 max-height: none !important; | 12 max-height: none !important; |
35 width: 100% !important; | 13 width: 100% !important; |
36 height: 100% !important; | 14 height: 100% !important; |
37 flex: 1 !important; | |
38 display: block !important; | |
39 transform: none !important; | 15 transform: none !important; |
40 } | |
41 | 16 |
42 img:-webkit-full-screen { | 17 /* intentionally not !important */ |
43 width: auto; | 18 object-fit: contain; |
44 height: 100%; | |
45 max-width: 100%; | |
46 } | 19 } |
47 | 20 |
48 iframe:-webkit-full-screen { | 21 iframe:-webkit-full-screen { |
49 margin: 0 !important; | 22 border: none !important; |
50 padding: 0 !important; | 23 padding: 0 !important; |
51 border: 0 !important; | |
52 position: fixed !important; | |
53 min-width: 0 !important; | |
54 max-width: none !important; | |
55 min-height: 0 !important; | |
56 max-height: none !important; | |
57 width: 100% !important; | |
58 height: 100% !important; | |
59 left: 0 !important; | |
60 top: 0 !important; | |
61 } | 24 } |
| 25 |
| 26 /* TODO(foolip): In the spec, there's a ::backdrop block with the properties |
| 27 shared with dialog::backdrop (see html.css). */ |
| 28 :not(:root):-webkit-full-screen::backdrop { |
| 29 position: fixed; |
| 30 top: 0; |
| 31 right: 0; |
| 32 bottom: 0; |
| 33 left: 0; |
| 34 background: black; |
| 35 } |
OLD | NEW |