Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(272)

Side by Side Diff: third_party/polymer/v0_8/components-chromium/paper-styles/typography.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
OLDNEW
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 --> 9 -->
10 <!-- TODO(nevir): Should we upgrade Polymer/font-roboto to the final font? --> 10 <!-- TODO(nevir): Should we upgrade Polymer/font-roboto to the final font? -->
11 <link rel="stylesheet" href="//fonts.googleapis.com/css?family=Roboto:400,300,30 0italic,400italic,500,500italic,700,700italic"> 11 <link rel="stylesheet" href="//fonts.googleapis.com/css?family=Roboto:400,300,30 0italic,400italic,500,500italic,700,700italic">
12 12
13 <link rel="import" href="../polymer/polymer.html"> 13 <link rel="import" href="../polymer/polymer.html">
14 14
15 <style is="x-style"> 15 <style is="custom-style">
16 16
17 * { 17 :root {
18 18
19 /* Shared Styles */ 19 /* Shared Styles */
20 20
21 /* 21 /*
22 Unfortunately, we can't make use of these yet - sibling properties aren't 22 Unfortunately, we can't make use of these yet - sibling properties aren't
23 evaluated. See https://github.com/Polymer/polymer/issues/1399 23 evaluated. See https://github.com/Polymer/polymer/issues/1399
24 24
25 --paper-font-common-base: { 25 --paper-font-common-base: {
26 font-family: 'Roboto', 'Noto', sans-serif; 26 font-family: 'Roboto', 'Noto', sans-serif;
27 -webkit-font-smoothing: antialiased; 27 -webkit-font-smoothing: antialiased;
28 } 28 };
29 29
30 --paper-font-common-code: { 30 --paper-font-common-code: {
31 font-family: 'Inconsolata', 'Consolas', 'Source Code Pro', 'Monaco', 'Menl o', monospace; 31 font-family: 'Inconsolata', 'Consolas', 'Source Code Pro', 'Monaco', 'Menl o', monospace;
32 -webkit-font-smoothing: antialiased; 32 -webkit-font-smoothing: antialiased;
33 } 33 };
34 34
35 --paper-font-common-expensive-kerning: { 35 --paper-font-common-expensive-kerning: {
36 text-rendering: optimizeLegibility; 36 text-rendering: optimizeLegibility;
37 } 37 };
38 38
39 --paper-font-common-nowrap: { 39 --paper-font-common-nowrap: {
40 white-space: nowrap; 40 white-space: nowrap;
41 overflow: hidden; 41 overflow: hidden;
42 text-overflow: ellipsis; 42 text-overflow: ellipsis;
43 } 43 };
44 */ 44 */
45 45
46 /* Material Font Styles */ 46 /* Material Font Styles */
47 47
48 --paper-font-display4: { 48 --paper-font-display4: {
49 /* mixin(--paper-font-common-base) */ 49 /* @apply(--paper-font-common-base) */
50 font-family: 'Roboto', 'Noto', sans-serif; 50 font-family: 'Roboto', 'Noto', sans-serif;
51 -webkit-font-smoothing: antialiased; 51 -webkit-font-smoothing: antialiased;
52 /* mixin(--paper-font-common-expensive-kerning); */ 52 /* @apply(--paper-font-common-expensive-kerning); */
53 text-rendering: optimizeLegibility; 53 text-rendering: optimizeLegibility;
54 /* mixin(--paper-font-common-nowrap); */ 54 /* @apply(--paper-font-common-nowrap); */
55 white-space: nowrap; 55 white-space: nowrap;
56 overflow: hidden; 56 overflow: hidden;
57 text-overflow: ellipsis; 57 text-overflow: ellipsis;
58 58
59 font-size: 112px; 59 font-size: 112px;
60 font-weight: 300; 60 font-weight: 300;
61 letter-spacing: -.044em; 61 letter-spacing: -.044em;
62 line-height: 120px; 62 line-height: 120px;
63 } 63 };
64 64
65 --paper-font-display3: { 65 --paper-font-display3: {
66 /* mixin(--paper-font-common-base) */ 66 /* @apply(--paper-font-common-base) */
67 font-family: 'Roboto', 'Noto', sans-serif; 67 font-family: 'Roboto', 'Noto', sans-serif;
68 -webkit-font-smoothing: antialiased; 68 -webkit-font-smoothing: antialiased;
69 /* mixin(--paper-font-common-expensive-kerning); */ 69 /* @apply(--paper-font-common-expensive-kerning); */
70 text-rendering: optimizeLegibility; 70 text-rendering: optimizeLegibility;
71 /* mixin(--paper-font-common-nowrap); */ 71 /* @apply(--paper-font-common-nowrap); */
72 white-space: nowrap; 72 white-space: nowrap;
73 overflow: hidden; 73 overflow: hidden;
74 text-overflow: ellipsis; 74 text-overflow: ellipsis;
75 75
76 font-size: 56px; 76 font-size: 56px;
77 font-weight: 400; 77 font-weight: 400;
78 letter-spacing: -.026em; 78 letter-spacing: -.026em;
79 line-height: 60px; 79 line-height: 60px;
80 } 80 };
81 81
82 --paper-font-display2: { 82 --paper-font-display2: {
83 /* mixin(--paper-font-common-base) */ 83 /* @apply(--paper-font-common-base) */
84 font-family: 'Roboto', 'Noto', sans-serif; 84 font-family: 'Roboto', 'Noto', sans-serif;
85 -webkit-font-smoothing: antialiased; 85 -webkit-font-smoothing: antialiased;
86 /* mixin(--paper-font-common-expensive-kerning); */ 86 /* @apply(--paper-font-common-expensive-kerning); */
87 text-rendering: optimizeLegibility; 87 text-rendering: optimizeLegibility;
88 88
89 font-size: 45px; 89 font-size: 45px;
90 font-weight: 400; 90 font-weight: 400;
91 letter-spacing: -.018em; 91 letter-spacing: -.018em;
92 line-height: 48px; 92 line-height: 48px;
93 } 93 };
94 94
95 --paper-font-display1: { 95 --paper-font-display1: {
96 /* mixin(--paper-font-common-base) */ 96 /* @apply(--paper-font-common-base) */
97 font-family: 'Roboto', 'Noto', sans-serif; 97 font-family: 'Roboto', 'Noto', sans-serif;
98 -webkit-font-smoothing: antialiased; 98 -webkit-font-smoothing: antialiased;
99 /* mixin(--paper-font-common-expensive-kerning); */ 99 /* @apply(--paper-font-common-expensive-kerning); */
100 text-rendering: optimizeLegibility; 100 text-rendering: optimizeLegibility;
101 101
102 font-size: 34px; 102 font-size: 34px;
103 font-weight: 400; 103 font-weight: 400;
104 letter-spacing: -.01em; 104 letter-spacing: -.01em;
105 line-height: 40px; 105 line-height: 40px;
106 } 106 };
107 107
108 --paper-font-headline: { 108 --paper-font-headline: {
109 /* mixin(--paper-font-common-base) */ 109 /* @apply(--paper-font-common-base) */
110 font-family: 'Roboto', 'Noto', sans-serif; 110 font-family: 'Roboto', 'Noto', sans-serif;
111 -webkit-font-smoothing: antialiased; 111 -webkit-font-smoothing: antialiased;
112 /* mixin(--paper-font-common-expensive-kerning); */ 112 /* @apply(--paper-font-common-expensive-kerning); */
113 text-rendering: optimizeLegibility; 113 text-rendering: optimizeLegibility;
114 114
115 font-size: 24px; 115 font-size: 24px;
116 font-weight: 400; 116 font-weight: 400;
117 letter-spacing: -.012em; 117 letter-spacing: -.012em;
118 line-height: 32px; 118 line-height: 32px;
119 } 119 };
120 120
121 --paper-font-title: { 121 --paper-font-title: {
122 /* mixin(--paper-font-common-base) */ 122 /* @apply(--paper-font-common-base) */
123 font-family: 'Roboto', 'Noto', sans-serif; 123 font-family: 'Roboto', 'Noto', sans-serif;
124 -webkit-font-smoothing: antialiased; 124 -webkit-font-smoothing: antialiased;
125 /* mixin(--paper-font-common-expensive-kerning); */ 125 /* @apply(--paper-font-common-expensive-kerning); */
126 text-rendering: optimizeLegibility; 126 text-rendering: optimizeLegibility;
127 /* mixin(--paper-font-common-nowrap); */ 127 /* @apply(--paper-font-common-nowrap); */
128 white-space: nowrap; 128 white-space: nowrap;
129 overflow: hidden; 129 overflow: hidden;
130 text-overflow: ellipsis; 130 text-overflow: ellipsis;
131 131
132 font-size: 20px; 132 font-size: 20px;
133 font-weight: 500; 133 font-weight: 500;
134 line-height: 28px; 134 line-height: 28px;
135 } 135 };
136 136
137 --paper-font-subhead: { 137 --paper-font-subhead: {
138 /* mixin(--paper-font-common-base) */ 138 /* @apply(--paper-font-common-base) */
139 font-family: 'Roboto', 'Noto', sans-serif; 139 font-family: 'Roboto', 'Noto', sans-serif;
140 -webkit-font-smoothing: antialiased; 140 -webkit-font-smoothing: antialiased;
141 /* mixin(--paper-font-common-expensive-kerning); */ 141 /* @apply(--paper-font-common-expensive-kerning); */
142 text-rendering: optimizeLegibility; 142 text-rendering: optimizeLegibility;
143 143
144 font-size: 16px; 144 font-size: 16px;
145 font-weight: 400; 145 font-weight: 400;
146 line-height: 24px; 146 line-height: 24px;
147 } 147 };
148 148
149 --paper-font-body2: { 149 --paper-font-body2: {
150 /* mixin(--paper-font-common-base) */ 150 /* @apply(--paper-font-common-base) */
151 font-family: 'Roboto', 'Noto', sans-serif; 151 font-family: 'Roboto', 'Noto', sans-serif;
152 -webkit-font-smoothing: antialiased; 152 -webkit-font-smoothing: antialiased;
153 153
154 font-size: 14px; 154 font-size: 14px;
155 font-weight: 500; 155 font-weight: 500;
156 line-height: 24px; 156 line-height: 24px;
157 } 157 };
158 158
159 --paper-font-body1: { 159 --paper-font-body1: {
160 /* mixin(--paper-font-common-base) */ 160 /* @apply(--paper-font-common-base) */
161 font-family: 'Roboto', 'Noto', sans-serif; 161 font-family: 'Roboto', 'Noto', sans-serif;
162 -webkit-font-smoothing: antialiased; 162 -webkit-font-smoothing: antialiased;
163 163
164 font-size: 14px; 164 font-size: 14px;
165 font-weight: 400; 165 font-weight: 400;
166 line-height: 20px; 166 line-height: 20px;
167 } 167 };
168 168
169 --paper-font-caption: { 169 --paper-font-caption: {
170 /* mixin(--paper-font-common-base) */ 170 /* @apply(--paper-font-common-base) */
171 font-family: 'Roboto', 'Noto', sans-serif; 171 font-family: 'Roboto', 'Noto', sans-serif;
172 -webkit-font-smoothing: antialiased; 172 -webkit-font-smoothing: antialiased;
173 /* mixin(--paper-font-common-nowrap); */ 173 /* @apply(--paper-font-common-nowrap); */
174 white-space: nowrap; 174 white-space: nowrap;
175 overflow: hidden; 175 overflow: hidden;
176 text-overflow: ellipsis; 176 text-overflow: ellipsis;
177 177
178 font-size: 12px; 178 font-size: 12px;
179 font-weight: 400; 179 font-weight: 400;
180 letter-spacing: 0.011em; 180 letter-spacing: 0.011em;
181 line-height: 20px; 181 line-height: 20px;
182 } 182 };
183 183
184 --paper-font-menu: { 184 --paper-font-menu: {
185 /* mixin(--paper-font-common-base) */ 185 /* @apply(--paper-font-common-base) */
186 font-family: 'Roboto', 'Noto', sans-serif; 186 font-family: 'Roboto', 'Noto', sans-serif;
187 -webkit-font-smoothing: antialiased; 187 -webkit-font-smoothing: antialiased;
188 /* mixin(--paper-font-common-expensive-kerning); */ 188 /* @apply(--paper-font-common-expensive-kerning); */
189 text-rendering: optimizeLegibility; 189 text-rendering: optimizeLegibility;
190 /* mixin(--paper-font-common-nowrap); */ 190 /* @apply(--paper-font-common-nowrap); */
191 white-space: nowrap; 191 white-space: nowrap;
192 overflow: hidden; 192 overflow: hidden;
193 text-overflow: ellipsis; 193 text-overflow: ellipsis;
194 194
195 font-size: 13px; 195 font-size: 13px;
196 font-weight: 500; 196 font-weight: 500;
197 line-height: 24px; 197 line-height: 24px;
198 } 198 };
199 199
200 --paper-font-button: { 200 --paper-font-button: {
201 /* mixin(--paper-font-common-base) */ 201 /* @apply(--paper-font-common-base) */
202 font-family: 'Roboto', 'Noto', sans-serif; 202 font-family: 'Roboto', 'Noto', sans-serif;
203 -webkit-font-smoothing: antialiased; 203 -webkit-font-smoothing: antialiased;
204 /* mixin(--paper-font-common-expensive-kerning); */ 204 /* @apply(--paper-font-common-expensive-kerning); */
205 text-rendering: optimizeLegibility; 205 text-rendering: optimizeLegibility;
206 /* mixin(--paper-font-common-nowrap); */ 206 /* @apply(--paper-font-common-nowrap); */
207 white-space: nowrap; 207 white-space: nowrap;
208 overflow: hidden; 208 overflow: hidden;
209 text-overflow: ellipsis; 209 text-overflow: ellipsis;
210 210
211 font-size: 14px; 211 font-size: 14px;
212 font-weight: 500; 212 font-weight: 500;
213 letter-spacing: 0.018em; 213 letter-spacing: 0.018em;
214 line-height: 24px; 214 line-height: 24px;
215 text-transform: uppercase; 215 text-transform: uppercase;
216 } 216 };
217 217
218 --paper-font-code2: { 218 --paper-font-code2: {
219 /* mixin(--paper-font-common-code); */ 219 /* @apply(--paper-font-common-code); */
220 font-family: 'Inconsolata', 'Consolas', 'Source Code Pro', 'Monaco', 'Menl o', monospace; 220 font-family: 'Inconsolata', 'Consolas', 'Source Code Pro', 'Monaco', 'Menl o', monospace;
221 -webkit-font-smoothing: antialiased; 221 -webkit-font-smoothing: antialiased;
222 222
223 font-size: 14px; 223 font-size: 14px;
224 font-weight: 700; 224 font-weight: 700;
225 line-height: 20px; 225 line-height: 20px;
226 } 226 };
227 227
228 --paper-font-code1: { 228 --paper-font-code1: {
229 /* mixin(--paper-font-common-code); */ 229 /* @apply(--paper-font-common-code); */
230 font-family: 'Inconsolata', 'Consolas', 'Source Code Pro', 'Monaco', 'Menl o', monospace; 230 font-family: 'Inconsolata', 'Consolas', 'Source Code Pro', 'Monaco', 'Menl o', monospace;
231 -webkit-font-smoothing: antialiased; 231 -webkit-font-smoothing: antialiased;
232 232
233 font-size: 14px; 233 font-size: 14px;
234 font-weight: 500; 234 font-weight: 500;
235 line-height: 20px; 235 line-height: 20px;
236 } 236 };
237 237
238 } 238 }
239 239
240 </style> 240 </style>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698