diff options
Diffstat (limited to 'catapult/third_party/polymer/components/iron-flex-layout/classes/iron-flex-layout.html')
| -rw-r--r-- | catapult/third_party/polymer/components/iron-flex-layout/classes/iron-flex-layout.html | 317 |
1 files changed, 317 insertions, 0 deletions
diff --git a/catapult/third_party/polymer/components/iron-flex-layout/classes/iron-flex-layout.html b/catapult/third_party/polymer/components/iron-flex-layout/classes/iron-flex-layout.html new file mode 100644 index 00000000..5fa7ce65 --- /dev/null +++ b/catapult/third_party/polymer/components/iron-flex-layout/classes/iron-flex-layout.html @@ -0,0 +1,317 @@ +<!-- +@license +Copyright (c) 2015 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 +--> + +<link rel="import" href="iron-shadow-flex-layout.html"> + +<script> + console.warn('This file is deprecated. Please use `iron-flex-layout/iron-flex-layout-classes.html`, and one of the specific dom-modules instead'); +</script> + +<style> + + /******************************* + Flex Layout + *******************************/ + + .layout.horizontal, + .layout.horizontal-reverse, + .layout.vertical, + .layout.vertical-reverse { + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + } + + .layout.inline { + display: -ms-inline-flexbox; + display: -webkit-inline-flex; + display: inline-flex; + } + + .layout.horizontal { + -ms-flex-direction: row; + -webkit-flex-direction: row; + flex-direction: row; + } + + .layout.horizontal-reverse { + -ms-flex-direction: row-reverse; + -webkit-flex-direction: row-reverse; + flex-direction: row-reverse; + } + + .layout.vertical { + -ms-flex-direction: column; + -webkit-flex-direction: column; + flex-direction: column; + } + + .layout.vertical-reverse { + -ms-flex-direction: column-reverse; + -webkit-flex-direction: column-reverse; + flex-direction: column-reverse; + } + + .layout.wrap { + -ms-flex-wrap: wrap; + -webkit-flex-wrap: wrap; + flex-wrap: wrap; + } + + .layout.no-wrap { + -ms-flex-wrap: nowrap; + -webkit-flex-wrap: nowrap; + flex-wrap: nowrap; + } + + .layout.wrap-reverse { + -ms-flex-wrap: wrap-reverse; + -webkit-flex-wrap: wrap-reverse; + flex-wrap: wrap-reverse; + } + + .flex-auto { + -ms-flex: 1 1 auto; + -webkit-flex: 1 1 auto; + flex: 1 1 auto; + } + + .flex-none { + -ms-flex: none; + -webkit-flex: none; + flex: none; + } + + .flex, + .flex-1 { + -ms-flex: 1; + -webkit-flex: 1; + flex: 1; + } + + .flex-2 { + -ms-flex: 2; + -webkit-flex: 2; + flex: 2; + } + + .flex-3 { + -ms-flex: 3; + -webkit-flex: 3; + flex: 3; + } + + .flex-4 { + -ms-flex: 4; + -webkit-flex: 4; + flex: 4; + } + + .flex-5 { + -ms-flex: 5; + -webkit-flex: 5; + flex: 5; + } + + .flex-6 { + -ms-flex: 6; + -webkit-flex: 6; + flex: 6; + } + + .flex-7 { + -ms-flex: 7; + -webkit-flex: 7; + flex: 7; + } + + .flex-8 { + -ms-flex: 8; + -webkit-flex: 8; + flex: 8; + } + + .flex-9 { + -ms-flex: 9; + -webkit-flex: 9; + flex: 9; + } + + .flex-10 { + -ms-flex: 10; + -webkit-flex: 10; + flex: 10; + } + + .flex-11 { + -ms-flex: 11; + -webkit-flex: 11; + flex: 11; + } + + .flex-12 { + -ms-flex: 12; + -webkit-flex: 12; + flex: 12; + } + + /* alignment in cross axis */ + + .layout.start { + -ms-flex-align: start; + -webkit-align-items: flex-start; + align-items: flex-start; + } + + .layout.center, + .layout.center-center { + -ms-flex-align: center; + -webkit-align-items: center; + align-items: center; + } + + .layout.end { + -ms-flex-align: end; + -webkit-align-items: flex-end; + align-items: flex-end; + } + + /* alignment in main axis */ + + .layout.start-justified { + -ms-flex-pack: start; + -webkit-justify-content: flex-start; + justify-content: flex-start; + } + + .layout.center-justified, + .layout.center-center { + -ms-flex-pack: center; + -webkit-justify-content: center; + justify-content: center; + } + + .layout.end-justified { + -ms-flex-pack: end; + -webkit-justify-content: flex-end; + justify-content: flex-end; + } + + .layout.around-justified { + -ms-flex-pack: around; + -webkit-justify-content: space-around; + justify-content: space-around; + } + + .layout.justified { + -ms-flex-pack: justify; + -webkit-justify-content: space-between; + justify-content: space-between; + } + + /* self alignment */ + + .self-start { + -ms-align-self: flex-start; + -webkit-align-self: flex-start; + align-self: flex-start; + } + + .self-center { + -ms-align-self: center; + -webkit-align-self: center; + align-self: center; + } + + .self-end { + -ms-align-self: flex-end; + -webkit-align-self: flex-end; + align-self: flex-end; + } + + .self-stretch { + -ms-align-self: stretch; + -webkit-align-self: stretch; + align-self: stretch; + } + + /******************************* + Other Layout + *******************************/ + + .block { + display: block; + } + + /* IE 10 support for HTML5 hidden attr */ + [hidden] { + display: none !important; + } + + .invisible { + visibility: hidden !important; + } + + .relative { + position: relative; + } + + .fit { + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + } + + body.fullbleed { + margin: 0; + height: 100vh; + } + + .scroll { + -webkit-overflow-scrolling: touch; + overflow: auto; + } + + /* fixed position */ + + .fixed-bottom, + .fixed-left, + .fixed-right, + .fixed-top { + position: fixed; + } + + .fixed-top { + top: 0; + left: 0; + right: 0; + } + + .fixed-right { + top: 0; + right: 0; + bottom: 0; + } + + .fixed-bottom { + right: 0; + bottom: 0; + left: 0; + } + + .fixed-left { + top: 0; + bottom: 0; + left: 0; + } + +</style> |