| Index: pkg/polymer/lib/src/js/polymer/layout.html
|
| diff --git a/pkg/polymer/lib/src/js/polymer/layout.html b/pkg/polymer/lib/src/js/polymer/layout.html
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..4e1284b9c15ac6401bac55233b364823e70ab8da
|
| --- /dev/null
|
| +++ b/pkg/polymer/lib/src/js/polymer/layout.html
|
| @@ -0,0 +1,278 @@
|
| +<!--
|
| +Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
|
| +This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
| +The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
| +The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
| +Code distributed by Google as part of the polymer project is also
|
| +subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
| +-->
|
| +<style shim-shadowdom>
|
| +/*******************************
|
| + Flex Layout
|
| +*******************************/
|
| +
|
| +html /deep/ [layout][horizontal], html /deep/ [layout][vertical] {
|
| + display: -ms-flexbox;
|
| + display: -webkit-flex;
|
| + display: flex;
|
| +}
|
| +
|
| +html /deep/ [layout][horizontal][inline], html /deep/ [layout][vertical][inline] {
|
| + display: -ms-inline-flexbox;
|
| + display: -webkit-inline-flex;
|
| + display: inline-flex;
|
| +}
|
| +
|
| +html /deep/ [layout][horizontal] {
|
| + -ms-flex-direction: row;
|
| + -webkit-flex-direction: row;
|
| + flex-direction: row;
|
| +}
|
| +
|
| +html /deep/ [layout][horizontal][reverse] {
|
| + -ms-flex-direction: row-reverse;
|
| + -webkit-flex-direction: row-reverse;
|
| + flex-direction: row-reverse;
|
| +}
|
| +
|
| +html /deep/ [layout][vertical] {
|
| + -ms-flex-direction: column;
|
| + -webkit-flex-direction: column;
|
| + flex-direction: column;
|
| +}
|
| +
|
| +html /deep/ [layout][vertical][reverse] {
|
| + -ms-flex-direction: column-reverse;
|
| + -webkit-flex-direction: column-reverse;
|
| + flex-direction: column-reverse;
|
| +}
|
| +
|
| +html /deep/ [layout][wrap] {
|
| + -ms-flex-wrap: wrap;
|
| + -webkit-flex-wrap: wrap;
|
| + flex-wrap: wrap;
|
| +}
|
| +
|
| +html /deep/ [layout][wrap-reverse] {
|
| + -ms-flex-wrap: wrap-reverse;
|
| + -webkit-flex-wrap: wrap-reverse;
|
| + flex-wrap: wrap-reverse;
|
| +}
|
| +
|
| +html /deep/ [flex] {
|
| + -ms-flex: 1;
|
| + -webkit-flex: 1;
|
| + flex: 1;
|
| +}
|
| +
|
| +html /deep/ [flex][auto] {
|
| + -ms-flex: 1 1 auto;
|
| + -webkit-flex: 1 1 auto;
|
| + flex: 1 1 auto;
|
| +}
|
| +
|
| +html /deep/ [flex][none] {
|
| + -ms-flex: none;
|
| + -webkit-flex: none;
|
| + flex: none;
|
| +}
|
| +
|
| +html /deep/ [flex][one] {
|
| + -ms-flex: 1;
|
| + -webkit-flex: 1;
|
| + flex: 1;
|
| +}
|
| +
|
| +html /deep/ [flex][two] {
|
| + -ms-flex: 2;
|
| + -webkit-flex: 2;
|
| + flex: 2;
|
| +}
|
| +
|
| +html /deep/ [flex][three] {
|
| + -ms-flex: 3;
|
| + -webkit-flex: 3;
|
| + flex: 3;
|
| +}
|
| +
|
| +html /deep/ [flex][four] {
|
| + -ms-flex: 4;
|
| + -webkit-flex: 4;
|
| + flex: 4;
|
| +}
|
| +
|
| +html /deep/ [flex][five] {
|
| + -ms-flex: 5;
|
| + -webkit-flex: 5;
|
| + flex: 5;
|
| +}
|
| +
|
| +html /deep/ [flex][six] {
|
| + -ms-flex: 6;
|
| + -webkit-flex: 6;
|
| + flex: 6;
|
| +}
|
| +
|
| +html /deep/ [flex][seven] {
|
| + -ms-flex: 7;
|
| + -webkit-flex: 7;
|
| + flex: 7;
|
| +}
|
| +
|
| +html /deep/ [flex][eight] {
|
| + -ms-flex: 8;
|
| + -webkit-flex: 8;
|
| + flex: 8;
|
| +}
|
| +
|
| +html /deep/ [flex][nine] {
|
| + -ms-flex: 9;
|
| + -webkit-flex: 9;
|
| + flex: 9;
|
| +}
|
| +
|
| +html /deep/ [flex][ten] {
|
| + -ms-flex: 10;
|
| + -webkit-flex: 10;
|
| + flex: 10;
|
| +}
|
| +
|
| +html /deep/ [flex][eleven] {
|
| + -ms-flex: 11;
|
| + -webkit-flex: 11;
|
| + flex: 11;
|
| +}
|
| +
|
| +html /deep/ [flex][twelve] {
|
| + -ms-flex: 12;
|
| + -webkit-flex: 12;
|
| + flex: 12;
|
| +}
|
| +
|
| +/* alignment in cross axis */
|
| +
|
| +html /deep/ [layout][start] {
|
| + -ms-flex-align: start;
|
| + -webkit-align-items: flex-start;
|
| + align-items: flex-start;
|
| +}
|
| +
|
| +html /deep/ [layout][center] {
|
| + -ms-flex-align: center;
|
| + -webkit-align-items: center;
|
| + align-items: center;
|
| +}
|
| +
|
| +html /deep/ [layout][end] {
|
| + -ms-flex-align: end;
|
| + -webkit-align-items: flex-end;
|
| + align-items: flex-end;
|
| +}
|
| +
|
| +/* alignment in main axis */
|
| +
|
| +html /deep/ [layout][start-justified] {
|
| + -ms-flex-pack: start;
|
| + -webkit-justify-content: flex-start;
|
| + justify-content: flex-start;
|
| +}
|
| +
|
| +html /deep/ [layout][center-justified] {
|
| + -ms-flex-pack: center;
|
| + -webkit-justify-content: center;
|
| + justify-content: center;
|
| +}
|
| +
|
| +html /deep/ [layout][end-justified] {
|
| + -ms-flex-pack: end;
|
| + -webkit-justify-content: flex-end;
|
| + justify-content: flex-end;
|
| +}
|
| +
|
| +html /deep/ [layout][around-justified] {
|
| + -ms-flex-pack: around;
|
| + -webkit-justify-content: space-around;
|
| + justify-content: space-around;
|
| +}
|
| +
|
| +html /deep/ [layout][justified] {
|
| + -ms-flex-pack: justify;
|
| + -webkit-justify-content: space-between;
|
| + justify-content: space-between;
|
| +}
|
| +
|
| +/* self alignment */
|
| +
|
| +html /deep/ [self-start] {
|
| + -ms-align-self: flex-start;
|
| + -webkit-align-self: flex-start;
|
| + align-self: flex-start;
|
| +}
|
| +
|
| +html /deep/ [self-center] {
|
| + -ms-align-self: center;
|
| + -webkit-align-self: center;
|
| + align-self: center;
|
| +}
|
| +
|
| +html /deep/ [self-end] {
|
| + -ms-align-self: flex-end;
|
| + -webkit-align-self: flex-end;
|
| + align-self: flex-end;
|
| +}
|
| +
|
| +html /deep/ [self-stretch] {
|
| + -ms-align-self: stretch;
|
| + -webkit-align-self: stretch;
|
| + align-self: stretch;
|
| +}
|
| +
|
| +/*******************************
|
| + Other Layout
|
| +*******************************/
|
| +
|
| +html /deep/ [block] {
|
| + display: block;
|
| +}
|
| +
|
| +/* ie support for hidden */
|
| +html /deep/ [hidden] {
|
| + display: none;
|
| +}
|
| +
|
| +html /deep/ [relative] {
|
| + position: relative;
|
| +}
|
| +
|
| +html /deep/ [fit] {
|
| + position: absolute;
|
| + top: 0;
|
| + right: 0;
|
| + bottom: 0;
|
| + left: 0;
|
| +}
|
| +
|
| +body[fullbleed] {
|
| + margin: 0;
|
| + height: 100vh;
|
| +}
|
| +
|
| +/*******************************
|
| + Other
|
| +*******************************/
|
| +
|
| +html /deep/ [segment], html /deep/ segment {
|
| + display: block;
|
| + position: relative;
|
| + -webkit-box-sizing: border-box;
|
| + -ms-box-sizing: border-box;
|
| + box-sizing: border-box;
|
| + margin: 1em 0.5em;
|
| + padding: 1em;
|
| + background-color: white;
|
| + -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
|
| + box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
|
| + border-radius: 5px 5px 5px 5px;
|
| +}
|
| +
|
| +</style>
|
|
|