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

Unified Diff: third_party/polymer/components-chromium/paper-dropdown-menu/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-menu/demo.html
diff --git a/third_party/polymer/components-chromium/core-dropdown-menu/demo.html b/third_party/polymer/components-chromium/paper-dropdown-menu/demo.html
similarity index 57%
copy from third_party/polymer/components-chromium/core-dropdown-menu/demo.html
copy to third_party/polymer/components-chromium/paper-dropdown-menu/demo.html
index f2646e5bf809fdc6950153f27055786884b0c3d7..e2b07e8508e6f222cd52d5b136ec6081de6e57b9 100644
--- a/third_party/polymer/components-chromium/core-dropdown-menu/demo.html
+++ b/third_party/polymer/components-chromium/paper-dropdown-menu/demo.html
@@ -15,18 +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-menu</title>
+ <title>paper-dropdown-menu</title>
<script src="../webcomponentsjs/webcomponents.js"></script>
<link href="../core-collapse/core-collapse.html" rel="import">
- <link href="../core-dropdown/core-dropdown.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="../core-item/core-item.html" rel="import">
<link href="../core-menu/core-menu.html" rel="import">
+ <link href="../paper-dropdown/paper-dropdown.html" rel="import">
+ <link href="../paper-item/paper-item.html" rel="import">
- <link href="core-dropdown-menu.html" rel="import">
+ <link href="paper-dropdown-menu.html" rel="import">
<style shim-shadowdom>
body {
@@ -47,21 +45,17 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
font-size: 16px;
}
- html /deep/ core-dropdown-menu {
+ html /deep/ paper-dropdown-menu {
box-sizing: border-box;
width: 170px;
}
- html /deep/ core-dropdown {
+ html /deep/ core-menu {
box-sizing: border-box;
- min-width: 170px;
- background-color: #eee;
- color: #000;
- border: 1px solid #ccc;
- border-radius: 3px;
+ width: 170px;
}
- core-item {
+ paper-item {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
@@ -72,14 +66,24 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
padding: 8px;
}
+ html /deep/ core-overlay {
+ border: 1px solid #ccc;
+ padding: 8px;
+ background: #fff;
+ }
+
.constrained-height {
height: 150px;
}
.colored {
+ color: #0f9d58;
+ }
+
+ .dropdown.colored::shadow #ripple,
+ .dropdown.colored::shadow #background {
border: 1px solid #0f9d58;
background-color: #b7e1cd;
- color: #0f9d58;
}
</style>
@@ -93,25 +97,25 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
<div>Absolutely positioned dropdowns</div>
- <core-dropdown-menu label="Your favorite pastry">
- <core-dropdown class="dropdown">
- <core-menu>
+ <paper-dropdown-menu label="Your favorite pastry">
+ <paper-dropdown class="dropdown">
+ <core-menu class="menu">
<template repeat="{{pastries}}">
- <core-item>{{}}</core-item>
+ <paper-item>{{}}</paper-item>
</template>
</core-menu>
- </core-dropdown>
- </core-dropdown-menu>
+ </paper-dropdown>
+ </paper-dropdown-menu>
<br><br>
- <core-dropdown-menu label="Disabled" disabled>
- <core-dropdown class="dropdown">
- <core-menu>
- <core-item>Should not see this</core-item>
+ <paper-dropdown-menu label="Disabled" disabled>
+ <paper-dropdown class="dropdown">
+ <core-menu class="menu">
+ <paper-item>Should not see this</paper-item>
</core-menu>
- </core-dropdown>
- </core-dropdown-menu>
+ </paper-dropdown>
+ </paper-dropdown-menu>
</section>
@@ -119,21 +123,37 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
<div>Layered dropdowns</div>
+ <button onclick="document.getElementById('overlay').toggle()">toggle core-overlay</button>
+
+ <core-overlay id="overlay">
+
+ <paper-dropdown-menu label="Your favorite pastry">
+ <paper-dropdown layered class="dropdown">
+ <core-menu class="menu">
+ <template repeat="{{pastries}}">
+ <paper-item>{{}}</paper-item>
+ </template>
+ </core-menu>
+ </paper-dropdown>
+ </paper-dropdown-menu>
+
+ </core-overlay>
+
<button onclick="document.getElementById('collapse').toggle()">toggle core-collapse</button>
<br>
<core-collapse id="collapse">
- <core-dropdown-menu label="Your favorite pastry">
- <core-dropdown layered class="dropdown">
- <core-menu>
+ <paper-dropdown-menu label="Your favorite pastry">
+ <paper-dropdown layered class="dropdown">
+ <core-menu class="menu">
<template repeat="{{pastries}}">
- <core-item>{{}}</core-item>
+ <paper-item>{{}}</paper-item>
</template>
</core-menu>
- </core-dropdown>
- </core-dropdown-menu>
+ </paper-dropdown>
+ </paper-dropdown-menu>
</core-collapse>
@@ -143,27 +163,27 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
<div>Custom styling</div>
- <core-dropdown-menu label="Constrained height">
- <core-dropdown class="dropdown constrained-height">
- <core-menu>
+ <paper-dropdown-menu label="Constrained height">
+ <paper-dropdown class="dropdown constrained-height">
+ <core-menu class="menu">
<template repeat="{{pastries}}">
- <core-item>{{}}</core-item>
+ <paper-item>{{}}</paper-item>
</template>
</core-menu>
- </core-dropdown>
- </core-dropdown-menu>
+ </paper-dropdown>
+ </paper-dropdown-menu>
<br><br>
- <core-dropdown-menu label="Colored">
- <core-dropdown class="dropdown colored">
- <core-menu>
+ <paper-dropdown-menu label="Colored">
+ <paper-dropdown class="dropdown colored">
+ <core-menu class="menu">
<template repeat="{{pastries}}">
- <core-item>{{}}</core-item>
+ <paper-item>{{}}</paper-item>
</template>
</core-menu>
- </core-dropdown>
- </core-dropdown-menu>
+ </paper-dropdown>
+ </paper-dropdown-menu>
</section>

Powered by Google App Engine
This is Rietveld 408576698