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