third_party/polymer/v0_8/components-chromium/paper-item/paper-icon-item.html - Issue 1162563004: Upgrade to 1.0 and switch clients to dom-repeat where needed.

Side by Side Diff: third_party/polymer/v0_8/components-chromium/paper-item/paper-icon-item.html

Issue 1162563004: Upgrade to 1.0 and switch clients to dom-repeat where needed. (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master

Patch Set: Fix a layout import and remove the gzipped webanimation in reproduce.sh Created 5 years, 6 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/v0_8/components-chromium/paper-item/index.html ('k') | third_party/polymer/v0_8/components-chromium/paper-item/paper-icon-item-extracted.js » ('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://polym er.github.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/CO NTRIBUTORS.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/P ATENTS.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="../paper-styles/paper-styles.html">	10 <link rel="import" href="../paper-styles/paper-styles.html">

11	11

12 <!--	12 <!--

13 `paper-icon-item` is a list item with a fixed-width icon area.	13 `<paper-icon-item>` is a convenience element to make an item with icon. It is a non interactive list

	14 item with a fixed-width icon area, according to Material Design. This is useful if the icons are of

	15 varying widths, but you want the item bodies to line up. Use this like a `<paper -item>`. The child

	16 node with the attribute `item-icon` is placed in the icon area.

14	17

15 @element paper-icon-item	18 <paper-icon-item>

	19 <iron-icon icon="favorite" item-icon></iron-icon>

	20 Favorite

	21 </paper-icon-item>

	22 <paper-icon-item>

	23 <div class="avatar" item-icon></div>

	24 Avatar

	25 </paper-icon-item>

	26

	27 ### Styling

	28

	29 The following custom properties and mixins are available for styling:

	30

	31 Custom property \| Description \| Default

	32 ----------------\|-------------\|----------

	33 `--paper-item-icon-width` \| Width of the icon area \| `56px`

	34 `--paper-icon-item` \| Mixin applied to the item \| `{}`

	35

16 -->	36 -->

17	37

18 </head><body><dom-module id="paper-icon-item">	38 </head><body><dom-module id="paper-icon-item">

19	39

20 <link rel="import" type="css" href="paper-item-shared.css">	40 <link rel="import" type="css" href="paper-item-shared.css">

21	41

22 <style>	42 <style>

23	43

24 :host {	44 :host {

25 mixin(--layout-horizontal);	45 @apply(--layout-horizontal);

26 mixin(--layout-center);	46 @apply(--layout-center);

27 mixin(--paper-font-subhead);	47 @apply(--paper-font-subhead);

28	48

29 mixin(--paper-item);	49 @apply(--paper-item);

30 mixin(--paper-icon-item);	50 @apply(--paper-icon-item);

	51 }

	52

	53 .content-icon {

	54 width: var(--paper-item-icon-width, 56px);

31 }	55 }

32	56

33 </style>	57 </style>

34	58

35 <template>	59 <template>

36 <div id="contentIcon" class="content-icon layout horizontal center">	60 <div id="contentIcon" class="content-icon layout horizontal center">

37 <content select="[item-icon]"></content>	61 <content select="[item-icon]"></content>

38 </div>	62 </div>

39 <content></content>	63 <content></content>

40 </template>	64 </template>

41	65

42 </dom-module>	66 </dom-module>

43	67

44 <script src="paper-icon-item-extracted.js"></script></body></html>	68 <script src="paper-icon-item-extracted.js"></script></body></html>

OLD	NEW