OLD | NEW |
| (Empty) |
1 <!-- | |
2 @license | |
3 Copyright (c) 2015 The Polymer Project Authors. All rights reserved. | |
4 This code may only be used under the BSD style license found at http://polymer.g
ithub.io/LICENSE.txt | |
5 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt | |
6 The complete set of contributors may be found at http://polymer.github.io/CONTRI
BUTORS.txt | |
7 Code distributed by Google as part of the polymer project is also | |
8 subject to an additional IP rights grant found at http://polymer.github.io/PATEN
TS.txt | |
9 --><html><head><link rel="import" href="../polymer/polymer.html"> | |
10 <link rel="import" href="iron-overlay-manager.html"> | |
11 | |
12 <!-- | |
13 `iron-overlay-backdrop` is a backdrop used by `Polymer.IronOverlayBehavior`. It
should be a | |
14 singleton. | |
15 | |
16 ### Styling | |
17 | |
18 The following custom properties and mixins are available for styling. | |
19 | |
20 Custom property | Description | Default | |
21 -------------------------------------------|------------------------|--------- | |
22 `--iron-overlay-backdrop-background-color` | Backdrop background color
| #000 | |
23 `--iron-overlay-backdrop-opacity` | Backdrop opacity
| 0.6 | |
24 `--iron-overlay-backdrop` | Mixin applied to `iron-overlay-back
drop`. | {} | |
25 `--iron-overlay-backdrop-opened` | Mixin applied to `iron-overlay-back
drop` when it is displayed | {} | |
26 --> | |
27 | |
28 </head><body><dom-module id="iron-overlay-backdrop"> | |
29 | |
30 <style> | |
31 | |
32 :host { | |
33 position: fixed; | |
34 top: 0; | |
35 left: 0; | |
36 width: 100vw; | |
37 height: 100vh; | |
38 background-color: var(--iron-overlay-backdrop-background-color, #000); | |
39 opacity: 0; | |
40 transition: opacity 0.2s; | |
41 | |
42 @apply(--iron-overlay-backdrop); | |
43 } | |
44 | |
45 :host([opened]) { | |
46 opacity: var(--iron-overlay-backdrop-opacity, 0.6); | |
47 | |
48 @apply(--iron-overlay-backdrop-opened); | |
49 } | |
50 | |
51 </style> | |
52 | |
53 <template> | |
54 <content></content> | |
55 </template> | |
56 | |
57 </dom-module> | |
58 | |
59 <script src="iron-overlay-backdrop-extracted.js"></script></body></html> | |
OLD | NEW |