OLD | NEW |
---|---|
1 /* | 1 /* |
2 * Copyright (C) 2009 Apple Inc. All rights reserved. | 2 * Copyright (C) 2009 Apple Inc. All rights reserved. |
3 * Copyright (C) 2015 Google Inc. | 3 * Copyright (C) 2015 Google Inc. |
4 * | 4 * |
5 * Redistribution and use in source and binary forms, with or without | 5 * Redistribution and use in source and binary forms, with or without |
6 * modification, are permitted provided that the following conditions | 6 * modification, are permitted provided that the following conditions |
7 * are met: | 7 * are met: |
8 * 1. Redistributions of source code must retain the above copyright | 8 * 1. Redistributions of source code must retain the above copyright |
9 * notice, this list of conditions and the following disclaimer. | 9 * notice, this list of conditions and the following disclaimer. |
10 * 2. Redistributions in binary form must reproduce the above copyright | 10 * 2. Redistributions in binary form must reproduce the above copyright |
(...skipping 127 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
138 top: 0; | 138 top: 0; |
139 left: 0; | 139 left: 0; |
140 margin: 0; | 140 margin: 0; |
141 border-width: 0px; | 141 border-width: 0px; |
142 background-color: transparent; | 142 background-color: transparent; |
143 width: 100%; | 143 width: 100%; |
144 height: 100%; | 144 height: 100%; |
145 padding: 0; | 145 padding: 0; |
146 } | 146 } |
147 | 147 |
148 /* TODO(xjz): Move media remoting elements to a separate css file. */ | |
149 video::-internal-media-remoting-interstitial { | |
150 width: inherit; | |
151 height: inherit; | |
152 position: relative; | |
153 direction: ltr; | |
154 display: flex; | |
155 flex-direction: column; | |
156 font-family: Segoe, "Helvetica Neue", Roboto, Arial, Helvetica, sans-serif; | |
157 justify-content: flex-end; | |
158 align-items: center; | |
159 font-size: 28px; | |
160 background-color: black; | |
161 -webkit-transition: opacity .2s cubic-bezier (0.4, 0.0, 0.2, 1); | |
162 -moz-transition: opacity .2s cubic-bezier (0.4, 0.0, 0.2, 1); | |
163 -o-transition: opacity .2s cubic-bezier (0.4, 0.0, 0.2, 1); | |
164 transition: opacity .2s cubic-bezier (0.4, 0.0, 0.2, 1); | |
165 } | |
166 | |
167 video::-internal-media-remoting-background-image { | |
168 -webkit-appearance: media-remoting-background-image; | |
liberato (no reviews please)
2017/04/12 21:57:44
do these need to be in CSSValueKeywords.json5?
mi
xjz
2017/04/13 00:08:48
Seems not necessary. Only the cast icon needs to b
| |
169 display: flex; | |
170 position: absolute; | |
171 margin: 0; | |
172 top: 0px; | |
173 left: 0px; | |
174 width: 100%; | |
175 height: 100%; | |
176 border: none; | |
177 border-width: 0px; | |
178 background-color: transparent; | |
179 padding: 0; | |
180 filter: grayscale(100%) blur(5px); | |
181 } | |
182 | |
183 video::-internal-media-remoting-interstitial-elements { | |
184 -webkit-appearance: media-remoting-interstitial-elements; | |
185 display: flex; | |
186 position: absolute; | |
187 margin: 0; | |
188 top: 0px; | |
189 left: 0px; | |
190 border: none; | |
191 border-width: 0px; | |
192 background-color: transparent; | |
193 width: 100%; | |
194 height: 100%; | |
195 padding: 0; | |
196 } | |
197 | |
198 video::-internal-media-remoting-cast-icon { | |
199 -webkit-appearance: media-remoting-cast-icon; | |
200 display: flex; | |
201 position: absolute; | |
202 margin: 0px; | |
203 border-width: 0px; | |
204 background-color: transparent; | |
205 height: 36px; | |
206 width: 44px; | |
207 padding: 0px; | |
208 left: calc(50% - 22px); | |
209 top: calc(50% - 60px); | |
210 } | |
211 | |
212 video::-internal-media-remoting-cast-text-message { | |
213 -webkit-appearance: media-remoting-cast-text-message; | |
214 display: flex; | |
215 position: absolute; | |
216 border: none; | |
217 color: #FFFFFF; | |
218 opacity: 54% | |
219 text-wrap: none; | |
220 text-align: center; | |
221 background-color: transparent; | |
222 font-size: 13pt; | |
223 font-face: Roboto-Regular, Sans-serif, Segoe, Serif, Helvetica; | |
224 padding: 0px; | |
225 margin: 0px; | |
226 top: calc(50% - 10px); | |
227 width: 100%; | |
228 } | |
229 | |
230 video::-internal-media-remoting-disable-button { | |
231 -webkit-appearance: media-remoting-disable-button; | |
232 display: flex; | |
233 position: absolute; | |
234 top: calc(50% + 55pt); | |
235 left: calc(50% - 100px); | |
236 border: 2pt solid rgba(255,255,255,.54); | |
237 border-radius: 2pt; | |
238 margin: 0px; | |
239 height: 28pt; | |
240 background-color: transparent; | |
241 color: #FFFFFF; | |
242 text-wrap: none; | |
243 text-align: center; | |
244 vertical-align: middle; | |
245 font-size: 13pt; | |
246 font-face: Roboto-Medium, Sans-serif, Segoe, Serif, Helvetica; | |
247 opacity: 54% | |
248 padding: 0px; | |
249 -webkit-transition: border .5s ease-out; | |
250 -moz-transition: border .5s ease-out; | |
251 -o-transition: border .5s ease-out; | |
252 transition: border .5s ease-out; | |
253 } | |
254 | |
255 video::-internal-media-remoting-disable-button:hover, video::-internal-media-rem oting-cast-icon:hover { | |
256 opacity: 70%; | |
257 } | |
258 | |
148 video::-internal-media-controls-overlay-cast-button { | 259 video::-internal-media-controls-overlay-cast-button { |
149 -webkit-appearance: -internal-media-overlay-cast-off-button; | 260 -webkit-appearance: -internal-media-overlay-cast-off-button; |
150 display: flex; | 261 display: flex; |
151 position: absolute; | 262 position: absolute; |
152 top: 8px; | 263 top: 8px; |
153 left: 8px; | 264 left: 8px; |
154 margin-left: 0px; | 265 margin-left: 0px; |
155 margin-top: 0px; | 266 margin-top: 0px; |
156 border-width: 0px; | 267 border-width: 0px; |
157 background-color: transparent; | 268 background-color: transparent; |
(...skipping 356 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
514 font-weight: bold; | 625 font-weight: bold; |
515 } | 626 } |
516 | 627 |
517 video::cue(u) { | 628 video::cue(u) { |
518 text-decoration: underline; | 629 text-decoration: underline; |
519 } | 630 } |
520 | 631 |
521 video::cue(i) { | 632 video::cue(i) { |
522 font-style: italic; | 633 font-style: italic; |
523 } | 634 } |
OLD | NEW |