Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(11)

Unified Diff: third_party/polymer/components-chromium/paper-dropdown/demo.html

Issue 864173009: Add paper-dropdown and paper-dropdown-menu and run reproduce.sh (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Rebase Created 5 years, 10 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
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>

Powered by Google App Engine
This is Rietveld 408576698