Index: third_party/polymer/components-chromium/paper-dropdown/demo.html |
diff --git a/third_party/polymer/components/core-dropdown/demo.html b/third_party/polymer/components-chromium/paper-dropdown/demo.html |
similarity index 90% |
copy from third_party/polymer/components/core-dropdown/demo.html |
copy to third_party/polymer/components-chromium/paper-dropdown/demo.html |
index 1d42ac75bd8b481a1ea4143096f68247010e37cc..d23962db6c64768726996127d615b551a434285a 100644 |
--- a/third_party/polymer/components/core-dropdown/demo.html |
+++ b/third_party/polymer/components-chromium/paper-dropdown/demo.html |
@@ -15,15 +15,16 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN |
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> |
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes"> |
- <title>core-dropdown</title> |
+ <title>paper-dropdown</title> |
<script src="../webcomponentsjs/webcomponents.js"></script> |
<link href="../core-collapse/core-collapse.html" rel="import"> |
<link href="../core-icons/core-icons.html" rel="import"> |
- <link href="../core-icon-button/core-icon-button.html" rel="import"> |
+ <link href="../paper-icon-button/paper-icon-button.html" rel="import"> |
+ <link href="../paper-item/paper-item.html" rel="import"> |
- <link href="core-dropdown.html" rel="import"> |
+ <link href="paper-dropdown.html" rel="import"> |
<style shim-shadowdom> |
body { |
@@ -44,11 +45,12 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN |
font-size: 16px; |
} |
- html /deep/ core-dropdown { |
- background-color: #eee; |
- color: #000; |
- border: 1px solid #ccc; |
- border-radius: 3px; |
+ x-trigger { |
+ z-index: auto; |
+ } |
+ |
+ html /deep/ paper-dropdown:not(.no-padding)::shadow #scroller { |
+ box-sizing: border-box; |
padding: 8px; |
} |
@@ -65,12 +67,16 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN |
</head> |
<body> |
- <polymer-element name="x-trigger" extends="core-icon-button" relative on-tap="{{toggle}}"> |
+ <polymer-element name="x-trigger" extends="paper-icon-button" relative on-tap="{{toggle}}" noink> |
+ <template> |
+ <shadow></shadow> |
+ <content></content> |
+ </template> |
<script> |
Polymer({ |
toggle: function() { |
if (!this.dropdown) { |
- this.dropdown = this.querySelector('core-dropdown'); |
+ this.dropdown = this.querySelector('paper-dropdown'); |
} |
this.dropdown && this.dropdown.toggle(); |
} |
@@ -85,27 +91,37 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN |
<div>Absolutely positioned dropdowns</div> |
<x-trigger icon="menu"> |
- <core-dropdown> |
+ <paper-dropdown> |
halign = left |
<br> |
valign = top |
- </core-dropdown> |
+ </paper-dropdown> |
</x-trigger> |
<x-trigger icon="menu"> |
- <core-dropdown valign="bottom"> |
+ <paper-dropdown valign="bottom"> |
halign = left |
<br> |
valign = bottom |
- </core-dropdown> |
+ </paper-dropdown> |
</x-trigger> |
<x-trigger icon="menu"> |
- <core-dropdown halign="right"> |
+ <paper-dropdown halign="right"> |
halign = right |
<br> |
valign = top |
- </core-dropdown> |
+ </paper-dropdown> |
+ </x-trigger> |
+ |
+ <x-trigger icon="menu"> |
+ <paper-dropdown class="no-padding"> |
+ <div class="menu"> |
+ <paper-item>Item 1</paper-item> |
+ <paper-item>Item 2</paper-item> |
+ <paper-item>Item 3</paper-item> |
+ </div> |
+ </paper-dropdown> |
</x-trigger> |
</section> |
@@ -121,11 +137,11 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN |
<core-collapse id="collapse"> |
<x-trigger icon="menu"> |
- <core-dropdown layered> |
+ <paper-dropdown layered> |
halign = left |
<br> |
valign = top |
- </core-dropdown> |
+ </paper-dropdown> |
</x-trigger> |
</core-collapse> |
@@ -137,23 +153,23 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN |
<div>Scrolling and margin</div> |
<x-trigger icon="menu"> |
- <core-dropdown> |
+ <paper-dropdown> |
no margin<br> |
<br> |
<template repeat="{{countries}}"> |
{{name}}<br> |
</template> |
- </core-dropdown> |
+ </paper-dropdown> |
</x-trigger> |
<x-trigger icon="menu"> |
- <core-dropdown class="with-margin"> |
+ <paper-dropdown class="with-margin"> |
with margin<br> |
<br> |
<template repeat="{{countries}}"> |
{{name}}<br> |
</template> |
- </core-dropdown> |
+ </paper-dropdown> |
</x-trigger> |
</section> |
@@ -163,9 +179,9 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN |
<div>Custom position</div> |
<x-trigger icon="menu"> |
- <core-dropdown class="open-below"> |
+ <paper-dropdown class="open-below"> |
top: 38px |
- </core-dropdown> |
+ </paper-dropdown> |
</x-trigger> |
</section> |