OLD | NEW |
1 <!-- | 1 <!-- |
2 @license | 2 @license |
3 Copyright (c) 2017 The Polymer Project Authors. All rights reserved. | 3 Copyright (c) 2017 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 --> | 9 --> |
10 | 10 |
11 <link rel="import" href="../../polymer/polymer.html"> | 11 <link rel="import" href="../../polymer/polymer.html"> |
12 <link rel="import" href="../color.html"> | 12 <link rel="import" href="../color.html"> |
13 <link rel="import" href="../default-theme.html"> | 13 <link rel="import" href="../default-theme.html"> |
14 <link rel="import" href="../typography.html"> | 14 <link rel="import" href="../typography.html"> |
15 | 15 |
16 <!-- | 16 <!-- |
17 Material design: [Lists](https://www.google.com/design/spec/components/lists.htm
l) | 17 Material design: [Lists](https://www.google.com/design/spec/components/lists.htm
l) |
18 | 18 |
19 Shared styles for a native `button` to be used as an item in a `paper-listbox` e
lement: | 19 Shared styles for a native `button` to be used as an item in a `paper-listbox` e
lement: |
20 | 20 |
21 <custom-style> | 21 <custom-style> |
22 <style is="custom-style" include="paper-item"></style> | 22 <style is="custom-style" include="paper-item-styles"></style> |
23 </custom-style> | 23 </custom-style> |
24 | 24 |
25 <paper-listbox> | 25 <paper-listbox> |
26 <button class="paper-item" role="option">Inbox</button> | 26 <button class="paper-item" role="option">Inbox</button> |
27 <button class="paper-item" role="option">Starred</button> | 27 <button class="paper-item" role="option">Starred</button> |
28 <button class="paper-item" role="option">Sent mail</button> | 28 <button class="paper-item" role="option">Sent mail</button> |
29 </paper-listbox> | 29 </paper-listbox> |
30 | 30 |
31 @group Paper Elements | 31 @group Paper Elements |
32 @demo demo/index.html | 32 @demo demo/index.html |
33 --> | 33 --> |
34 | 34 |
35 <dom-module id="paper-item"> | 35 <dom-module id="paper-item-styles"> |
36 <template> | 36 <template> |
37 <style> | 37 <style> |
38 :host, html { | 38 :host, html { |
39 --paper-item: { | 39 --paper-item: { |
40 display: block; | 40 display: block; |
41 position: relative; | 41 position: relative; |
42 min-height: var(--paper-item-min-height, 48px); | 42 min-height: var(--paper-item-min-height, 48px); |
43 padding: 0px 16px; | 43 padding: 0px 16px; |
44 @apply --paper-font-subhead; | 44 @apply --paper-font-subhead; |
45 border:none; | 45 border:none; |
(...skipping 35 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
81 bottom: 0; | 81 bottom: 0; |
82 background: currentColor; | 82 background: currentColor; |
83 content: ''; | 83 content: ''; |
84 opacity: var(--dark-divider-opacity); | 84 opacity: var(--dark-divider-opacity); |
85 pointer-events: none; | 85 pointer-events: none; |
86 @apply --paper-item-focused-before; | 86 @apply --paper-item-focused-before; |
87 } | 87 } |
88 </style> | 88 </style> |
89 </template> | 89 </template> |
90 </dom-module> | 90 </dom-module> |
OLD | NEW |