| Index: third_party/polymer/components/paper-dropdown-menu/paper-dropdown-menu.html
|
| diff --git a/third_party/polymer/components/core-dropdown-menu/core-dropdown-menu.html b/third_party/polymer/components/paper-dropdown-menu/paper-dropdown-menu.html
|
| similarity index 60%
|
| copy from third_party/polymer/components/core-dropdown-menu/core-dropdown-menu.html
|
| copy to third_party/polymer/components/paper-dropdown-menu/paper-dropdown-menu.html
|
| index c06f4c0fcbd953fd816fd33d3c2f839ade4b7f7b..adcca1b53bc02eb19529f52a4510a89b7c4cf135 100644
|
| --- a/third_party/polymer/components/core-dropdown-menu/core-dropdown-menu.html
|
| +++ b/third_party/polymer/components/paper-dropdown-menu/paper-dropdown-menu.html
|
| @@ -9,52 +9,92 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
|
|
|
| <!--
|
|
|
| -`core-dropdown-menu` works together with `core-dropdown` and `core-selector` to
|
| +`paper-dropdown-menu` works together with `paper-dropdown` and `core-menu` to
|
| implement a drop-down menu. The currently selected item is displayed in the
|
| control. If no item is selected, the `label` is displayed instead.
|
|
|
| The child element with the class `dropdown` will be used as the drop-down
|
| -menu. It should be a `core-dropdown` or other overlay element. You should
|
| +menu. It should be a `paper-dropdown` or other overlay element. You should
|
| also provide a `core-selector` or other selector element, such as `core-menu`,
|
| -in the drop-down.
|
| +in the drop-down. You should apply the class `menu` to the selector element.
|
|
|
| Example:
|
|
|
| - <core-dropdown-menu label="Choose a pastry">
|
| - <core-dropdown class="dropdown">
|
| - <core-selector>
|
| - <core-item label="Croissant"></core-item>
|
| - <core-item label="Donut"></core-item>
|
| - <core-item label="Financier"></core-item>
|
| - <core-item label="Madeleine"></core-item>
|
| - </core-selector>
|
| - </core-dropdown>
|
| - </core-dropdown-menu>
|
| -
|
| -@group Polymer Core Elements
|
| -@element core-dropdown-menu
|
| + <paper-dropdown-menu label="Your favorite pastry">
|
| + <paper-dropdown class="dropdown">
|
| + <core-menu class="menu">
|
| + <paper-item>Croissant</paper-item>
|
| + <paper-item>Donut</paper-item>
|
| + <paper-item>Financier</paper-item>
|
| + <paper-item>Madeleine</paper-item>
|
| + </core-menu>
|
| + </paper-dropdown>
|
| + </paper-dropdown-menu>
|
| +
|
| +This example renders a drop-down menu with 4 options.
|
| +
|
| +@group Paper Elements
|
| +@element paper-dropdown-menu
|
| @extends core-dropdown-base
|
| @status unstable
|
| @homepage github.io
|
| -->
|
|
|
| +<!--
|
| +Fired when an item's selection state is changed. This event is fired both
|
| +when an item is selected or deselected. The `isSelected` detail property
|
| +contains the selection state.
|
| +
|
| +@event core-select
|
| +@param {Object} detail
|
| + @param {boolean} detail.isSelected true for selection and false for deselection
|
| + @param {Object} detail.item the item element
|
| +-->
|
| <link href="../polymer/polymer.html" rel="import">
|
| +
|
| <link href="../core-a11y-keys/core-a11y-keys.html" rel="import">
|
| <link href="../core-dropdown/core-dropdown-base.html" rel="import">
|
| <link href="../core-focusable/core-focusable.html" rel="import">
|
| <link href="../core-icon/core-icon.html" rel="import">
|
| <link href="../core-icons/core-icons.html" rel="import">
|
| -
|
| -<polymer-element name="core-dropdown-menu" extends="core-dropdown-base" relative layout inline horizontal center tabindex="0">
|
| +<link href="../paper-shadow/paper-shadow.html" rel="import">
|
| +
|
| +<style shim-shadowdom>
|
| + html /deep/ #paper-dropdown-menu-dropdown {
|
| + margin: 12px;
|
| + overflow: visible;
|
| + }
|
| +
|
| + html /deep/ #paper-dropdown-menu-dropdown #menu {
|
| + padding: 8px 0;
|
| + margin: 0;
|
| + }
|
| +
|
| + html /deep/ #paper-dropdown-menu-dropdown .menu-container {
|
| + overflow: auto;
|
| + max-height: 100%;
|
| + max-width: 100%;
|
| + }
|
| +</style>
|
| +
|
| +<polymer-element name="paper-dropdown-menu" extends="core-dropdown-base" relative layout inline horizontal center tabindex="0">
|
| <template>
|
|
|
| <style>
|
| :host {
|
| - background-color: #fff;
|
| + -moz-user-select: none;
|
| + -ms-user-select: none;
|
| + -webkit-user-select: none;
|
| + user-select: none;
|
| + cursor: pointer;
|
| + padding: 0.5em 0 0.25em;
|
| + margin: 0.75em 0;
|
| + border-bottom: 1px solid #757575;
|
| + outline: none;
|
| }
|
|
|
| - :host([disabled]) {
|
| - color: #a8a8a8;
|
| + #label, #arrow {
|
| + color: #757575;
|
| }
|
|
|
| #label {
|
|
|