aboutsummaryrefslogtreecommitdiff
path: root/catapult/third_party/polymer/components/paper-styles/demo-pages.html
diff options
context:
space:
mode:
Diffstat (limited to 'catapult/third_party/polymer/components/paper-styles/demo-pages.html')
-rw-r--r--catapult/third_party/polymer/components/paper-styles/demo-pages.html72
1 files changed, 72 insertions, 0 deletions
diff --git a/catapult/third_party/polymer/components/paper-styles/demo-pages.html b/catapult/third_party/polymer/components/paper-styles/demo-pages.html
new file mode 100644
index 00000000..6e900ad1
--- /dev/null
+++ b/catapult/third_party/polymer/components/paper-styles/demo-pages.html
@@ -0,0 +1,72 @@
+<!--
+@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="../polymer/polymer.html">
+
+<link rel="import" href="../iron-flex-layout/iron-flex-layout.html">
+
+<link rel="import" href="color.html">
+<link rel="import" href="typography.html">
+<link rel="import" href="shadow.html">
+
+<style is="custom-style">
+
+ body {
+ @apply(--paper-font-common-base);
+ font-size: 14px;
+ margin: 0;
+ padding: 24px;
+ background-color: var(--paper-grey-50);
+ }
+
+ .horizontal-section-container {
+ @apply(--layout-horizontal);
+ @apply(--layout-center-justified);
+ @apply(--layout-wrap);
+ }
+
+ .vertical-section-container {
+ @apply(--layout-vertical);
+ @apply(--center-justified);
+ }
+
+ .horizontal-section {
+ background-color: white;
+ padding: 24px;
+ margin-right: 24px;
+ min-width: 200px;
+
+ @apply(--shadow-elevation-2dp);
+ }
+
+ .vertical-section {
+ background-color: white;
+ padding: 24px;
+ margin: 0 24px 24px 24px;
+
+ @apply(--shadow-elevation-2dp);
+ }
+
+ .centered {
+ max-width: 400px;
+ margin-left: auto;
+ margin-right: auto;
+ }
+
+ code {
+ color: var(--google-grey-700);
+ }
+
+ /* TODO: remove this hack and use horizontal-section-container instead */
+ body > div.layout.horizontal.center-justified {
+ @apply(--layout-wrap);
+ }
+
+</style>