| Index: pkg/polymer/lib/elements/polymer-overlay/polymer-overlay.css
|
| diff --git a/pkg/polymer/lib/elements/polymer-overlay/polymer-overlay.css b/pkg/polymer/lib/elements/polymer-overlay/polymer-overlay.css
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..344ae548deb888ef6b3b74ff560d9d3a62ad8b8a
|
| --- /dev/null
|
| +++ b/pkg/polymer/lib/elements/polymer-overlay/polymer-overlay.css
|
| @@ -0,0 +1,61 @@
|
| +/*
|
| + * Copyright 2013 The Polymer Authors. All rights reserved.
|
| + * Use of this source code is governed by a BSD-style
|
| + * license that can be found in the LICENSE file.
|
| + */
|
| +
|
| +/* Note that trbl: 0 + position: fixed will not 'fit to window'
|
| +if a transform is applied to a parent of this element. That parent
|
| +becomes the containing block; see:
|
| +http://dev.w3.org/csswg/css3-transforms/#transform-rendering
|
| +We address this by using script based positioning =(
|
| +*/
|
| +:host(.polymer-overlay:host) {
|
| + position: fixed;
|
| + z-index: 10;
|
| + outline: none;
|
| + display: none;
|
| + -webkit-transition: opacity 0.001s;
|
| + transition: opacity 0.001s;
|
| +}
|
| +
|
| +:host(.revealed:host) {
|
| + display: block;
|
| + visibility: hidden;
|
| +}
|
| +
|
| +:host(.revealed.opened:host) {
|
| + display: block;
|
| + visibility: visible;
|
| +}
|
| +
|
| +.polymer-overlay {
|
| + position: fixed;
|
| + z-index: 10;
|
| + outline: none;
|
| + display: none;
|
| + -webkit-transition: opacity 0.001s;
|
| + transition: opacity 0.001s;
|
| +}
|
| +
|
| +/*
|
| + The revealed class exists because it's necessary to 'show' a node
|
| + before applying a transition. When an overlay is opened, it is
|
| + immediately revealed (display: block) and then asynchronously the
|
| + opened or closing classes are added.
|
| +
|
| + Because we don't want to actually show the node before a transition
|
| + or animation is applied, when the node is
|
| + revealed, it is made display: block but visibility: hidden.
|
| + It is then made visibility: visible when it is opened.
|
| +*/
|
| +
|
| +.revealed {
|
| + display: block;
|
| + visibility: hidden;
|
| +}
|
| +
|
| +.revealed.opened {
|
| + display: block;
|
| + visibility: visible;
|
| +}
|
|
|