1 files changed, 78 insertions, 0 deletions
diff --git a/chromium/third_party/catapult/third_party/polymer2/bower_components/iron-collapse/demo/simple-expand-collapse.html b/chromium/third_party/catapult/third_party/polymer2/bower_components/iron-collapse/demo/simple-expand-collapse.html
new file mode 100644
index 00000000000..f5a0b9b7d9f
--- /dev/null
+++ b/chromium/third_party/catapult/third_party/polymer2/bower_components/iron-collapse/demo/simple-expand-collapse.html
@@ -0,0 +1,78 @@
+<!--
+@license
+Copyright (c) 2016 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-collapse.html">
+<link rel="import" href="../../paper-styles/shadow.html">
+
+<dom-module id="simple-expand-collapse">
+
+  <template>
+
+    <style>
+
+      :host {
+        display: block;
+      }
+
+      #trigger {
+        padding: 10px 15px;
+        background-color: #f3f3f3;
+        border: 1px solid #dedede;
+        border-radius: 5px;
+        font-size: 18px;
+        cursor: pointer;
+        -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+        text-align: left;
+      }
+
+      :host([opened]) #trigger {
+        border-bottom-left-radius: 0;
+        border-bottom-right-radius: 0;
+      }
+
+      iron-collapse {
+        border: 1px solid #dedede;
+        border-top: none;
+        border-bottom-left-radius: 5px;
+        border-bottom-right-radius: 5px;
+        @apply --shadow-elevation-2dp;
+      }
+    </style>
+    <button id="trigger" on-click="toggle" aria-expanded$="[[opened]]" aria-controls="collapse">[[_getText(opened)]]</button>
+    <iron-collapse id="collapse" opened="{{opened}}" horizontal="[[horizontal]]" no-animation="[[noAnimation]]" tabindex="0">
+      <slot></slot>
+    </iron-collapse>
+
+  </template>
+
+</dom-module>
+
+<script>
+  Polymer({
+
+    is: 'simple-expand-collapse',
+
+    properties: {
+
+      horizontal: {type: Boolean},
+      opened: {type: Boolean, reflectToAttribute: true},
+      noAnimation: {type: Boolean},
+    },
+
+    toggle: function() {
+      this.$.collapse.toggle();
+    },
+
+    _getText: function(opened) {
+      return opened ? 'Collapse' : 'Expand';
+    }
+
+  });
+</script>