third_party/polymer/v1_0/components-chromium/paper-menu-button/paper-menu-button.html - Issue 1561893002: [Polymer] Roll polymer to latest version

Side by Side Diff: third_party/polymer/v1_0/components-chromium/paper-menu-button/paper-menu-button.html

Issue 1561893002: [Polymer] Roll polymer to latest version (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master

Patch Set: update grdp Created 4 years, 11 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 unified diff | Download patch

« no previous file with comments | « third_party/polymer/v1_0/components-chromium/paper-menu-button/bower.json ('k') | third_party/polymer/v1_0/components-chromium/paper-menu/.bower.json » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')

OLD	NEW
1 <!--	1 <!--

2 @license	2 @license

3 Copyright (c) 2015 The Polymer Project Authors. All rights reserved.	3 Copyright (c) 2015 The Polymer Project Authors. All rights reserved.

4 This code may only be used under the BSD style license found at http://polymer.g ithub.io/LICENSE.txt	4 This code may only be used under the BSD style license found at http://polymer.g ithub.io/LICENSE.txt

5 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt	5 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt

6 The complete set of contributors may be found at http://polymer.github.io/CONTRI BUTORS.txt	6 The complete set of contributors may be found at http://polymer.github.io/CONTRI BUTORS.txt

7 Code distributed by Google as part of the polymer project is also	7 Code distributed by Google as part of the polymer project is also

8 subject to an additional IP rights grant found at http://polymer.github.io/PATEN TS.txt	8 subject to an additional IP rights grant found at http://polymer.github.io/PATEN TS.txt

9 --><html><head><link rel="import" href="../polymer/polymer.html">	9 --><html><head><link rel="import" href="../polymer/polymer.html">

10 <link rel="import" href="../iron-dropdown/iron-dropdown.html">	10 <link rel="import" href="../iron-dropdown/iron-dropdown.html">

11 <link rel="import" href="../iron-a11y-keys-behavior/iron-a11y-keys-behavior.html ">	11 <link rel="import" href="../iron-a11y-keys-behavior/iron-a11y-keys-behavior.html ">

12 <link rel="import" href="../iron-behaviors/iron-control-state.html">	12 <link rel="import" href="../iron-behaviors/iron-control-state.html">

13 <link rel="import" href="../paper-material/paper-material.html">	13 <link rel="import" href="../paper-material/paper-material.html">

14 <link rel="import" href="../paper-styles/default-theme.html">	14 <link rel="import" href="../paper-styles/default-theme.html">

15 <link rel="import" href="../neon-animation/animations/fade-in-animation.html">	15 <link rel="import" href="../neon-animation/animations/fade-in-animation.html">

16 <link rel="import" href="../neon-animation/animations/fade-out-animation.html">	16 <link rel="import" href="../neon-animation/animations/fade-out-animation.html">

17 <link rel="import" href="paper-menu-button-animations.html">	17 <link rel="import" href="paper-menu-button-animations.html">

18	18

19 <!--	19 <!--

	20 Material design: [Dropdown buttons](https://www.google.com/design/spec/component s/buttons.html#buttons-dropdown-buttons)

	21

20 `paper-menu-button` allows one to compose a designated "trigger" element with	22 `paper-menu-button` allows one to compose a designated "trigger" element with

21 another element that represents "content", to create a dropdown menu that	23 another element that represents "content", to create a dropdown menu that

22 displays the "content" when the "trigger" is clicked.	24 displays the "content" when the "trigger" is clicked.

23	25

24 The child element with the class `dropdown-trigger` will be used as the	26 The child element with the class `dropdown-trigger` will be used as the

25 "trigger" element. The child element with the class `dropdown-content` will be	27 "trigger" element. The child element with the class `dropdown-content` will be

26 used as the "content" element.	28 used as the "content" element.

27	29

28 The `paper-menu-button` is sensitive to its content's `iron-select` events. If	30 The `paper-menu-button` is sensitive to its content's `iron-select` events. If

29 the "content" element triggers an `iron-select` event, the `paper-menu-button`	31 the "content" element triggers an `iron-select` event, the `paper-menu-button`

(...skipping 13 matching lines...) Expand all Loading...
43 ### Styling	45 ### Styling

44	46

45 The following custom properties and mixins are also available for styling:	47 The following custom properties and mixins are also available for styling:

46	48

47 Custom property \| Description \| Default	49 Custom property \| Description \| Default

48 ----------------\|-------------\|----------	50 ----------------\|-------------\|----------

49 `--paper-menu-button-dropdown-background` \| Background color of the paper-menu-b utton dropdown \| `#fff`	51 `--paper-menu-button-dropdown-background` \| Background color of the paper-menu-b utton dropdown \| `#fff`

50 `--paper-menu-button` \| Mixin applied to the paper-menu-button \| `{}`	52 `--paper-menu-button` \| Mixin applied to the paper-menu-button \| `{}`

51 `--paper-menu-button-disabled` \| Mixin applied to the paper-menu-button when dis abled \| `{}`	53 `--paper-menu-button-disabled` \| Mixin applied to the paper-menu-button when dis abled \| `{}`

52 `--paper-menu-button-dropdown` \| Mixin applied to the paper-menu-button dropdown \| `{}`	54 `--paper-menu-button-dropdown` \| Mixin applied to the paper-menu-button dropdown \| `{}`

53	55 `--paper-menu-button-content` \| Mixin applied to the paper-menu-button content \| `{}`

54	56

55 @hero hero.svg	57 @hero hero.svg

56 @demo demo/index.html	58 @demo demo/index.html

57 -->	59 -->

58	60

59 </head><body><dom-module id="paper-menu-button">	61 </head><body><dom-module id="paper-menu-button">

60 <style>	62 <style>

61 :host {	63 :host {

62 display: inline-block;	64 display: inline-block;

63 position: relative;	65 position: relative;

(...skipping 15 matching lines...) Expand all Loading...
79 margin-top: -10px;	81 margin-top: -10px;

80 top: 10px;	82 top: 10px;

81 }	83 }

82	84

83 :host([vertical-align="bottom"]) paper-material {	85 :host([vertical-align="bottom"]) paper-material {

84 bottom: 10px;	86 bottom: 10px;

85 margin-bottom: -10px;	87 margin-bottom: -10px;

86 margin-top: 20px;	88 margin-top: 20px;

87 }	89 }

88	90

89 paper-material {	91 iron-dropdown {

	92 @apply(--paper-menu-button-dropdown);

	93 }

	94

	95 .dropdown-content {

90 border-radius: 2px;	96 border-radius: 2px;

91 background-color: var(--paper-menu-button-dropdown-background, --primary-b ackground-color);	97 background-color: var(--paper-menu-button-dropdown-background, --primary-b ackground-color);

92	98 @apply(--paper-menu-button-content);

93 @apply(--paper-menu-button-dropdown);

94 }	99 }

95 </style>	100 </style>

96 <template>	101 <template>

97 <div id="trigger" on-tap="open">	102 <div id="trigger" on-tap="open">

98 <content select=".dropdown-trigger"></content>	103 <content select=".dropdown-trigger"></content>

99 </div>	104 </div>

100 <iron-dropdown id="dropdown" opened="{{opened}}" horizontal-align="[[horizon talAlign]]" vertical-align="[[verticalAlign]]" horizontal-offset="[[horizontalOf fset]]" vertical-offset="[[verticalOffset]]" open-animation-config="[[openAnimat ionConfig]]" close-animation-config="[[closeAnimationConfig]]" no-animations="[[ noAnimations]]" focus-target="[[_dropdownContent]]">	105 <iron-dropdown id="dropdown" opened="{{opened}}" horizontal-align="[[horizon talAlign]]" vertical-align="[[verticalAlign]]" horizontal-offset="[[horizontalOf fset]]" vertical-offset="[[verticalOffset]]" open-animation-config="[[openAnimat ionConfig]]" close-animation-config="[[closeAnimationConfig]]" no-animations="[[ noAnimations]]" focus-target="[[_dropdownContent]]">

101 <paper-material class="dropdown-content">	106 <paper-material class="dropdown-content">

102 <content id="content" select=".dropdown-content"></content>	107 <content id="content" select=".dropdown-content"></content>

103 </paper-material>	108 </paper-material>

104 </iron-dropdown>	109 </iron-dropdown>

105 </template>	110 </template>

106 </dom-module>	111 </dom-module>

107 <script src="paper-menu-button-extracted.js"></script></body></html>	112 <script src="paper-menu-button-extracted.js"></script></body></html>

OLD	NEW