third_party/polymer/v1_0/components-chromium/paper-card/paper-card.html - Issue 1401633002: Update Polymer from 1.1.4 -> 1.1.5

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

Issue 1401633002: Update Polymer from 1.1.4 -> 1.1.5 (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master

Patch Set: dzhioev@ review Created 5 years, 2 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-card/demo/index.html ('k') | third_party/polymer/v1_0/components-chromium/paper-card/test/basic.html » ('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="../paper-material/paper-material.html">	10 <link rel="import" href="../paper-material/paper-material.html">

	11 <link rel="import" href="../iron-flex-layout/iron-flex-layout.html">

11	12

12 <!--	13 <!--

13 Material Design: <a href="http://www.google.com/design/spec/components/cards.htm l">Cards</a>	14 Material Design: <a href="http://www.google.com/design/spec/components/cards.htm l">Cards</a>

14	15

15 `paper-card` is a container with a drop shadow.	16 `paper-card` is a container with a drop shadow.

16	17

17 Example:	18 Example:

18	19

19 <paper-card heading="Card Title">	20 <paper-card heading="Card Title">

20 <div class="card-content">Some content</div>	21 <div class="card-content">Some content</div>

21 <div class="card-actions">	22 <div class="card-actions">

22 <paper-button>Some action</paper-button>	23 <paper-button>Some action</paper-button>

23 </div>	24 </div>

24 </paper-card>	25 </paper-card>

25	26

	27 Example - top card image:

	28

	29 <paper-card heading="Card Title" image="/path/to/image.png">

	30 ...

	31 </paper-card>

	32

26 ### Accessibility	33 ### Accessibility

27	34

28 By default, the `aria-label` will be set to the value of the `heading` attribute .	35 By default, the `aria-label` will be set to the value of the `heading` attribute .

29	36

30 ### Styling	37 ### Styling

31	38

32 The following custom properties and mixins are available for styling:	39 The following custom properties and mixins are available for styling:

33	40

34 Custom property \| Description \| Default	41 Custom property \| Description \| Default

35 ----------------\|-------------\|----------	42 ----------------\|-------------\|----------

(...skipping 19 matching lines...) Expand all Loading...
55 position: relative;	62 position: relative;

56 box-sizing: border-box;	63 box-sizing: border-box;

57	64

58 background: #fff;	65 background: #fff;

59 border-radius: 2px;	66 border-radius: 2px;

60 @apply(--paper-card);	67 @apply(--paper-card);

61 }	68 }

62	69

63 paper-material {	70 paper-material {

64 border-radius: inherit;	71 border-radius: inherit;

65 width: 100%;	72 @apply(--layout-fit);

66 height: 100%;

67 }	73 }

68	74

69 /* IE 10 support for HTML5 hidden attr */	75 /* IE 10 support for HTML5 hidden attr */

70 [hidden] {	76 [hidden] {

71 display: none !important;	77 display: none !important;

72 }	78 }

73	79

74 .header {	80 .header {

75 position: relative;	81 position: relative;

76 @apply(--paper-card-header);	82 @apply(--paper-card-header);

(...skipping 26 matching lines...) Expand all Loading...
103 }	109 }

104	110

105 :host ::content .card-actions {	111 :host ::content .card-actions {

106 border-top: 1px solid #e8e8e8;	112 border-top: 1px solid #e8e8e8;

107 padding: 5px 16px;	113 padding: 5px 16px;

108 position:relative;	114 position:relative;

109 @apply(--paper-card-actions);	115 @apply(--paper-card-actions);

110 }	116 }

111 </style>	117 </style>

112	118

113 <paper-material animated$="[[animatedShadow]]" elevation="[[elevation]]">	119 <paper-material animated$="[[animatedShadow]]" elevation="[[elevation]]"></p aper-material>

114 <div class="header">

115 <img hidden$="[[!image]]" src="[[image]]">

116 <div hidden$="[[!heading]]" class$="[[_computeHeadingClass(image)]]">[[h eading]]</div>

117 </div>

118	120

119 <content></content>	121 <div class="header">

	122 <img hidden$="[[!image]]" src="[[image]]">

	123 <div hidden$="[[!heading]]" class$="[[_computeHeadingClass(image)]]">[[hea ding]]</div>

	124 </div>

120	125

121 </paper-material>	126 <content></content>

122

123 </template>	127 </template>

124	128

125 </dom-module>	129 </dom-module>

126	130

127 <script src="paper-card-extracted.js"></script></body></html>	131 <script src="paper-card-extracted.js"></script></body></html>

OLD	NEW