chrome/browser/resources/md_history/app.vulcanized.html - Issue 2268863002: MD History: Run polymer-css-build over vulcanized output

Side by Side Diff: chrome/browser/resources/md_history/app.vulcanized.html

Issue 2268863002: MD History: Run polymer-css-build over vulcanized output (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master

Patch Set: MD History: Run polymer-css-build over vulcanized output Created 4 years, 3 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

OLD	NEW
1 <html><head><!--	1 <html><head><!--

2 @license	2 @license

3 Copyright (c) 2014 The Polymer Project Authors. All rights reserved.	3 Copyright (c) 2014 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 @license	10 @license

(...skipping 28 matching lines...) Expand all Loading...
39	39

40 </style>	40 </style>

41	41

42 </head><body><div hidden="" by-vulcanize=""><style>	42 </head><body><div hidden="" by-vulcanize=""><style>

43 /* IE 10 support for HTML5 hidden attr */	43 /* IE 10 support for HTML5 hidden attr */

44 [hidden] {	44 [hidden] {

45 display: none !important;	45 display: none !important;

46 }	46 }

47 </style>	47 </style>

48	48

49 <style is="custom-style">	49 <style is="custom-style" css-build="shadow">html {

50 :root {	50 --layout_-_display: flex;;

51	51

52 --layout: {	52 --layout-inline_-_display: inline-flex;;

53 display: -ms-flexbox;

54 display: -webkit-flex;

55 display: flex;

56 };

57	53

58 --layout-inline: {	54 --layout-horizontal_-_display: var(--layout_-_display); --layout-horizontal _-_-ms-flex-direction: row; --layout-horizontal_-_-webkit-flex-direction: row; --layout-horizontal_-_flex-direction: row;;

59 display: -ms-inline-flexbox;

60 display: -webkit-inline-flex;

61 display: inline-flex;

62 };

63	55

64 --layout-horizontal: {	56 --layout-horizontal-reverse_-_display: var(--layout_-_display); --layout-ho rizontal-reverse_-_-ms-flex-direction: row-reverse; --layout-horizontal-reverse _-_-webkit-flex-direction: row-reverse; --layout-horizontal-reverse_-_flex-dire ction: row-reverse;;

65 @apply(--layout);

66	57

67 -ms-flex-direction: row;	58 --layout-vertical_-_display: var(--layout_-_display); --layout-vertical_-_- ms-flex-direction: column; --layout-vertical_-_-webkit-flex-direction: column; --layout-vertical_-_flex-direction: column;;

68 -webkit-flex-direction: row;

69 flex-direction: row;

70 };

71	59

72 --layout-horizontal-reverse: {	60 --layout-vertical-reverse_-_display: var(--layout_-_display); --layout-vert ical-reverse_-_-ms-flex-direction: column-reverse; --layout-vertical-reverse_-_ -webkit-flex-direction: column-reverse; --layout-vertical-reverse_-_flex-direct ion: column-reverse;;

73 @apply(--layout);

74	61

75 -ms-flex-direction: row-reverse;	62 --layout-wrap_-_-ms-flex-wrap: wrap; --layout-wrap_-_-webkit-flex-wrap: wr ap; --layout-wrap_-_flex-wrap: wrap;;

76 -webkit-flex-direction: row-reverse;

77 flex-direction: row-reverse;

78 };

79	63

80 --layout-vertical: {	64 --layout-wrap-reverse_-_-ms-flex-wrap: wrap-reverse; --layout-wrap-reverse_ -_-webkit-flex-wrap: wrap-reverse; --layout-wrap-reverse_-_flex-wrap: wrap-rev erse;;

81 @apply(--layout);

82	65

83 -ms-flex-direction: column;	66 --layout-flex-auto_-_-ms-flex: 1 1 auto; --layout-flex-auto_-_-webkit-flex: 1 1 auto; --layout-flex-auto_-_flex: 1 1 auto;;

84 -webkit-flex-direction: column;

85 flex-direction: column;

86 };

87	67

88 --layout-vertical-reverse: {	68 --layout-flex-none_-_-ms-flex: none; --layout-flex-none_-_-webkit-flex: no ne; --layout-flex-none_-_flex: none;;

89 @apply(--layout);

90	69

91 -ms-flex-direction: column-reverse;	70 --layout-flex_-_-ms-flex: 1 1 0.000000001px; --layout-flex_-_-webkit-flex: 1; --layout-flex_-_flex: 1; --layout-flex_-_-webkit-flex-basis: 0.000000001px ; --layout-flex_-_flex-basis: 0.000000001px;;

92 -webkit-flex-direction: column-reverse;

93 flex-direction: column-reverse;

94 };

95	71

96 --layout-wrap: {	72 --layout-flex-2_-_-ms-flex: 2; --layout-flex-2_-_-webkit-flex: 2; --layout -flex-2_-_flex: 2;;

97 -ms-flex-wrap: wrap;

98 -webkit-flex-wrap: wrap;

99 flex-wrap: wrap;

100 };

101	73

102 --layout-wrap-reverse: {	74 --layout-flex-3_-_-ms-flex: 3; --layout-flex-3_-_-webkit-flex: 3; --layout -flex-3_-_flex: 3;;

103 -ms-flex-wrap: wrap-reverse;

104 -webkit-flex-wrap: wrap-reverse;

105 flex-wrap: wrap-reverse;

106 };

107	75

108 --layout-flex-auto: {	76 --layout-flex-4_-_-ms-flex: 4; --layout-flex-4_-_-webkit-flex: 4; --layout -flex-4_-_flex: 4;;

109 -ms-flex: 1 1 auto;

110 -webkit-flex: 1 1 auto;

111 flex: 1 1 auto;

112 };

113	77

114 --layout-flex-none: {	78 --layout-flex-5_-_-ms-flex: 5; --layout-flex-5_-_-webkit-flex: 5; --layout -flex-5_-_flex: 5;;

115 -ms-flex: none;

116 -webkit-flex: none;

117 flex: none;

118 };

119	79

120 --layout-flex: {	80 --layout-flex-6_-_-ms-flex: 6; --layout-flex-6_-_-webkit-flex: 6; --layout -flex-6_-_flex: 6;;

121 -ms-flex: 1 1 0.000000001px;

122 -webkit-flex: 1;

123 flex: 1;

124 -webkit-flex-basis: 0.000000001px;

125 flex-basis: 0.000000001px;

126 };

127	81

128 --layout-flex-2: {	82 --layout-flex-7_-_-ms-flex: 7; --layout-flex-7_-_-webkit-flex: 7; --layout -flex-7_-_flex: 7;;

129 -ms-flex: 2;

130 -webkit-flex: 2;

131 flex: 2;

132 };

133	83

134 --layout-flex-3: {	84 --layout-flex-8_-_-ms-flex: 8; --layout-flex-8_-_-webkit-flex: 8; --layout -flex-8_-_flex: 8;;

135 -ms-flex: 3;

136 -webkit-flex: 3;

137 flex: 3;

138 };

139	85

140 --layout-flex-4: {	86 --layout-flex-9_-_-ms-flex: 9; --layout-flex-9_-_-webkit-flex: 9; --layout -flex-9_-_flex: 9;;

141 -ms-flex: 4;

142 -webkit-flex: 4;

143 flex: 4;

144 };

145	87

146 --layout-flex-5: {	88 --layout-flex-10_-_-ms-flex: 10; --layout-flex-10_-_-webkit-flex: 10; --la yout-flex-10_-_flex: 10;;

147 -ms-flex: 5;

148 -webkit-flex: 5;

149 flex: 5;

150 };

151	89

152 --layout-flex-6: {	90 --layout-flex-11_-_-ms-flex: 11; --layout-flex-11_-_-webkit-flex: 11; --la yout-flex-11_-_flex: 11;;

153 -ms-flex: 6;

154 -webkit-flex: 6;

155 flex: 6;

156 };

157	91

158 --layout-flex-7: {	92 --layout-flex-12_-_-ms-flex: 12; --layout-flex-12_-_-webkit-flex: 12; --la yout-flex-12_-_flex: 12;;

159 -ms-flex: 7;

160 -webkit-flex: 7;

161 flex: 7;

162 };

163	93

164 --layout-flex-8: {	94

165 -ms-flex: 8;

166 -webkit-flex: 8;

167 flex: 8;

168 };

169	95

170 --layout-flex-9: {	96 --layout-start_-_-ms-flex-align: start; --layout-start_-_-webkit-align-item s: flex-start; --layout-start_-_align-items: flex-start;;

171 -ms-flex: 9;

172 -webkit-flex: 9;

173 flex: 9;

174 };

175	97

176 --layout-flex-10: {	98 --layout-center_-_-ms-flex-align: center; --layout-center_-_-webkit-align-i tems: center; --layout-center_-_align-items: center;;

177 -ms-flex: 10;

178 -webkit-flex: 10;

179 flex: 10;

180 };

181	99

182 --layout-flex-11: {	100 --layout-end_-_-ms-flex-align: end; --layout-end_-_-webkit-align-items: fl ex-end; --layout-end_-_align-items: flex-end;;

183 -ms-flex: 11;

184 -webkit-flex: 11;

185 flex: 11;

186 };

187	101

188 --layout-flex-12: {	102 --layout-baseline_-_-ms-flex-align: baseline; --layout-baseline_-_-webkit-a lign-items: baseline; --layout-baseline_-_align-items: baseline;;

189 -ms-flex: 12;

190 -webkit-flex: 12;

191 flex: 12;

192 };

193	103

194 /* alignment in cross axis */	104

195	105

196 --layout-start: {	106 --layout-start-justified_-_-ms-flex-pack: start; --layout-start-justified_- _-webkit-justify-content: flex-start; --layout-start-justified_-_justify-conten t: flex-start;;

197 -ms-flex-align: start;

198 -webkit-align-items: flex-start;

199 align-items: flex-start;

200 };

201	107

202 --layout-center: {	108 --layout-center-justified_-_-ms-flex-pack: center; --layout-center-justifie d_-_-webkit-justify-content: center; --layout-center-justified_-_justify-conten t: center;;

203 -ms-flex-align: center;

204 -webkit-align-items: center;

205 align-items: center;

206 };

207	109

208 --layout-end: {	110 --layout-end-justified_-_-ms-flex-pack: end; --layout-end-justified_-_-webk it-justify-content: flex-end; --layout-end-justified_-_justify-content: flex-e nd;;

209 -ms-flex-align: end;

210 -webkit-align-items: flex-end;

211 align-items: flex-end;

212 };

213	111

214 --layout-baseline: {	112 --layout-around-justified_-_-ms-flex-pack: distribute; --layout-around-just ified_-_-webkit-justify-content: space-around; --layout-around-justified_-_just ify-content: space-around;;

215 -ms-flex-align: baseline;

216 -webkit-align-items: baseline;

217 align-items: baseline;

218 };

219	113

220 /* alignment in main axis */	114 --layout-justified_-_-ms-flex-pack: justify; --layout-justified_-_-webkit-j ustify-content: space-between; --layout-justified_-_justify-content: space-bet ween;;

221	115

222 --layout-start-justified: {	116 --layout-center-center_-_-ms-flex-align: var(--layout-center_-_-ms-flex-ali gn); --layout-center-center_-_-webkit-align-items: var(--layout-center_-_-webki t-align-items); --layout-center-center_-_align-items: var(--layout-center_-_ali gn-items); --layout-center-center_-_-ms-flex-pack: var(--layout-center-justifie d_-_-ms-flex-pack); --layout-center-center_-_-webkit-justify-content: var(--lay out-center-justified_-_-webkit-justify-content); --layout-center-center_-_justif y-content: var(--layout-center-justified_-_justify-content);;

223 -ms-flex-pack: start;

224 -webkit-justify-content: flex-start;

225 justify-content: flex-start;

226 };

227	117

228 --layout-center-justified: {	118

229 -ms-flex-pack: center;

230 -webkit-justify-content: center;

231 justify-content: center;

232 };

233	119

234 --layout-end-justified: {	120 --layout-self-start_-_-ms-align-self: flex-start; --layout-self-start_-_-we bkit-align-self: flex-start; --layout-self-start_-_align-self: flex-start;;

235 -ms-flex-pack: end;

236 -webkit-justify-content: flex-end;

237 justify-content: flex-end;

238 };

239	121

240 --layout-around-justified: {	122 --layout-self-center_-_-ms-align-self: center; --layout-self-center_-_-webk it-align-self: center; --layout-self-center_-_align-self: center;;

241 -ms-flex-pack: distribute;

242 -webkit-justify-content: space-around;

243 justify-content: space-around;

244 };

245	123

246 --layout-justified: {	124 --layout-self-end_-_-ms-align-self: flex-end; --layout-self-end_-_-webkit-a lign-self: flex-end; --layout-self-end_-_align-self: flex-end;;

247 -ms-flex-pack: justify;

248 -webkit-justify-content: space-between;

249 justify-content: space-between;

250 };

251	125

252 --layout-center-center: {	126 --layout-self-stretch_-_-ms-align-self: stretch; --layout-self-stretch_-_-w ebkit-align-self: stretch; --layout-self-stretch_-_align-self: stretch;;

253 @apply(--layout-center);

254 @apply(--layout-center-justified);

255 };

256	127

257 /* self alignment */	128 --layout-self-baseline_-_-ms-align-self: baseline; --layout-self-baseline_- _-webkit-align-self: baseline; --layout-self-baseline_-_align-self: baseline;;

258	129

259 --layout-self-start: {	130

260 -ms-align-self: flex-start;

261 -webkit-align-self: flex-start;

262 align-self: flex-start;

263 };

264	131

265 --layout-self-center: {	132 --layout-start-aligned_-_-ms-flex-line-pack: start; --layout-start-aligned_ -_-ms-align-content: flex-start; --layout-start-aligned_-_-webkit-align-content : flex-start; --layout-start-aligned_-_align-content: flex-start;;

266 -ms-align-self: center;

267 -webkit-align-self: center;

268 align-self: center;

269 };

270	133

271 --layout-self-end: {	134 --layout-end-aligned_-_-ms-flex-line-pack: end; --layout-end-aligned_-_-ms- align-content: flex-end; --layout-end-aligned_-_-webkit-align-content: flex-en d; --layout-end-aligned_-_align-content: flex-end;;

272 -ms-align-self: flex-end;

273 -webkit-align-self: flex-end;

274 align-self: flex-end;

275 };

276	135

277 --layout-self-stretch: {	136 --layout-center-aligned_-_-ms-flex-line-pack: center; --layout-center-align ed_-_-ms-align-content: center; --layout-center-aligned_-_-webkit-align-content : center; --layout-center-aligned_-_align-content: center;;

278 -ms-align-self: stretch;

279 -webkit-align-self: stretch;

280 align-self: stretch;

281 };

282	137

283 --layout-self-baseline: {	138 --layout-between-aligned_-_-ms-flex-line-pack: justify; --layout-between-al igned_-_-ms-align-content: space-between; --layout-between-aligned_-_-webkit-al ign-content: space-between; --layout-between-aligned_-_align-content: space-be tween;;

284 -ms-align-self: baseline;

285 -webkit-align-self: baseline;

286 align-self: baseline;

287 };

288	139

289 /* multi-line alignment in main axis */	140 --layout-around-aligned_-_-ms-flex-line-pack: distribute; --layout-around-a ligned_-_-ms-align-content: space-around; --layout-around-aligned_-_-webkit-ali gn-content: space-around; --layout-around-aligned_-_align-content: space-aroun d;;

290	141

291 --layout-start-aligned: {	142

292 -ms-flex-line-pack: start; /* IE10 */

293 -ms-align-content: flex-start;

294 -webkit-align-content: flex-start;

295 align-content: flex-start;

296 };

297	143

298 --layout-end-aligned: {	144 --layout-block_-_display: block;;

299 -ms-flex-line-pack: end; /* IE10 */

300 -ms-align-content: flex-end;

301 -webkit-align-content: flex-end;

302 align-content: flex-end;

303 };

304	145

305 --layout-center-aligned: {	146 --layout-invisible_-_visibility: hidden !important;;

306 -ms-flex-line-pack: center; /* IE10 */

307 -ms-align-content: center;

308 -webkit-align-content: center;

309 align-content: center;

310 };

311	147

312 --layout-between-aligned: {	148 --layout-relative_-_position: relative;;

313 -ms-flex-line-pack: justify; /* IE10 */

314 -ms-align-content: space-between;

315 -webkit-align-content: space-between;

316 align-content: space-between;

317 };

318	149

319 --layout-around-aligned: {	150 --layout-fit_-_position: absolute; --layout-fit_-_top: 0; --layout-fit_-_r ight: 0; --layout-fit_-_bottom: 0; --layout-fit_-_left: 0;;

320 -ms-flex-line-pack: distribute; /* IE10 */

321 -ms-align-content: space-around;

322 -webkit-align-content: space-around;

323 align-content: space-around;

324 };

325	151

326 /*******************************	152 --layout-scroll_-_-webkit-overflow-scrolling: touch; --layout-scroll_-_over flow: auto;;

327 Other Layout

328 *******************************/

329	153

330 --layout-block: {	154 --layout-fullbleed_-_margin: 0; --layout-fullbleed_-_height: 100vh;;

331 display: block;

332 };

333	155

334 --layout-invisible: {	156

335 visibility: hidden !important;

336 };

337	157

338 --layout-relative: {	158 --layout-fixed-top_-_position: fixed; --layout-fixed-top_-_top: 0; --layou t-fixed-top_-_left: 0; --layout-fixed-top_-_right: 0;;

339 position: relative;

340 };

341	159

342 --layout-fit: {	160 --layout-fixed-right_-_position: fixed; --layout-fixed-right_-_top: 0; --l ayout-fixed-right_-_right: 0; --layout-fixed-right_-_bottom: 0;;

343 position: absolute;

344 top: 0;

345 right: 0;

346 bottom: 0;

347 left: 0;

348 };

349	161

350 --layout-scroll: {	162 --layout-fixed-bottom_-_position: fixed; --layout-fixed-bottom_-_right: 0; --layout-fixed-bottom_-_bottom: 0; --layout-fixed-bottom_-_left: 0;;

351 -webkit-overflow-scrolling: touch;

352 overflow: auto;

353 };

354	163

355 --layout-fullbleed: {	164 --layout-fixed-left_-_position: fixed; --layout-fixed-left_-_top: 0; --lay out-fixed-left_-_bottom: 0; --layout-fixed-left_-_left: 0;;

356 margin: 0;	165 }

357 height: 100vh;

358 };

359

360 /* fixed position */

361

362 --layout-fixed-top: {

363 position: fixed;

364 top: 0;

365 left: 0;

366 right: 0;

367 };

368

369 --layout-fixed-right: {

370 position: fixed;

371 top: 0;

372 right: 0;

373 bottom: 0;

374 };

375

376 --layout-fixed-bottom: {

377 position: fixed;

378 right: 0;

379 bottom: 0;

380 left: 0;

381 };

382

383 --layout-fixed-left: {

384 position: fixed;

385 top: 0;

386 bottom: 0;

387 left: 0;

388 };

389

390 }

391	166

392 </style>	167 </style>

393	168

394	169

395 <dom-module id="app-drawer" assetpath="chrome://resources/polymer/v1_0/app-layou t/app-drawer/">	170 <dom-module id="app-drawer" assetpath="chrome://resources/polymer/v1_0/app-layou t/app-drawer/" css-build="shadow">

396 <template>	171 <template>

397 <style>	172 <style scope="app-drawer">:host {

398 :host {	173 position: fixed;

399 position: fixed;

400 top: -120px;	174 top: -120px;

401 right: 0;	175 right: 0;

402 bottom: -120px;	176 bottom: -120px;

403 left: 0;	177 left: 0;

404	178

405 visibility: hidden;	179 visibility: hidden;

406	180

407 transition: visibility 0.2s ease;	181 transition: visibility 0.2s ease;

408 }	182 }

409	183

410 :host([opened]) {	184 :host([opened]) {

411 visibility: visible;	185 visibility: visible;

412 }	186 }

413	187

414 :host([persistent]) {	188 :host([persistent]) {

415 width: var(--app-drawer-width, 256px);	189 width: var(--app-drawer-width, 256px);

416 }	190 }

417	191

418 :host([persistent][position=left]) {	192 :host([persistent][position=left]) {

419 right: auto;	193 right: auto;

420 }	194 }

421	195

422 :host([persistent][position=right]) {	196 :host([persistent][position=right]) {

423 left: auto;	197 left: auto;

424 }	198 }

425	199

426 #contentContainer {	200 #contentContainer {

427 position: absolute;	201 position: absolute;

428 top: 0;	202 top: 0;

429 bottom: 0;	203 bottom: 0;

430 left: 0;	204 left: 0;

431	205

432 width: var(--app-drawer-width, 256px);	206 width: var(--app-drawer-width, 256px);

433 padding: 120px 0;	207 padding: 120px 0;

434	208

435 transition: 0.2s ease;	209 transition: 0.2s ease;

436 transition-property: -webkit-transform;	210 transition-property: -webkit-transform;

437 transition-property: transform;	211 transition-property: transform;

438 -webkit-transform: translate3d(-100%, 0, 0);	212 -webkit-transform: translate3d(-100%, 0, 0);

439 transform: translate3d(-100%, 0, 0);	213 transform: translate3d(-100%, 0, 0);

440	214

441 background-color: #FFF;	215 background-color: #FFF;

442	216

443 @apply(--app-drawer-content-container);	217 ;

444 }	218 }

445	219

446 :host([position=right]) > #contentContainer {	220 :host([position=right]) > #contentContainer {

447 right: 0;	221 right: 0;

448 left: auto;	222 left: auto;

449	223

450 -webkit-transform: translate3d(100%, 0, 0);	224 -webkit-transform: translate3d(100%, 0, 0);

451 transform: translate3d(100%, 0, 0);	225 transform: translate3d(100%, 0, 0);

452 }	226 }

453	227

454 :host([swipe-open]) > #contentContainer::after {	228 :host([swipe-open]) > #contentContainer::after {

455 position: fixed;	229 position: fixed;

456 top: 0;	230 top: 0;

457 bottom: 0;	231 bottom: 0;

458 left: 100%;	232 left: 100%;

459	233

460 visibility: visible;	234 visibility: visible;

461	235

462 width: 20px;	236 width: 20px;

463	237

464 content: '';	238 content: '';

465 }	239 }

466	240

467 :host([swipe-open][position=right]) > #contentContainer::after {	241 :host([swipe-open][position=right]) > #contentContainer::after {

468 right: 100%;	242 right: 100%;

469 left: auto;	243 left: auto;

470 }	244 }

471	245

472 :host([opened]) > #contentContainer {	246 :host([opened]) > #contentContainer {

473 -webkit-transform: translate3d(0, 0, 0);	247 -webkit-transform: translate3d(0, 0, 0);

474 transform: translate3d(0, 0, 0);	248 transform: translate3d(0, 0, 0);

475 }	249 }

476	250

477 #scrim {	251 #scrim {

478 position: absolute;	252 position: absolute;

479 top: 0;	253 top: 0;

480 right: 0;	254 right: 0;

481 bottom: 0;	255 bottom: 0;

482 left: 0;	256 left: 0;

483	257

484 transition: opacity 0.2s ease;	258 transition: opacity 0.2s ease;

485 -webkit-transform: translateZ(0);	259 -webkit-transform: translateZ(0);

486 transform: translateZ(0);	260 transform: translateZ(0);

487	261

488 opacity: 0;	262 opacity: 0;

489 background: var(--app-drawer-scrim-background, rgba(0, 0, 0, 0.5));	263 background: var(--app-drawer-scrim-background, rgba(0, 0, 0, 0.5));

490 }	264 }

491	265

492 :host([opened]) > #scrim {	266 :host([opened]) > #scrim {

493 opacity: 1;	267 opacity: 1;

494 }	268 }

495	269

496 :host([opened][persistent]) > #scrim {	270 :host([opened][persistent]) > #scrim {

497 visibility: hidden;	271 visibility: hidden;

498 /**	272

499 * NOTE(keanulee): Keep both opacity: 0 and visibility: hidden to preven t the

500 * scrim from showing when toggling between closed and opened/persistent .

501 */

502	273

503 opacity: 0;	274 opacity: 0;

504 }	275 }

505 </style>	276

	277 </style>

506	278

507 <div id="scrim" on-tap="close"></div>	279 <div id="scrim" on-tap="close"></div>

508	280

509 <div id="contentContainer">	281 <div id="contentContainer">

510 <content></content>	282 <content></content>

511 </div>	283 </div>

512 </template>	284 </template>

513	285

514 </dom-module>	286 </dom-module>

515 <dom-module id="app-location" assetpath="chrome://resources/polymer/v1_0/app-rou te/">	287 <dom-module id="app-location" assetpath="chrome://resources/polymer/v1_0/app-rou te/" css-build="shadow">

516 <template>	288 <template>

517 <iron-location path="{{__path}}" query="{{__query}}" hash="{{__hash}}" url-s pace-regex="{{urlSpaceRegex}}">	289 <iron-location path="{{__path}}" query="{{__query}}" hash="{{__hash}}" url-s pace-regex="{{urlSpaceRegex}}">

518 </iron-location>	290 </iron-location>

519 <iron-query-params params-string="{{__query}}" params-object="{{queryParams} }">	291 <iron-query-params params-string="{{__query}}" params-object="{{queryParams} }">

520 </iron-query-params>	292 </iron-query-params>

521 </template>	293 </template>

522 </dom-module>	294 </dom-module>

523 <dom-module id="iron-pages" assetpath="chrome://resources/polymer/v1_0/iron-page s/">	295 <dom-module id="iron-pages" assetpath="chrome://resources/polymer/v1_0/iron-page s/" css-build="shadow">

524	296

525 <template>	297 <template>

526 <style>	298 <style scope="iron-pages">:host {

527 :host {	299 display: block;

528 display: block;	300 }

529 }

530	301

531 :host > ::content > :not(.iron-selected) {	302 :host > ::content > :not(.iron-selected) {

532 display: none !important;	303 display: none !important;

533 }	304 }

534 </style>	305

	306 </style>

535	307

536 <content></content>	308 <content></content>

537 </template>	309 </template>

538	310

539 </dom-module>	311 </dom-module>

540 <dom-module id="paper-ripple" assetpath="chrome://resources/polymer/v1_0/paper-r ipple/">	312 <dom-module id="paper-ripple" assetpath="chrome://resources/polymer/v1_0/paper-r ipple/" css-build="shadow">

541	313

542 <template>	314 <template>

543 <style>	315 <style scope="paper-ripple">:host {

544 :host {	316 display: block;

545 display: block;

546 position: absolute;	317 position: absolute;

547 border-radius: inherit;	318 border-radius: inherit;

548 overflow: hidden;	319 overflow: hidden;

549 top: 0;	320 top: 0;

550 left: 0;	321 left: 0;

551 right: 0;	322 right: 0;

552 bottom: 0;	323 bottom: 0;

553	324

554 /* See PolymerElements/paper-behaviors/issues/34. On non-Chrome browsers ,	325

555 * creating a node (with a position:absolute) in the middle of an event

556 * handler "interrupts" that event handler (which happens when the

557 * ripple is created on demand) */

558 pointer-events: none;	326 pointer-events: none;

559 }	327 }

560	328

561 :host([animating]) {	329 :host([animating]) {

562 /* This resolves a rendering issue in Chrome (as of 40) where the	330 -webkit-transform: translate(0, 0);

563 ripple is not properly clipped by its parent (which may have	331 transform: translate3d(0, 0, 0);

564 rounded corners). See: http://jsbin.com/temexa/4	332 }

565	333

566 Note: We only apply this style conditionally. Otherwise, the browser	334 #background, #waves, .wave-container, .wave {

567 will create a new compositing layer for every ripple element on the	335 pointer-events: none;

568 page, and that would be bad. */

569 -webkit-transform: translate(0, 0);

570 transform: translate3d(0, 0, 0);

571 }

572

573 #background,

574 #waves,

575 .wave-container,

576 .wave {

577 pointer-events: none;

578 position: absolute;	336 position: absolute;

579 top: 0;	337 top: 0;

580 left: 0;	338 left: 0;

581 width: 100%;	339 width: 100%;

582 height: 100%;	340 height: 100%;

583 }	341 }

584	342

585 #background,	343 #background, .wave {

586 .wave {	344 opacity: 0;

587 opacity: 0;	345 }

588 }

589	346

590 #waves,	347 #waves, .wave {

591 .wave {	348 overflow: hidden;

592 overflow: hidden;	349 }

593 }

594	350

595 .wave-container,	351 .wave-container, .wave {

596 .wave {	352 border-radius: 50%;

597 border-radius: 50%;	353 }

598 }

599	354

600 :host(.circle) #background,	355 :host(.circle) #background, :host(.circle) #waves {

601 :host(.circle) #waves {	356 border-radius: 50%;

602 border-radius: 50%;	357 }

603 }

604	358

605 :host(.circle) .wave-container {	359 :host(.circle) .wave-container {

606 overflow: hidden;	360 overflow: hidden;

607 }	361 }

608 </style>	362

	363 </style>

609	364

610 <div id="background"></div>	365 <div id="background"></div>

611 <div id="waves"></div>	366 <div id="waves"></div>

612 </template>	367 </template>

613 </dom-module>	368 </dom-module>

614 <style is="custom-style">	369 <style is="custom-style" css-build="shadow">html {

	370 --shadow-transition_-_transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);;

615	371

616 :root {	372 --shadow-none_-_box-shadow: none;;

617	373

618 --shadow-transition: {	374

619 transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);

620 };

621	375

622 --shadow-none: {	376 --shadow-elevation-2dp_-_box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14),

623 box-shadow: none;	377 0 1px 5px 0 rgba(0, 0, 0, 0.12),

624 };	378 0 3px 1px -2px rgba(0, 0, 0, 0.2);;

625	379

626 /* from http://codepen.io/shyndman/pen/c5394ddf2e8b2a5c9185904b57421cdb */	380 --shadow-elevation-3dp_-_box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.14),

	381 0 1px 8px 0 rgba(0, 0, 0, 0.12),

	382 0 3px 3px -2px rgba(0, 0, 0, 0.4);;

627	383

628 --shadow-elevation-2dp: {	384 --shadow-elevation-4dp_-_box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14),

629 box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14),	385 0 1px 10px 0 rgba(0, 0, 0, 0.12),

630 0 1px 5px 0 rgba(0, 0, 0, 0.12),	386 0 2px 4px -1px rgba(0, 0, 0, 0.4);;

631 0 3px 1px -2px rgba(0, 0, 0, 0.2);

632 };

633	387

634 --shadow-elevation-3dp: {	388 --shadow-elevation-6dp_-_box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.14),

635 box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.14),	389 0 1px 18px 0 rgba(0, 0, 0, 0.12),

636 0 1px 8px 0 rgba(0, 0, 0, 0.12),	390 0 3px 5px -1px rgba(0, 0, 0, 0.4);;

637 0 3px 3px -2px rgba(0, 0, 0, 0.4);

638 };

639	391

640 --shadow-elevation-4dp: {	392 --shadow-elevation-8dp_-_box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14),

641 box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14),	393 0 3px 14px 2px rgba(0, 0, 0, 0.12),

642 0 1px 10px 0 rgba(0, 0, 0, 0.12),	394 0 5px 5px -3px rgba(0, 0, 0, 0.4);;

643 0 2px 4px -1px rgba(0, 0, 0, 0.4);

644 };

645	395

646 --shadow-elevation-6dp: {	396 --shadow-elevation-12dp_-_box-shadow: 0 12px 16px 1px rgba(0, 0, 0, 0.14),

647 box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.14),	397 0 4px 22px 3px rgba(0, 0, 0, 0.12),

648 0 1px 18px 0 rgba(0, 0, 0, 0.12),	398 0 6px 7px -4px rgba(0, 0, 0, 0.4);;

649 0 3px 5px -1px rgba(0, 0, 0, 0.4);

650 };

651	399

652 --shadow-elevation-8dp: {	400 --shadow-elevation-16dp_-_box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14),

653 box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14),

654 0 3px 14px 2px rgba(0, 0, 0, 0.12),

655 0 5px 5px -3px rgba(0, 0, 0, 0.4);

656 };

657

658 --shadow-elevation-12dp: {

659 box-shadow: 0 12px 16px 1px rgba(0, 0, 0, 0.14),

660 0 4px 22px 3px rgba(0, 0, 0, 0.12),

661 0 6px 7px -4px rgba(0, 0, 0, 0.4);

662 };

663

664 --shadow-elevation-16dp: {

665 box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14),

666 0 6px 30px 5px rgba(0, 0, 0, 0.12),	401 0 6px 30px 5px rgba(0, 0, 0, 0.12),

667 0 8px 10px -5px rgba(0, 0, 0, 0.4);	402 0 8px 10px -5px rgba(0, 0, 0, 0.4);;

668 };	403 }

669

670 }

671	404

672 </style>	405 </style>

673 <dom-module id="paper-material-shared-styles" assetpath="chrome://resources/poly mer/v1_0/paper-material/">	406 <dom-module id="paper-material-shared-styles" assetpath="chrome://resources/poly mer/v1_0/paper-material/" css-build="shadow">

674 <template>	407 <template>

675 <style>	408 <style scope="paper-material-shared-styles">:host {

676 :host {	409 display: block;

677 display: block;

678 position: relative;	410 position: relative;

679 }	411 }

680	412

681 :host([elevation="1"]) {	413 :host([elevation="1"]) {

682 @apply(--shadow-elevation-2dp);	414 box-shadow: var(--shadow-elevation-2dp_-_box-shadow);

683 }	415 }

684	416

685 :host([elevation="2"]) {	417 :host([elevation="2"]) {

686 @apply(--shadow-elevation-4dp);	418 box-shadow: var(--shadow-elevation-4dp_-_box-shadow);

687 }	419 }

688	420

689 :host([elevation="3"]) {	421 :host([elevation="3"]) {

690 @apply(--shadow-elevation-6dp);	422 box-shadow: var(--shadow-elevation-6dp_-_box-shadow);

691 }	423 }

692	424

693 :host([elevation="4"]) {	425 :host([elevation="4"]) {

694 @apply(--shadow-elevation-8dp);	426 box-shadow: var(--shadow-elevation-8dp_-_box-shadow);

695 }	427 }

696	428

697 :host([elevation="5"]) {	429 :host([elevation="5"]) {

698 @apply(--shadow-elevation-16dp);	430 box-shadow: var(--shadow-elevation-16dp_-_box-shadow);

699 }	431 }

700 </style>	432

	433 </style>

701 </template>	434 </template>

702 </dom-module>	435 </dom-module>

703	436

704	437

705 <dom-module id="paper-button" assetpath="chrome://resources/polymer/v1_0/paper-b utton/">	438 <dom-module id="paper-button" assetpath="chrome://resources/polymer/v1_0/paper-b utton/" css-build="shadow">

706 <template strip-whitespace="">	439 <template strip-whitespace="">

707 <style include="paper-material-shared-styles">	440 <style scope="paper-button">:host {

708 :host {	441 display: block;

709 @apply(--layout-inline);	442 position: relative;

710 @apply(--layout-center-center);	443 }

	444

	445 :host([elevation="1"]) {

	446 box-shadow: var(--shadow-elevation-2dp_-_box-shadow);

	447 }

	448

	449 :host([elevation="2"]) {

	450 box-shadow: var(--shadow-elevation-4dp_-_box-shadow);

	451 }

	452

	453 :host([elevation="3"]) {

	454 box-shadow: var(--shadow-elevation-6dp_-_box-shadow);

	455 }

	456

	457 :host([elevation="4"]) {

	458 box-shadow: var(--shadow-elevation-8dp_-_box-shadow);

	459 }

	460

	461 :host([elevation="5"]) {

	462 box-shadow: var(--shadow-elevation-16dp_-_box-shadow);

	463 }

	464

	465 :host {

	466 display: var(--layout-inline_-_display);

	467 -ms-flex-align: var(--layout-center-center_-_-ms-flex-align); -webkit-al ign-items: var(--layout-center-center_-_-webkit-align-items); align-items: var(- -layout-center-center_-_align-items); -ms-flex-pack: var(--layout-center-center_ -_-ms-flex-pack); -webkit-justify-content: var(--layout-center-center_-_-webkit- justify-content); justify-content: var(--layout-center-center_-_justify-content) ;

711 position: relative;	468 position: relative;

712 box-sizing: border-box;	469 box-sizing: border-box;

713 min-width: 5.14em;	470 min-width: 5.14em;

714 margin: 0 0.29em;	471 margin: 0 0.29em;

715 background: transparent;	472 background: transparent;

716 -webkit-tap-highlight-color: rgba(0, 0, 0, 0);	473 -webkit-tap-highlight-color: rgba(0, 0, 0, 0);

717 -webkit-tap-highlight-color: transparent;	474 -webkit-tap-highlight-color: transparent;

718 font: inherit;	475 font: inherit;

719 text-transform: uppercase;	476 text-transform: uppercase;

720 outline-width: 0;	477 outline-width: 0;

721 border-radius: 3px;	478 border-radius: 3px;

722 -moz-user-select: none;	479 -moz-user-select: none;

723 -ms-user-select: none;	480 -ms-user-select: none;

724 -webkit-user-select: none;	481 -webkit-user-select: none;

725 user-select: none;	482 user-select: none;

726 cursor: pointer;	483 cursor: pointer;

727 z-index: 0;	484 z-index: 0;

728 padding: 0.7em 0.57em;	485 padding: 0.7em 0.57em;

729	486

730 @apply(--paper-font-common-base);	487 font-family: var(--paper-font-common-base_-_font-family); -webkit-font-s moothing: var(--paper-font-common-base_-_-webkit-font-smoothing);

731 @apply(--paper-button);	488 ;

732 }	489 }

733	490

734 :host([hidden]) {	491 :host([hidden]) {

735 display: none !important;	492 display: none !important;

736 }	493 }

737	494

738 :host([raised].keyboard-focus) {	495 :host([raised].keyboard-focus) {

739 font-weight: bold;	496 font-weight: bold;

740 @apply(--paper-button-raised-keyboard-focus);	497 ;

741 }	498 }

742	499

743 :host(:not([raised]).keyboard-focus) {	500 :host(:not([raised]).keyboard-focus) {

744 font-weight: bold;	501 font-weight: bold;

745 @apply(--paper-button-flat-keyboard-focus);	502 background: var(--paper-button-flat-keyboard-focus_-_background);

746 }	503 }

747	504

748 :host([disabled]) {	505 :host([disabled]) {

749 background: #eaeaea;	506 background: #eaeaea;

750 color: #a8a8a8;	507 color: #a8a8a8;

751 cursor: auto;	508 cursor: auto;

752 pointer-events: none;	509 pointer-events: none;

753	510

754 @apply(--paper-button-disabled);	511 ;

755 }	512 }

756	513

757 :host([animated]) {	514 :host([animated]) {

758 @apply(--shadow-transition);	515 transition: var(--shadow-transition_-_transition);

759 }	516 }

760	517

761 paper-ripple {	518 paper-ripple {

762 color: var(--paper-button-ink-color);	519 color: var(--paper-button-ink-color);

763 }	520 }

764 </style>	521

	522 </style>

765	523

766 <content></content>	524 <content></content>

767 </template>	525 </template>

768	526

769 </dom-module>	527 </dom-module>

770 <dom-module id="iron-icon" assetpath="chrome://resources/polymer/v1_0/iron-icon/ ">	528 <dom-module id="iron-icon" assetpath="chrome://resources/polymer/v1_0/iron-icon/ " css-build="shadow">

771 <template>	529 <template>

772 <style>	530 <style scope="iron-icon">:host {

773 :host {	531 display: var(--layout-inline_-_display);

774 @apply(--layout-inline);	532 -ms-flex-align: var(--layout-center-center_-_-ms-flex-align); -webkit-al ign-items: var(--layout-center-center_-_-webkit-align-items); align-items: var(- -layout-center-center_-_align-items); -ms-flex-pack: var(--layout-center-center_ -_-ms-flex-pack); -webkit-justify-content: var(--layout-center-center_-_-webkit- justify-content); justify-content: var(--layout-center-center_-_justify-content) ;

775 @apply(--layout-center-center);

776 position: relative;	533 position: relative;

777	534

778 vertical-align: middle;	535 vertical-align: middle;

779	536

780 fill: var(--iron-icon-fill-color, currentcolor);	537 fill: var(--iron-icon-fill-color, currentcolor);

781 stroke: var(--iron-icon-stroke-color, none);	538 stroke: var(--iron-icon-stroke-color, none);

782	539

783 width: var(--iron-icon-width, 24px);	540 width: var(--iron-icon-width, 24px);

784 height: var(--iron-icon-height, 24px);	541 height: var(--iron-icon-height, 24px);

785 }	542 }

786 </style>	543

	544 </style>

787 </template>	545 </template>

788	546

789 </dom-module>	547 </dom-module>

790 <style is="custom-style">	548 <style is="custom-style" css-build="shadow">html {

791	549 --google-red-100: #f4c7c3;

792 :root {

793

794 /* Material Design color palette for Google products */

795

796 --google-red-100: #f4c7c3;

797 --google-red-300: #e67c73;	550 --google-red-300: #e67c73;

798 --google-red-500: #db4437;	551 --google-red-500: #db4437;

799 --google-red-700: #c53929;	552 --google-red-700: #c53929;

800	553

801 --google-blue-100: #c6dafc;	554 --google-blue-100: #c6dafc;

802 --google-blue-300: #7baaf7;	555 --google-blue-300: #7baaf7;

803 --google-blue-500: #4285f4;	556 --google-blue-500: #4285f4;

804 --google-blue-700: #3367d6;	557 --google-blue-700: #3367d6;

805	558

806 --google-green-100: #b7e1cd;	559 --google-green-100: #b7e1cd;

807 --google-green-300: #57bb8a;	560 --google-green-300: #57bb8a;

808 --google-green-500: #0f9d58;	561 --google-green-500: #0f9d58;

809 --google-green-700: #0b8043;	562 --google-green-700: #0b8043;

810	563

811 --google-yellow-100: #fce8b2;	564 --google-yellow-100: #fce8b2;

812 --google-yellow-300: #f7cb4d;	565 --google-yellow-300: #f7cb4d;

813 --google-yellow-500: #f4b400;	566 --google-yellow-500: #f4b400;

814 --google-yellow-700: #f09300;	567 --google-yellow-700: #f09300;

815	568

816 --google-grey-100: #f5f5f5;	569 --google-grey-100: #f5f5f5;

817 --google-grey-300: #e0e0e0;	570 --google-grey-300: #e0e0e0;

818 --google-grey-500: #9e9e9e;	571 --google-grey-500: #9e9e9e;

819 --google-grey-700: #616161;	572 --google-grey-700: #616161;

820	573

821 /* Material Design color palette from online spec document */	574

822	575

823 --paper-red-50: #ffebee;	576 --paper-red-50: #ffebee;

824 --paper-red-100: #ffcdd2;	577 --paper-red-100: #ffcdd2;

825 --paper-red-200: #ef9a9a;	578 --paper-red-200: #ef9a9a;

826 --paper-red-300: #e57373;	579 --paper-red-300: #e57373;

827 --paper-red-400: #ef5350;	580 --paper-red-400: #ef5350;

828 --paper-red-500: #f44336;	581 --paper-red-500: #f44336;

829 --paper-red-600: #e53935;	582 --paper-red-600: #e53935;

830 --paper-red-700: #d32f2f;	583 --paper-red-700: #d32f2f;

831 --paper-red-800: #c62828;	584 --paper-red-800: #c62828;

(...skipping 254 matching lines...) Expand 10 before \| Expand all \| Expand 10 after Loading...
1086 --paper-blue-grey-100: #cfd8dc;	839 --paper-blue-grey-100: #cfd8dc;

1087 --paper-blue-grey-200: #b0bec5;	840 --paper-blue-grey-200: #b0bec5;

1088 --paper-blue-grey-300: #90a4ae;	841 --paper-blue-grey-300: #90a4ae;

1089 --paper-blue-grey-400: #78909c;	842 --paper-blue-grey-400: #78909c;

1090 --paper-blue-grey-500: #607d8b;	843 --paper-blue-grey-500: #607d8b;

1091 --paper-blue-grey-600: #546e7a;	844 --paper-blue-grey-600: #546e7a;

1092 --paper-blue-grey-700: #455a64;	845 --paper-blue-grey-700: #455a64;

1093 --paper-blue-grey-800: #37474f;	846 --paper-blue-grey-800: #37474f;

1094 --paper-blue-grey-900: #263238;	847 --paper-blue-grey-900: #263238;

1095	848

1096 /* opacity for dark text on a light background */	849

1097 --dark-divider-opacity: 0.12;	850 --dark-divider-opacity: 0.12;

1098 --dark-disabled-opacity: 0.38; /* or hint text or icon */	851 --dark-disabled-opacity: 0.38;

1099 --dark-secondary-opacity: 0.54;	852 --dark-secondary-opacity: 0.54;

1100 --dark-primary-opacity: 0.87;	853 --dark-primary-opacity: 0.87;

1101	854

1102 /* opacity for light text on a dark background */	855

1103 --light-divider-opacity: 0.12;	856 --light-divider-opacity: 0.12;

1104 --light-disabled-opacity: 0.3; /* or hint text or icon */	857 --light-disabled-opacity: 0.3;

1105 --light-secondary-opacity: 0.7;	858 --light-secondary-opacity: 0.7;

1106 --light-primary-opacity: 1.0;	859 --light-primary-opacity: 1.0;

1107	860 }

1108 }

1109	861

1110 </style>	862 </style>

1111	863

1112	864

1113 <style is="custom-style">	865 <style is="custom-style" css-build="shadow">html {

1114	866 --primary-text-color: var(--light-theme-text-color);

1115 :root {

1116 /*

1117 * You can use these generic variables in your elements for easy theming.

1118 * For example, if all your elements use `--primary-text-color` as its main

1119 * color, then switching from a light to a dark theme is just a matter of

1120 * changing the value of `--primary-text-color` in your application.

1121 */

1122 --primary-text-color: var(--light-theme-text-color);

1123 --primary-background-color: var(--light-theme-background-color);	867 --primary-background-color: var(--light-theme-background-color);

1124 --secondary-text-color: var(--light-theme-secondary-color);	868 --secondary-text-color: var(--light-theme-secondary-color);

1125 --disabled-text-color: var(--light-theme-disabled-color);	869 --disabled-text-color: var(--light-theme-disabled-color);

1126 --divider-color: var(--light-theme-divider-color);	870 --divider-color: var(--light-theme-divider-color);

1127 --error-color: var(--paper-deep-orange-a700);	871 --error-color: var(--paper-deep-orange-a700);

1128	872

1129 /*	873

1130 * Primary and accent colors. Also see color.html for more colors.

1131 */

1132 --primary-color: var(--paper-indigo-500);	874 --primary-color: var(--paper-indigo-500);

1133 --light-primary-color: var(--paper-indigo-100);	875 --light-primary-color: var(--paper-indigo-100);

1134 --dark-primary-color: var(--paper-indigo-700);	876 --dark-primary-color: var(--paper-indigo-700);

1135	877

1136 --accent-color: var(--paper-pink-a200);	878 --accent-color: var(--paper-pink-a200);

1137 --light-accent-color: var(--paper-pink-a100);	879 --light-accent-color: var(--paper-pink-a100);

1138 --dark-accent-color: var(--paper-pink-a400);	880 --dark-accent-color: var(--paper-pink-a400);

1139	881

1140	882

1141 /*	883

1142 * Material Design Light background theme

1143 */

1144 --light-theme-background-color: #ffffff;	884 --light-theme-background-color: #ffffff;

1145 --light-theme-base-color: #000000;	885 --light-theme-base-color: #000000;

1146 --light-theme-text-color: var(--paper-grey-900);	886 --light-theme-text-color: var(--paper-grey-900);

1147 --light-theme-secondary-color: #737373; /* for secondary text and icons */	887 --light-theme-secondary-color: #737373;

1148 --light-theme-disabled-color: #9b9b9b; /* disabled/hint text */	888 --light-theme-disabled-color: #9b9b9b;

1149 --light-theme-divider-color: #dbdbdb;	889 --light-theme-divider-color: #dbdbdb;

1150	890

1151 /*	891

1152 * Material Design Dark background theme

1153 */

1154 --dark-theme-background-color: var(--paper-grey-900);	892 --dark-theme-background-color: var(--paper-grey-900);

1155 --dark-theme-base-color: #ffffff;	893 --dark-theme-base-color: #ffffff;

1156 --dark-theme-text-color: #ffffff;	894 --dark-theme-text-color: #ffffff;

1157 --dark-theme-secondary-color: #bcbcbc; /* for secondary text and icons */	895 --dark-theme-secondary-color: #bcbcbc;

1158 --dark-theme-disabled-color: #646464; /* disabled/hint text */	896 --dark-theme-disabled-color: #646464;

1159 --dark-theme-divider-color: #3c3c3c;	897 --dark-theme-divider-color: #3c3c3c;

1160	898

1161 /*	899

1162 * Deprecated values because of their confusing names.

1163 */

1164 --text-primary-color: var(--dark-theme-text-color);	900 --text-primary-color: var(--dark-theme-text-color);

1165 --default-primary-color: var(--primary-color);	901 --default-primary-color: var(--primary-color);

1166	902 }

1167 }

1168	903

1169 </style>	904 </style>

1170	905

1171	906

1172 <dom-module id="paper-icon-button" assetpath="chrome://resources/polymer/v1_0/pa per-icon-button/">	907 <dom-module id="paper-icon-button" assetpath="chrome://resources/polymer/v1_0/pa per-icon-button/" css-build="shadow">

1173 <template strip-whitespace="">	908 <template strip-whitespace="">

1174 <style>	909 <style scope="paper-icon-button">:host {

1175 :host {	910 display: inline-block;

1176 display: inline-block;

1177 position: relative;	911 position: relative;

1178 padding: 8px;	912 padding: 8px;

1179 outline: none;	913 outline: none;

1180 -webkit-user-select: none;	914 -webkit-user-select: none;

1181 -moz-user-select: none;	915 -moz-user-select: none;

1182 -ms-user-select: none;	916 -ms-user-select: none;

1183 user-select: none;	917 user-select: none;

1184 cursor: pointer;	918 cursor: pointer;

1185 z-index: 0;	919 z-index: 0;

1186 line-height: 1;	920 line-height: 1;

1187	921

1188 width: 40px;	922 width: 40px;

1189 height: 40px;	923 height: 40px;

1190	924

1191 /* NOTE: Both values are needed, since some phones require the value to be `transparent`. */	925

1192 -webkit-tap-highlight-color: rgba(0, 0, 0, 0);	926 -webkit-tap-highlight-color: rgba(0, 0, 0, 0);

1193 -webkit-tap-highlight-color: transparent;	927 -webkit-tap-highlight-color: transparent;

1194	928

1195 /* Because of polymer/2558, this style has lower specificity than * */	929

1196 box-sizing: border-box !important;	930 box-sizing: border-box !important;

1197	931

1198 @apply(--paper-icon-button);	932 height: var(--paper-icon-button_-_height, 40px); width: var(--paper-icon -button_-_width, 40px);

1199 }	933 }

1200	934

1201 :host #ink {	935 :host #ink {

1202 color: var(--paper-icon-button-ink-color, --primary-text-color);	936 color: var(--paper-icon-button-ink-color,var(--primary-text-color));;

1203 opacity: 0.6;	937 opacity: 0.6;

1204 }	938 }

1205	939

1206 :host([disabled]) {	940 :host([disabled]) {

1207 color: var(--paper-icon-button-disabled-text, --disabled-text-color);	941 color: var(--paper-icon-button-disabled-text,var(--disabled-text-color));;

1208 pointer-events: none;	942 pointer-events: none;

1209 cursor: auto;	943 cursor: auto;

1210	944

1211 @apply(--paper-icon-button-disabled);	945 ;

1212 }	946 }

1213	947

1214 :host(:hover) {	948 :host(:hover) {

1215 @apply(--paper-icon-button-hover);	949 ;

1216 }	950 }

1217	951

1218 iron-icon {	952 iron-icon {

1219 --iron-icon-width: 100%;	953 --iron-icon-width: 100%;

1220 --iron-icon-height: 100%;	954 --iron-icon-height: 100%;

1221 }	955 }

1222 </style>	956

	957 </style>

1223	958

1224 <iron-icon id="icon" src="[[src]]" icon="[[icon]]" alt$="[[alt]]"></iron-ico n>	959 <iron-icon id="icon" src="[[src]]" icon="[[icon]]" alt$="[[alt]]"></iron-ico n>

1225 </template>	960 </template>

1226	961

1227 </dom-module>	962 </dom-module>

1228 <dom-module id="paper-tab" assetpath="chrome://resources/polymer/v1_0/paper-tabs /">	963 <dom-module id="paper-tab" assetpath="chrome://resources/polymer/v1_0/paper-tabs /" css-build="shadow">

1229 <template>	964 <template>

1230 <style>	965 <style scope="paper-tab">:host {

1231 :host {	966 display: var(--layout-inline_-_display);

1232 @apply(--layout-inline);	967 -ms-flex-align: var(--layout-center_-_-ms-flex-align); -webkit-align-ite ms: var(--layout-center_-_-webkit-align-items); align-items: var(--layout-center _-_align-items);

1233 @apply(--layout-center);	968 -ms-flex-pack: var(--layout-center-justified_-_-ms-flex-pack); -webkit-j ustify-content: var(--layout-center-justified_-_-webkit-justify-content); justif y-content: var(--layout-center-justified_-_justify-content);

1234 @apply(--layout-center-justified);	969 -ms-flex: var(--layout-flex-auto_-_-ms-flex); -webkit-flex: var(--layout -flex-auto_-_-webkit-flex); flex: var(--layout-flex-auto_-_flex);

1235 @apply(--layout-flex-auto);

1236	970

1237 position: relative;	971 position: relative;

1238 padding: 0 12px;	972 padding: 0 12px;

1239 overflow: hidden;	973 overflow: hidden;

1240 cursor: pointer;	974 cursor: pointer;

1241 vertical-align: middle;	975 vertical-align: middle;

1242	976

1243 @apply(--paper-font-common-base);	977 font-family: var(--paper-font-common-base_-_font-family); -webkit-font-s moothing: var(--paper-font-common-base_-_-webkit-font-smoothing);

1244 @apply(--paper-tab);	978 ;

1245 }	979 }

1246	980

1247 :host(:focus) {	981 :host(:focus) {

1248 outline: none;	982 outline: none;

1249 }	983 }

1250	984

1251 :host([link]) {	985 :host([link]) {

1252 padding: 0;	986 padding: 0;

1253 }	987 }

1254	988

1255 .tab-content {	989 .tab-content {

1256 height: 100%;	990 height: 100%;

1257 transform: translateZ(0);	991 transform: translateZ(0);

1258 -webkit-transform: translateZ(0);	992 -webkit-transform: translateZ(0);

1259 transition: opacity 0.1s cubic-bezier(0.4, 0.0, 1, 1);	993 transition: opacity 0.1s cubic-bezier(0.4, 0.0, 1, 1);

1260 @apply(--layout-horizontal);	994 display: var(--layout-horizontal_-_display); -ms-flex-direction: var(--l ayout-horizontal_-_-ms-flex-direction); -webkit-flex-direction: var(--layout-hor izontal_-_-webkit-flex-direction); flex-direction: var(--layout-horizontal_-_fle x-direction);

1261 @apply(--layout-center-center);	995 -ms-flex-align: var(--layout-center-center_-_-ms-flex-align); -webkit-al ign-items: var(--layout-center-center_-_-webkit-align-items); align-items: var(- -layout-center-center_-_align-items); -ms-flex-pack: var(--layout-center-center_ -_-ms-flex-pack); -webkit-justify-content: var(--layout-center-center_-_-webkit- justify-content); justify-content: var(--layout-center-center_-_justify-content) ;

1262 @apply(--layout-flex-auto);	996 -ms-flex: var(--layout-flex-auto_-_-ms-flex); -webkit-flex: var(--layout -flex-auto_-_-webkit-flex); flex: var(--layout-flex-auto_-_flex);

1263 @apply(--paper-tab-content);	997 ;

1264 }	998 }

1265	999

1266 :host(:not(.iron-selected)) > .tab-content {	1000 :host(:not(.iron-selected)) > .tab-content {

1267 opacity: 0.8;	1001 opacity: 0.8;

1268	1002

1269 @apply(--paper-tab-content-unselected);	1003 ;

1270 }	1004 }

1271	1005

1272 :host(:focus) .tab-content {	1006 :host(:focus) .tab-content {

1273 opacity: 1;	1007 opacity: 1;

1274 font-weight: 700;	1008 font-weight: 700;

1275 }	1009 }

1276	1010

1277 paper-ripple {	1011 paper-ripple {

1278 color: var(--paper-tab-ink, --paper-yellow-a100);	1012 color: var(--paper-tab-ink,var(--paper-yellow-a100));;

1279 }	1013 }

1280	1014

1281 .tab-content > ::content > a {	1015 .tab-content > ::content > a {

1282 @apply(--layout-flex-auto);	1016 -ms-flex: var(--layout-flex-auto_-_-ms-flex); -webkit-flex: var(--layout-flex- auto_-_-webkit-flex); flex: var(--layout-flex-auto_-_flex);

1283	1017

1284 height: 100%;	1018 height: 100%;

1285 }	1019 }

1286 </style>	1020

	1021 </style>

1287	1022

1288 <div class="tab-content">	1023 <div class="tab-content">

1289 <content></content>	1024 <content></content>

1290 </div>	1025 </div>

1291 </template>	1026 </template>

1292	1027

1293 </dom-module>	1028 </dom-module>

1294 <iron-iconset-svg name="paper-tabs" size="24">	1029 <iron-iconset-svg name="paper-tabs" size="24">

1295 <svg><defs>	1030 <svg><defs>

1296 <g id="chevron-left"><path d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z"></p ath></g>	1031 <g id="chevron-left"><path d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z"></p ath></g>

1297 <g id="chevron-right"><path d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z">< /path></g>	1032 <g id="chevron-right"><path d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z">< /path></g>

1298 </defs></svg>	1033 </defs></svg>

1299 </iron-iconset-svg>	1034 </iron-iconset-svg>

1300	1035

1301	1036

1302 <dom-module id="paper-tabs" assetpath="chrome://resources/polymer/v1_0/paper-tab s/">	1037 <dom-module id="paper-tabs" assetpath="chrome://resources/polymer/v1_0/paper-tab s/" css-build="shadow">

1303 <template>	1038 <template>

1304 <style>	1039 <style scope="paper-tabs">:host {

1305 :host {	1040 display: var(--layout_-_display);

1306 @apply(--layout);	1041 -ms-flex-align: var(--layout-center_-_-ms-flex-align); -webkit-align-ite ms: var(--layout-center_-_-webkit-align-items); align-items: var(--layout-center _-_align-items);

1307 @apply(--layout-center);

1308	1042

1309 height: 48px;	1043 height: 48px;

1310 font-size: 14px;	1044 font-size: 14px;

1311 font-weight: 500;	1045 font-weight: 500;

1312 overflow: hidden;	1046 overflow: hidden;

1313 -moz-user-select: none;	1047 -moz-user-select: none;

1314 -ms-user-select: none;	1048 -ms-user-select: none;

1315 -webkit-user-select: none;	1049 -webkit-user-select: none;

1316 user-select: none;	1050 user-select: none;

1317	1051

1318 /* NOTE: Both values are needed, since some phones require the value to be `transparent`. */	1052

1319 -webkit-tap-highlight-color: rgba(0, 0, 0, 0);	1053 -webkit-tap-highlight-color: rgba(0, 0, 0, 0);

1320 -webkit-tap-highlight-color: transparent;	1054 -webkit-tap-highlight-color: transparent;

1321	1055

1322 @apply(--paper-tabs);	1056 ;

1323 }	1057 }

1324	1058

1325 :host-context([dir=rtl]) {	1059 :host-context([dir=rtl]) {

1326 @apply(--layout-horizontal-reverse);	1060 display: var(--layout-horizontal-reverse_-_display); -ms-flex-direction: var(- -layout-horizontal-reverse_-_-ms-flex-direction); -webkit-flex-direction: var(-- layout-horizontal-reverse_-_-webkit-flex-direction); flex-direction: var(--layou t-horizontal-reverse_-_flex-direction);

1327 }	1061 }

1328	1062

1329 #tabsContainer {	1063 #tabsContainer {

1330 position: relative;	1064 position: relative;

1331 height: 100%;	1065 height: 100%;

1332 white-space: nowrap;	1066 white-space: nowrap;

1333 overflow: hidden;	1067 overflow: hidden;

1334 @apply(--layout-flex-auto);	1068 -ms-flex: var(--layout-flex-auto_-_-ms-flex); -webkit-flex: var(--layout -flex-auto_-_-webkit-flex); flex: var(--layout-flex-auto_-_flex);

1335 }	1069 }

1336	1070

1337 #tabsContent {	1071 #tabsContent {

1338 height: 100%;	1072 height: 100%;

1339 -moz-flex-basis: auto;	1073 -moz-flex-basis: auto;

1340 -ms-flex-basis: auto;	1074 -ms-flex-basis: auto;

1341 flex-basis: auto;	1075 flex-basis: auto;

1342 }	1076 }

1343	1077

1344 #tabsContent.scrollable {	1078 #tabsContent.scrollable {

1345 position: absolute;	1079 position: absolute;

1346 white-space: nowrap;	1080 white-space: nowrap;

1347 }	1081 }

1348	1082

1349 #tabsContent:not(.scrollable),	1083 #tabsContent:not(.scrollable), #tabsContent.scrollable.fit-container {

1350 #tabsContent.scrollable.fit-container {	1084 display: var(--layout-horizontal_-_display); -ms-flex-direction: var(--layout- horizontal_-_-ms-flex-direction); -webkit-flex-direction: var(--layout-horizonta l_-_-webkit-flex-direction); flex-direction: var(--layout-horizontal_-_flex-dire ction);

1351 @apply(--layout-horizontal);	1085 }

1352 }

1353	1086

1354 #tabsContent.scrollable.fit-container {	1087 #tabsContent.scrollable.fit-container {

1355 min-width: 100%;	1088 min-width: 100%;

1356 }	1089 }

1357	1090

1358 #tabsContent.scrollable.fit-container > ::content > * {	1091 #tabsContent.scrollable.fit-container > ::content > * {

1359 /* IE - prevent tabs from compressing when they should scroll. */	1092 -ms-flex: 1 0 auto;

1360 -ms-flex: 1 0 auto;

1361 -webkit-flex: 1 0 auto;	1093 -webkit-flex: 1 0 auto;

1362 flex: 1 0 auto;	1094 flex: 1 0 auto;

1363 }	1095 }

1364	1096

1365 .hidden {	1097 .hidden {

1366 display: none;	1098 display: none;

1367 }	1099 }

1368	1100

1369 .not-visible {	1101 .not-visible {

1370 opacity: 0;	1102 opacity: 0;

1371 cursor: default;	1103 cursor: default;

1372 }	1104 }

1373	1105

1374 paper-icon-button {	1106 paper-icon-button {

1375 width: 48px;	1107 width: 48px;

1376 height: 48px;	1108 height: 48px;

1377 padding: 12px;	1109 padding: 12px;

1378 margin: 0 4px;	1110 margin: 0 4px;

1379 }	1111 }

1380	1112

1381 #selectionBar {	1113 #selectionBar {

1382 position: absolute;	1114 position: absolute;

1383 height: 2px;	1115 height: 2px;

1384 bottom: 0;	1116 bottom: 0;

1385 left: 0;	1117 left: 0;

1386 right: 0;	1118 right: 0;

1387 background-color: var(--paper-tabs-selection-bar-color, --paper-yellow-a 100);	1119 background-color: var(--paper-tabs-selection-bar-color,var(--paper-yello w-a100));;

1388 -webkit-transform: scale(0);	1120 -webkit-transform: scale(0);

1389 transform: scale(0);	1121 transform: scale(0);

1390 -webkit-transform-origin: left center;	1122 -webkit-transform-origin: left center;

1391 transform-origin: left center;	1123 transform-origin: left center;

1392 transition: -webkit-transform;	1124 transition: -webkit-transform;

1393 transition: transform;	1125 transition: transform;

1394	1126

1395 @apply(--paper-tabs-selection-bar);	1127 ;

1396 }	1128 }

1397	1129

1398 #selectionBar.align-bottom {	1130 #selectionBar.align-bottom {

1399 top: 0;	1131 top: 0;

1400 bottom: auto;	1132 bottom: auto;

1401 }	1133 }

1402	1134

1403 #selectionBar.expand {	1135 #selectionBar.expand {

1404 transition-duration: 0.15s;	1136 transition-duration: 0.15s;

1405 transition-timing-function: cubic-bezier(0.4, 0.0, 1, 1);	1137 transition-timing-function: cubic-bezier(0.4, 0.0, 1, 1);

1406 }	1138 }

1407	1139

1408 #selectionBar.contract {	1140 #selectionBar.contract {

1409 transition-duration: 0.18s;	1141 transition-duration: 0.18s;

1410 transition-timing-function: cubic-bezier(0.0, 0.0, 0.2, 1);	1142 transition-timing-function: cubic-bezier(0.0, 0.0, 0.2, 1);

1411 }	1143 }

1412	1144

1413 #tabsContent > ::content > *:not(#selectionBar) {	1145 #tabsContent > ::content > *:not(#selectionBar) {

1414 height: 100%;	1146 height: 100%;

1415 }	1147 }

1416 </style>	1148

	1149 </style>

1417	1150

1418 <paper-icon-button icon="paper-tabs:chevron-left" class$="[[_computeScrollBu ttonClass(_leftHidden, scrollable, hideScrollButtons)]]" on-up="_onScrollButtonU p" on-down="_onLeftScrollButtonDown" tabindex="-1"></paper-icon-button>	1151 <paper-icon-button icon="paper-tabs:chevron-left" class$="[[_computeScrollBu ttonClass(_leftHidden, scrollable, hideScrollButtons)]]" on-up="_onScrollButtonU p" on-down="_onLeftScrollButtonDown" tabindex="-1"></paper-icon-button>

1419	1152

1420 <div id="tabsContainer" on-track="_scroll" on-down="_down">	1153 <div id="tabsContainer" on-track="_scroll" on-down="_down">

1421 <div id="tabsContent" class$="[[_computeTabsContentClass(scrollable, fitCo ntainer)]]">	1154 <div id="tabsContent" class$="[[_computeTabsContentClass(scrollable, fitCo ntainer)]]">

1422 <div id="selectionBar" class$="[[_computeSelectionBarClass(noBar, alignB ottom)]]" on-transitionend="_onBarTransitionEnd"></div>	1155 <div id="selectionBar" class$="[[_computeSelectionBarClass(noBar, alignB ottom)]]" on-transitionend="_onBarTransitionEnd"></div>

1423 <content select="*"></content>	1156 <content select="*"></content>

1424 </div>	1157 </div>

1425 </div>	1158 </div>

1426	1159

(...skipping 28 matching lines...) Expand all Loading...
1455 <g id="print"><path d="M19 8H5c-1.66 0-3 1.34-3 3v6h4v4h12v-4h4v-6c0-1.66- 1.34-3-3-3zm-3 11H8v-5h8v5zm3-7c-.55 0-1-.45-1-1s.45-1 1-1 1 .45 1 1-.45 1-1 1zm -1-9H6v4h12V3z"></path></g>	1188 <g id="print"><path d="M19 8H5c-1.66 0-3 1.34-3 3v6h4v4h12v-4h4v-6c0-1.66- 1.34-3-3-3zm-3 11H8v-5h8v5zm3-7c-.55 0-1-.45-1-1s.45-1 1-1 1 .45 1 1-.45 1-1 1zm -1-9H6v4h12V3z"></path></g>

1456 <g id="search"><path d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27 .28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"></path></g>	1189 <g id="search"><path d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27 .28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"></path></g>

1457 <g id="settings"><path d="M19.43 12.98c.04-.32.07-.64.07-.98s-.03-.66-.07- .98l2.11-1.65c.19-.15.24-.42.12-.64l-2-3.46c-.12-.22-.39-.3-.61-.22l-2.49 1c-.52 -.4-1.08-.73-1.69-.98l-.38-2.65C14.46 2.18 14.25 2 14 2h-4c-.25 0-.46.18-.49.42l -.38 2.65c-.61.25-1.17.59-1.69.98l-2.49-1c-.23-.09-.49 0-.61.22l-2 3.46c-.13.22- .07.49.12.64l2.11 1.65c-.04.32-.07.65-.07.98s.03.66.07.98l-2.11 1.65c-.19.15-.24 .42-.12.64l2 3.46c.12.22.39.3.61.22l2.49-1c.52.4 1.08.73 1.69.98l.38 2.65c.03.24 .24.42.49.42h4c.25 0 .46-.18.49-.42l.38-2.65c.61-.25 1.17-.59 1.69-.98l2.49 1c.2 3.09.49 0 .61-.22l2-3.46c.12-.22.07-.49-.12-.64l-2.11-1.65zM12 15.5c-1.93 0-3.5- 1.57-3.5-3.5s1.57-3.5 3.5-3.5 3.5 1.57 3.5 3.5-1.57 3.5-3.5 3.5z"></path></g>	1190 <g id="settings"><path d="M19.43 12.98c.04-.32.07-.64.07-.98s-.03-.66-.07- .98l2.11-1.65c.19-.15.24-.42.12-.64l-2-3.46c-.12-.22-.39-.3-.61-.22l-2.49 1c-.52 -.4-1.08-.73-1.69-.98l-.38-2.65C14.46 2.18 14.25 2 14 2h-4c-.25 0-.46.18-.49.42l -.38 2.65c-.61.25-1.17.59-1.69.98l-2.49-1c-.23-.09-.49 0-.61.22l-2 3.46c-.13.22- .07.49.12.64l2.11 1.65c-.04.32-.07.65-.07.98s.03.66.07.98l-2.11 1.65c-.19.15-.24 .42-.12.64l2 3.46c.12.22.39.3.61.22l2.49-1c.52.4 1.08.73 1.69.98l.38 2.65c.03.24 .24.42.49.42h4c.25 0 .46-.18.49-.42l.38-2.65c.61-.25 1.17-.59 1.69-.98l2.49 1c.2 3.09.49 0 .61-.22l2-3.46c.12-.22.07-.49-.12-.64l-2.11-1.65zM12 15.5c-1.93 0-3.5- 1.57-3.5-3.5s1.57-3.5 3.5-3.5 3.5 1.57 3.5 3.5-1.57 3.5-3.5 3.5z"></path></g>

1458 <g id="star"><path d="M12 17.27L18.18 21l-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21z"></path></g>	1191 <g id="star"><path d="M12 17.27L18.18 21l-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21z"></path></g>

1459 <g id="warning"><path d="M1 21h22L12 2 1 21zm12-3h-2v-2h2v2zm0-4h-2v-4h2v4 z"></path></g>	1192 <g id="warning"><path d="M1 21h22L12 2 1 21zm12-3h-2v-2h2v2zm0-4h-2v-4h2v4 z"></path></g>

1460 </defs>	1193 </defs>

1461 </svg>	1194 </svg>

1462 </iron-iconset-svg>	1195 </iron-iconset-svg>

1463	1196

1464	1197

1465 <dom-module id="iron-a11y-announcer" assetpath="chrome://resources/polymer/v1_0/ iron-a11y-announcer/">	1198 <dom-module id="iron-a11y-announcer" assetpath="chrome://resources/polymer/v1_0/ iron-a11y-announcer/" css-build="shadow">

1466 <template>	1199 <template>

1467 <style>	1200 <style scope="iron-a11y-announcer">:host {

1468 :host {	1201 display: inline-block;

1469 display: inline-block;

1470 position: fixed;	1202 position: fixed;

1471 clip: rect(0px,0px,0px,0px);	1203 clip: rect(0px,0px,0px,0px);

1472 }	1204 }

1473 </style>	1205

	1206 </style>

1474 <div aria-live$="[[mode]]">[[_text]]</div>	1207 <div aria-live$="[[mode]]">[[_text]]</div>

1475 </template>	1208 </template>

1476	1209

1477 </dom-module>	1210 </dom-module>

1478 <style>	1211 <style>

1479 /* Copyright 2015 The Chromium Authors. All rights reserved.	1212 /* Copyright 2015 The Chromium Authors. All rights reserved.

1480 * Use of this source code is governed by a BSD-style license that can be	1213 * Use of this source code is governed by a BSD-style license that can be

1481 * found in the LICENSE file. */	1214 * found in the LICENSE file. */

1482	1215

1483 <if expr="not chromeos">	1216 <if expr="not chromeos">

(...skipping 16 matching lines...) Expand all Loading...
1500 @font-face {	1233 @font-face {

1501 font-family: 'Roboto';	1234 font-family: 'Roboto';

1502 font-style: normal;	1235 font-style: normal;

1503 font-weight: 700;	1236 font-weight: 700;

1504 src: local('Roboto Bold'), local('Roboto-Bold'),	1237 src: local('Roboto Bold'), local('Roboto-Bold'),

1505 url("chrome://resources/roboto/roboto-bold.woff2") format('woff2');	1238 url("chrome://resources/roboto/roboto-bold.woff2") format('woff2');

1506 }	1239 }

1507 </if>	1240 </if>

1508	1241

1509 </style>	1242 </style>

1510 <style is="custom-style">	1243 <style is="custom-style" css-build="shadow">html {

	1244 --paper-font-common-base_-_font-family: 'Roboto', 'Noto', sans-serif; --paper -font-common-base_-_-webkit-font-smoothing: antialiased;;

1511	1245

1512 :root {	1246 --paper-font-common-code_-_font-family: 'Roboto Mono', 'Consolas', 'Menlo', monospace; --paper-font-common-code_-_-webkit-font-smoothing: antialiased;;

1513	1247

1514 /* Shared Styles */	1248 --paper-font-common-expensive-kerning_-_text-rendering: optimizeLegibility; ;

1515 --paper-font-common-base: {

1516 font-family: 'Roboto', 'Noto', sans-serif;

1517 -webkit-font-smoothing: antialiased;

1518 };

1519	1249

1520 --paper-font-common-code: {	1250 --paper-font-common-nowrap_-_white-space: nowrap; --paper-font-common-nowra p_-_overflow: hidden; --paper-font-common-nowrap_-_text-overflow: ellipsis;;

1521 font-family: 'Roboto Mono', 'Consolas', 'Menlo', monospace;

1522 -webkit-font-smoothing: antialiased;

1523 };

1524	1251

1525 --paper-font-common-expensive-kerning: {	1252

1526 text-rendering: optimizeLegibility;

1527 };

1528	1253

1529 --paper-font-common-nowrap: {	1254 --paper-font-display4_-_font-family: var(--paper-font-common-base_-_font-fa mily); --paper-font-display4_-_-webkit-font-smoothing: var(--paper-font-common- base_-_-webkit-font-smoothing); --paper-font-display4_-_white-space: var(--pape r-font-common-nowrap_-_white-space); --paper-font-display4_-_overflow: var(--pa per-font-common-nowrap_-_overflow); --paper-font-display4_-_text-overflow: var( --paper-font-common-nowrap_-_text-overflow); --paper-font-display4_-_font-size: 112px; --paper-font-display4_-_font-weight: 300; --paper-font-display4_-_lette r-spacing: -.044em; --paper-font-display4_-_line-height: 120px;;

1530 white-space: nowrap;

1531 overflow: hidden;

1532 text-overflow: ellipsis;

1533 };

1534	1255

1535 /* Material Font Styles */	1256 --paper-font-display3_-_font-family: var(--paper-font-common-base_-_font-fa mily); --paper-font-display3_-_-webkit-font-smoothing: var(--paper-font-common- base_-_-webkit-font-smoothing); --paper-font-display3_-_white-space: var(--pape r-font-common-nowrap_-_white-space); --paper-font-display3_-_overflow: var(--pa per-font-common-nowrap_-_overflow); --paper-font-display3_-_text-overflow: var( --paper-font-common-nowrap_-_text-overflow); --paper-font-display3_-_font-size: 56px; --paper-font-display3_-_font-weight: 400; --paper-font-display3_-_letter -spacing: -.026em; --paper-font-display3_-_line-height: 60px;;

1536	1257

1537 --paper-font-display4: {	1258 --paper-font-display2_-_font-family: var(--paper-font-common-base_-_font-fa mily); --paper-font-display2_-_-webkit-font-smoothing: var(--paper-font-common- base_-_-webkit-font-smoothing); --paper-font-display2_-_font-size: 45px; --pape r-font-display2_-_font-weight: 400; --paper-font-display2_-_letter-spacing: -. 018em; --paper-font-display2_-_line-height: 48px;;

1538 @apply(--paper-font-common-base);

1539 @apply(--paper-font-common-nowrap);

1540	1259

1541 font-size: 112px;	1260 --paper-font-display1_-_font-family: var(--paper-font-common-base_-_font-fa mily); --paper-font-display1_-_-webkit-font-smoothing: var(--paper-font-common- base_-_-webkit-font-smoothing); --paper-font-display1_-_font-size: 34px; --pape r-font-display1_-_font-weight: 400; --paper-font-display1_-_letter-spacing: -. 01em; --paper-font-display1_-_line-height: 40px;;

1542 font-weight: 300;

1543 letter-spacing: -.044em;

1544 line-height: 120px;

1545 };

1546	1261

1547 --paper-font-display3: {	1262 --paper-font-headline_-_font-family: var(--paper-font-common-base_-_font-fa mily); --paper-font-headline_-_-webkit-font-smoothing: var(--paper-font-common- base_-_-webkit-font-smoothing); --paper-font-headline_-_font-size: 24px; --pape r-font-headline_-_font-weight: 400; --paper-font-headline_-_letter-spacing: -. 012em; --paper-font-headline_-_line-height: 32px;;

1548 @apply(--paper-font-common-base);

1549 @apply(--paper-font-common-nowrap);

1550	1263

1551 font-size: 56px;	1264 --paper-font-title_-_font-family: var(--paper-font-common-base_-_font-famil y); --paper-font-title_-_-webkit-font-smoothing: var(--paper-font-common-base_- _-webkit-font-smoothing); --paper-font-title_-_white-space: var(--paper-font-co mmon-nowrap_-_white-space); --paper-font-title_-_overflow: var(--paper-font-com mon-nowrap_-_overflow); --paper-font-title_-_text-overflow: var(--paper-font-co mmon-nowrap_-_text-overflow); --paper-font-title_-_font-size: 20px; --paper-fon t-title_-_font-weight: 500; --paper-font-title_-_line-height: 28px;;

1552 font-weight: 400;

1553 letter-spacing: -.026em;

1554 line-height: 60px;

1555 };

1556	1265

1557 --paper-font-display2: {	1266 --paper-font-subhead_-_font-family: var(--paper-font-common-base_-_font-fam ily); --paper-font-subhead_-_-webkit-font-smoothing: var(--paper-font-common-ba se_-_-webkit-font-smoothing); --paper-font-subhead_-_font-size: 16px; --paper-f ont-subhead_-_font-weight: 400; --paper-font-subhead_-_line-height: 24px;;

1558 @apply(--paper-font-common-base);

1559	1267

1560 font-size: 45px;	1268 --paper-font-body2_-_font-family: var(--paper-font-common-base_-_font-famil y); --paper-font-body2_-_-webkit-font-smoothing: var(--paper-font-common-base_- _-webkit-font-smoothing); --paper-font-body2_-_font-size: 14px; --paper-font-bo dy2_-_font-weight: 500; --paper-font-body2_-_line-height: 24px;;

1561 font-weight: 400;

1562 letter-spacing: -.018em;

1563 line-height: 48px;

1564 };

1565	1269

1566 --paper-font-display1: {	1270 --paper-font-body1_-_font-family: var(--paper-font-common-base_-_font-famil y); --paper-font-body1_-_-webkit-font-smoothing: var(--paper-font-common-base_- _-webkit-font-smoothing); --paper-font-body1_-_font-size: 14px; --paper-font-bo dy1_-_font-weight: 400; --paper-font-body1_-_line-height: 20px;;

1567 @apply(--paper-font-common-base);

1568	1271

1569 font-size: 34px;	1272 --paper-font-caption_-_font-family: var(--paper-font-common-base_-_font-fam ily); --paper-font-caption_-_-webkit-font-smoothing: var(--paper-font-common-ba se_-_-webkit-font-smoothing); --paper-font-caption_-_white-space: var(--paper-f ont-common-nowrap_-_white-space); --paper-font-caption_-_overflow: var(--paper- font-common-nowrap_-_overflow); --paper-font-caption_-_text-overflow: var(--pap er-font-common-nowrap_-_text-overflow); --paper-font-caption_-_font-size: 12px; --paper-font-caption_-_font-weight: 400; --paper-font-caption_-_letter-spacing : 0.011em; --paper-font-caption_-_line-height: 20px;;

1570 font-weight: 400;

1571 letter-spacing: -.01em;

1572 line-height: 40px;

1573 };

1574	1273

1575 --paper-font-headline: {	1274 --paper-font-menu_-_font-family: var(--paper-font-common-base_-_font-family ); --paper-font-menu_-_-webkit-font-smoothing: var(--paper-font-common-base_-_- webkit-font-smoothing); --paper-font-menu_-_white-space: var(--paper-font-commo n-nowrap_-_white-space); --paper-font-menu_-_overflow: var(--paper-font-common- nowrap_-_overflow); --paper-font-menu_-_text-overflow: var(--paper-font-common- nowrap_-_text-overflow); --paper-font-menu_-_font-size: 13px; --paper-font-menu _-_font-weight: 500; --paper-font-menu_-_line-height: 24px;;

1576 @apply(--paper-font-common-base);

1577	1275

1578 font-size: 24px;	1276 --paper-font-button_-_font-family: var(--paper-font-common-base_-_font-fami ly); --paper-font-button_-_-webkit-font-smoothing: var(--paper-font-common-base _-_-webkit-font-smoothing); --paper-font-button_-_white-space: var(--paper-font -common-nowrap_-_white-space); --paper-font-button_-_overflow: var(--paper-font -common-nowrap_-_overflow); --paper-font-button_-_text-overflow: var(--paper-fo nt-common-nowrap_-_text-overflow); --paper-font-button_-_font-size: 14px; --pap er-font-button_-_font-weight: 500; --paper-font-button_-_letter-spacing: 0.018 em; --paper-font-button_-_line-height: 24px; --paper-font-button_-_text-transfo rm: uppercase;;

1579 font-weight: 400;

1580 letter-spacing: -.012em;

1581 line-height: 32px;

1582 };

1583	1277

1584 --paper-font-title: {	1278 --paper-font-code2_-_font-family: var(--paper-font-common-code_-_font-famil y); --paper-font-code2_-_-webkit-font-smoothing: var(--paper-font-common-code_- _-webkit-font-smoothing); --paper-font-code2_-_font-size: 14px; --paper-font-co de2_-_font-weight: 700; --paper-font-code2_-_line-height: 20px;;

1585 @apply(--paper-font-common-base);

1586 @apply(--paper-font-common-nowrap);

1587	1279

1588 font-size: 20px;	1280 --paper-font-code1_-_font-family: var(--paper-font-common-code_-_font-famil y); --paper-font-code1_-_-webkit-font-smoothing: var(--paper-font-common-code_- _-webkit-font-smoothing); --paper-font-code1_-_font-size: 14px; --paper-font-co de1_-_font-weight: 500; --paper-font-code1_-_line-height: 20px;;

1589 font-weight: 500;	1281 }

1590 line-height: 28px;

1591 };

1592

1593 --paper-font-subhead: {

1594 @apply(--paper-font-common-base);

1595

1596 font-size: 16px;

1597 font-weight: 400;

1598 line-height: 24px;

1599 };

1600

1601 --paper-font-body2: {

1602 @apply(--paper-font-common-base);

1603

1604 font-size: 14px;

1605 font-weight: 500;

1606 line-height: 24px;

1607 };

1608

1609 --paper-font-body1: {

1610 @apply(--paper-font-common-base);

1611

1612 font-size: 14px;

1613 font-weight: 400;

1614 line-height: 20px;

1615 };

1616

1617 --paper-font-caption: {

1618 @apply(--paper-font-common-base);

1619 @apply(--paper-font-common-nowrap);

1620

1621 font-size: 12px;

1622 font-weight: 400;

1623 letter-spacing: 0.011em;

1624 line-height: 20px;

1625 };

1626

1627 --paper-font-menu: {

1628 @apply(--paper-font-common-base);

1629 @apply(--paper-font-common-nowrap);

1630

1631 font-size: 13px;

1632 font-weight: 500;

1633 line-height: 24px;

1634 };

1635

1636 --paper-font-button: {

1637 @apply(--paper-font-common-base);

1638 @apply(--paper-font-common-nowrap);

1639

1640 font-size: 14px;

1641 font-weight: 500;

1642 letter-spacing: 0.018em;

1643 line-height: 24px;

1644 text-transform: uppercase;

1645 };

1646

1647 --paper-font-code2: {

1648 @apply(--paper-font-common-code);

1649

1650 font-size: 14px;

1651 font-weight: 700;

1652 line-height: 20px;

1653 };

1654

1655 --paper-font-code1: {

1656 @apply(--paper-font-common-code);

1657

1658 font-size: 14px;

1659 font-weight: 500;

1660 line-height: 20px;

1661 };

1662

1663 }

1664	1282

1665 </style>	1283 </style>

1666	1284

1667	1285

1668 <dom-module id="paper-input-container" assetpath="chrome://resources/polymer/v1_ 0/paper-input/">	1286 <dom-module id="paper-input-container" assetpath="chrome://resources/polymer/v1_ 0/paper-input/" css-build="shadow">

1669 <template>	1287 <template>

1670 <style>	1288 <style scope="paper-input-container">:host {

1671 :host {	1289 display: block;

1672 display: block;

1673 padding: 8px 0;	1290 padding: 8px 0;

1674	1291

1675 @apply(--paper-input-container);	1292 ;

1676 }	1293 }

1677	1294

1678 :host([inline]) {	1295 :host([inline]) {

1679 display: inline-block;	1296 display: inline-block;

1680 }	1297 }

1681	1298

1682 :host([disabled]) {	1299 :host([disabled]) {

1683 pointer-events: none;	1300 pointer-events: none;

1684 opacity: 0.33;	1301 opacity: 0.33;

1685	1302

1686 @apply(--paper-input-container-disabled);	1303 ;

1687 }	1304 }

1688	1305

1689 :host([hidden]) {	1306 :host([hidden]) {

1690 display: none !important;	1307 display: none !important;

1691 }	1308 }

1692	1309

1693 .floated-label-placeholder {	1310 .floated-label-placeholder {

1694 @apply(--paper-font-caption);	1311 font-family: var(--paper-font-caption_-_font-family); -webkit-font-smoothing: var(--paper-font-caption_-_-webkit-font-smoothing); white-space: var(--paper-fon t-caption_-_white-space); overflow: var(--paper-font-caption_-_overflow); text-o verflow: var(--paper-font-caption_-_text-overflow); font-size: var(--paper-font- caption_-_font-size); font-weight: var(--paper-font-caption_-_font-weight); lett er-spacing: var(--paper-font-caption_-_letter-spacing); line-height: var(--paper -font-caption_-_line-height);

1695 }	1312 }

1696	1313

1697 .underline {	1314 .underline {

1698 position: relative;	1315 position: relative;

1699 }	1316 }

1700	1317

1701 .focused-line {	1318 .focused-line {

1702 @apply(--layout-fit);	1319 position: var(--layout-fit_-_position); top: var(--layout-fit_-_top); right: v ar(--layout-fit_-_right); bottom: var(--layout-fit_-_bottom); left: var(--layout -fit_-_left);

1703	1320

1704 background: var(--paper-input-container-focus-color, --primary-color);	1321 background: var(--paper-input-container-focus-color,var(--primary-color) );;

1705 height: 2px;	1322 height: 2px;

1706	1323

1707 -webkit-transform-origin: center center;	1324 -webkit-transform-origin: center center;

1708 transform-origin: center center;	1325 transform-origin: center center;

1709 -webkit-transform: scale3d(0,1,1);	1326 -webkit-transform: scale3d(0,1,1);

1710 transform: scale3d(0,1,1);	1327 transform: scale3d(0,1,1);

1711	1328

1712 @apply(--paper-input-container-underline-focus);	1329 display: var(--paper-input-container-underline-focus_-_display);

1713 }	1330 }

1714	1331

1715 .underline.is-highlighted .focused-line {	1332 .underline.is-highlighted .focused-line {

	1333 -webkit-transform: none;

	1334 transform: none;

	1335 -webkit-transition: -webkit-transform 0.25s;

	1336 transition: transform 0.25s;

	1337

	1338 ;

	1339 }

	1340

	1341 .underline.is-invalid .focused-line {

	1342 background: var(--paper-input-container-invalid-color,var(--error-color));;

1716 -webkit-transform: none;	1343 -webkit-transform: none;

1717 transform: none;	1344 transform: none;

1718 -webkit-transition: -webkit-transform 0.25s;	1345 -webkit-transition: -webkit-transform 0.25s;

1719 transition: transform 0.25s;	1346 transition: transform 0.25s;

1720	1347

1721 @apply(--paper-transition-easing);	1348 ;

1722 }	1349 }

1723	1350

1724 .underline.is-invalid .focused-line {	1351 .unfocused-line {

1725 background: var(--paper-input-container-invalid-color, --error-color);	1352 position: var(--layout-fit_-_position); top: var(--layout-fit_-_top); right: v ar(--layout-fit_-_right); bottom: var(--layout-fit_-_bottom); left: var(--layout -fit_-_left);

1726 -webkit-transform: none;

1727 transform: none;

1728 -webkit-transition: -webkit-transform 0.25s;

1729 transition: transform 0.25s;

1730	1353

1731 @apply(--paper-transition-easing);	1354 background: var(--paper-input-container-color,var(--secondary-text-color ));;

1732 }

1733

1734 .unfocused-line {

1735 @apply(--layout-fit);

1736

1737 background: var(--paper-input-container-color, --secondary-text-color);

1738 height: 1px;	1355 height: 1px;

1739	1356

1740 @apply(--paper-input-container-underline);	1357 display: var(--paper-input-container-underline_-_display);

1741 }	1358 }

1742	1359

1743 :host([disabled]) .unfocused-line {	1360 :host([disabled]) .unfocused-line {

1744 border-bottom: 1px dashed;	1361 border-bottom: 1px dashed;

1745 border-color: var(--paper-input-container-color, --secondary-text-color) ;	1362 border-color: var(--paper-input-container-color,var(--secondary-text-col or));;

1746 background: transparent;	1363 background: transparent;

1747	1364

1748 @apply(--paper-input-container-underline-disabled);	1365 ;

1749 }	1366 }

1750	1367

1751 .label-and-input-container {	1368 .label-and-input-container {

1752 @apply(--layout-flex-auto);	1369 -ms-flex: var(--layout-flex-auto_-_-ms-flex); -webkit-flex: var(--layout-flex- auto_-_-webkit-flex); flex: var(--layout-flex-auto_-_flex);

1753 @apply(--layout-relative);	1370 position: var(--layout-relative_-_position);

1754	1371

1755 width: 100%;	1372 width: 100%;

1756 max-width: 100%;	1373 max-width: 100%;

1757 }	1374 }

1758	1375

1759 .input-content {	1376 .input-content {

1760 @apply(--layout-horizontal);	1377 display: var(--layout-horizontal_-_display); -ms-flex-direction: var(--layout- horizontal_-_-ms-flex-direction); -webkit-flex-direction: var(--layout-horizonta l_-_-webkit-flex-direction); flex-direction: var(--layout-horizontal_-_flex-dire ction);

1761 @apply(--layout-center);	1378 -ms-flex-align: var(--layout-center_-_-ms-flex-align); -webkit-align-ite ms: var(--layout-center_-_-webkit-align-items); align-items: var(--layout-center _-_align-items);

1762	1379

1763 position: relative;	1380 position: relative;

1764 }	1381 }

1765	1382

1766 .input-content ::content label,	1383 .input-content ::content label, .input-content ::content .paper-input-label {

1767 .input-content ::content .paper-input-label {	1384 position: absolute;

1768 position: absolute;

1769 top: 0;	1385 top: 0;

1770 right: 0;	1386 right: 0;

1771 left: 0;	1387 left: 0;

1772 width: 100%;	1388 width: 100%;

1773 font: inherit;	1389 font: inherit;

1774 color: var(--paper-input-container-color, --secondary-text-color);	1390 color: var(--paper-input-container-color,var(--secondary-text-color));;

1775 -webkit-transition: -webkit-transform 0.25s, width 0.25s;	1391 -webkit-transition: -webkit-transform 0.25s, width 0.25s;

1776 transition: transform 0.25s, width 0.25s;	1392 transition: transform 0.25s, width 0.25s;

1777 -webkit-transform-origin: left top;	1393 -webkit-transform-origin: left top;

1778 transform-origin: left top;	1394 transform-origin: left top;

1779	1395

1780 @apply(--paper-font-common-nowrap);	1396 white-space: var(--paper-font-common-nowrap_-_white-space); overflow: va r(--paper-font-common-nowrap_-_overflow); text-overflow: var(--paper-font-common -nowrap_-_text-overflow);

1781 @apply(--paper-font-subhead);	1397 font-family: var(--paper-font-subhead_-_font-family); -webkit-font-smoot hing: var(--paper-font-subhead_-_-webkit-font-smoothing); font-size: var(--paper -font-subhead_-_font-size); font-weight: var(--paper-font-subhead_-_font-weight) ; line-height: var(--paper-font-subhead_-_line-height);

1782 @apply(--paper-input-container-label);	1398 color: var(--paper-input-container-label_-_color, var(--paper-input-cont ainer-color,var(--secondary-text-color))); font-size: var(--paper-input-containe r-label_-_font-size, var(--paper-font-subhead_-_font-size));

1783 @apply(--paper-transition-easing);	1399 ;

1784 }	1400 }

1785	1401

1786 .input-content.label-is-floating ::content label,	1402 .input-content.label-is-floating ::content label, .input-content.label-is-floati ng ::content .paper-input-label {

1787 .input-content.label-is-floating ::content .paper-input-label {	1403 -webkit-transform: translateY(-75%) scale(0.75);

1788 -webkit-transform: translateY(-75%) scale(0.75);

1789 transform: translateY(-75%) scale(0.75);	1404 transform: translateY(-75%) scale(0.75);

1790	1405

1791 /* Since we scale to 75/100 of the size, we actually have 100/75 of the	1406

1792 original space now available */

1793 width: 133%;	1407 width: 133%;

1794	1408

1795 @apply(--paper-input-container-label-floating);	1409 ;

1796 }	1410 }

1797	1411

1798 :host-context([dir="rtl"]) .input-content.label-is-floating ::content labe l,	1412 :host-context([dir="rtl"]) .input-content.label-is-floating ::content label, :ho st-context([dir="rtl"]) .input-content.label-is-floating ::content .paper-input- label {

1799 :host-context([dir="rtl"]) .input-content.label-is-floating ::content .pap er-input-label {	1413 width: 100%;

1800 /* TODO(noms): Figure out why leaving the width at 133% before the anima tion

1801 * actually makes

1802 * it wider on the right side, not left side, as you would expect in RTL */

1803 width: 100%;

1804 -webkit-transform-origin: right top;	1414 -webkit-transform-origin: right top;

1805 transform-origin: right top;	1415 transform-origin: right top;

1806 }	1416 }

1807	1417

1808 .input-content.label-is-highlighted ::content label,	1418 .input-content.label-is-highlighted ::content label, .input-content.label-is-hig hlighted ::content .paper-input-label {

1809 .input-content.label-is-highlighted ::content .paper-input-label {	1419 color: var(--paper-input-container-focus-color,var(--primary-color));;

1810 color: var(--paper-input-container-focus-color, --primary-color);

1811	1420

1812 @apply(--paper-input-container-label-focus);	1421 ;

1813 }	1422 }

1814	1423

1815 .input-content.is-invalid ::content label,	1424 .input-content.is-invalid ::content label, .input-content.is-invalid ::content . paper-input-label {

1816 .input-content.is-invalid ::content .paper-input-label {	1425 color: var(--paper-input-container-invalid-color,var(--error-color));;

1817 color: var(--paper-input-container-invalid-color, --error-color);	1426 }

1818 }

1819	1427

1820 .input-content.label-is-hidden ::content label,	1428 .input-content.label-is-hidden ::content label, .input-content.label-is-hidden : :content .paper-input-label {

1821 .input-content.label-is-hidden ::content .paper-input-label {	1429 visibility: hidden;

1822 visibility: hidden;	1430 }

1823 }

1824	1431

1825 .input-content ::content input,	1432 .input-content ::content input, .input-content ::content textarea, .input-conten t ::content iron-autogrow-textarea, .input-content ::content .paper-input-input {

1826 .input-content ::content textarea,	1433 position: relative;

1827 .input-content ::content iron-autogrow-textarea,

1828 .input-content ::content .paper-input-input {

1829 position: relative; /* to make a stacking context */

1830 outline: none;	1434 outline: none;

1831 box-shadow: none;	1435 box-shadow: none;

1832 padding: 0;	1436 padding: 0;

1833 width: 100%;	1437 width: 100%;

1834 max-width: 100%;	1438 max-width: 100%;

1835 background: transparent;	1439 background: transparent;

1836 border: none;	1440 border: none;

1837 color: var(--paper-input-container-input-color, --primary-text-color);	1441 color: var(--paper-input-container-input-color,var(--primary-text-color) );;

1838 -webkit-appearance: none;	1442 -webkit-appearance: none;

1839 text-align: inherit;	1443 text-align: inherit;

1840	1444

1841 @apply(--paper-font-subhead);	1445 font-family: var(--paper-font-subhead_-_font-family); -webkit-font-smoot hing: var(--paper-font-subhead_-_-webkit-font-smoothing); font-size: var(--paper -font-subhead_-_font-size); font-weight: var(--paper-font-subhead_-_font-weight) ; line-height: var(--paper-font-subhead_-_line-height);

1842 @apply(--paper-input-container-input);	1446 ;

1843 }	1447 }

1844	1448

1845 ::content [prefix] {	1449 ::content [prefix] {

1846 @apply(--paper-font-subhead);	1450 font-family: var(--paper-font-subhead_-_font-family); -webkit-font-smoothing: var(--paper-font-subhead_-_-webkit-font-smoothing); font-size: var(--paper-font- subhead_-_font-size); font-weight: var(--paper-font-subhead_-_font-weight); line -height: var(--paper-font-subhead_-_line-height);

1847	1451

1848 @apply(--paper-input-prefix);	1452 ;

1849 @apply(--layout-flex-none);	1453 -ms-flex: var(--layout-flex-none_-_-ms-flex); -webkit-flex: var(--layout -flex-none_-_-webkit-flex); flex: var(--layout-flex-none_-_flex);

1850 }	1454 }

1851	1455

1852 ::content [suffix] {	1456 ::content [suffix] {

1853 @apply(--paper-font-subhead);	1457 font-family: var(--paper-font-subhead_-_font-family); -webkit-font-smoothing: var(--paper-font-subhead_-_-webkit-font-smoothing); font-size: var(--paper-font- subhead_-_font-size); font-weight: var(--paper-font-subhead_-_font-weight); line -height: var(--paper-font-subhead_-_line-height);

1854	1458

1855 @apply(--paper-input-suffix);	1459 ;

1856 @apply(--layout-flex-none);	1460 -ms-flex: var(--layout-flex-none_-_-ms-flex); -webkit-flex: var(--layout -flex-none_-_-webkit-flex); flex: var(--layout-flex-none_-_flex);

1857 }	1461 }

1858	1462

1859 /* Firefox sets a min-width on the input, which can cause layout issues */	1463 .input-content ::content input {

1860 .input-content ::content input {	1464 min-width: 0;

1861 min-width: 0;	1465 }

1862 }

1863	1466

1864 .input-content ::content textarea {	1467 .input-content ::content textarea {

1865 resize: none;	1468 resize: none;

1866 }	1469 }

1867	1470

1868 .add-on-content {	1471 .add-on-content {

1869 position: relative;	1472 position: relative;

1870 }	1473 }

1871	1474

1872 .add-on-content.is-invalid ::content * {	1475 .add-on-content.is-invalid ::content * {

1873 color: var(--paper-input-container-invalid-color, --error-color);	1476 color: var(--paper-input-container-invalid-color,var(--error-color));;

1874 }	1477 }

1875	1478

1876 .add-on-content.is-highlighted ::content * {	1479 .add-on-content.is-highlighted ::content * {

1877 color: var(--paper-input-container-focus-color, --primary-color);	1480 color: var(--paper-input-container-focus-color,var(--primary-color));;

1878 }	1481 }

1879 </style>	1482

	1483 </style>

1880	1484

1881 <template is="dom-if" if="[[!noLabelFloat]]">	1485 <template is="dom-if" if="[[!noLabelFloat]]">

1882 <div class="floated-label-placeholder" aria-hidden="true"> </div>	1486 <div class="floated-label-placeholder" aria-hidden="true"> </div>

1883 </template>	1487 </template>

1884	1488

1885 <div class$="[[_computeInputContentClass(noLabelFloat,alwaysFloatLabel,focus ed,invalid,_inputHasContent)]]">	1489 <div class$="[[_computeInputContentClass(noLabelFloat,alwaysFloatLabel,focus ed,invalid,_inputHasContent)]]">

1886 <content select="[prefix]" id="prefix"></content>	1490 <content select="[prefix]" id="prefix"></content>

1887	1491

1888 <div class="label-and-input-container" id="labelAndInputContainer">	1492 <div class="label-and-input-container" id="labelAndInputContainer">

1889 <content select=":not([add-on]):not([prefix]):not([suffix])"></content>	1493 <content select=":not([add-on]):not([prefix]):not([suffix])"></content>

1890 </div>	1494 </div>

1891	1495

1892 <content select="[suffix]"></content>	1496 <content select="[suffix]"></content>

1893 </div>	1497 </div>

1894	1498

1895 <div class$="[[_computeUnderlineClass(focused,invalid)]]">	1499 <div class$="[[_computeUnderlineClass(focused,invalid)]]">

1896 <div class="unfocused-line"></div>	1500 <div class="unfocused-line"></div>

1897 <div class="focused-line"></div>	1501 <div class="focused-line"></div>

1898 </div>	1502 </div>

1899	1503

1900 <div class$="[[_computeAddOnContentClass(focused,invalid)]]">	1504 <div class$="[[_computeAddOnContentClass(focused,invalid)]]">

1901 <content id="addOnContent" select="[add-on]"></content>	1505 <content id="addOnContent" select="[add-on]"></content>

1902 </div>	1506 </div>

1903 </template>	1507 </template>

1904 </dom-module>	1508 </dom-module>

1905	1509

1906 <dom-module id="paper-spinner-styles" assetpath="chrome://resources/polymer/v1_0 /paper-spinner/">	1510 <dom-module id="paper-spinner-styles" assetpath="chrome://resources/polymer/v1_0 /paper-spinner/" css-build="shadow">

1907 <template>	1511 <template>

1908 <style>	1512 <style scope="paper-spinner-styles">:host {

1909 /*	1513 display: inline-block;

1910 /**************************/

1911 /* STYLES FOR THE SPINNER */

1912 /**************************/

1913

1914 /*

1915 * Constants:

1916 * ARCSIZE = 270 degrees (amount of circle the arc takes up)

1917 * ARCTIME = 1333ms (time it takes to expand and contract arc)

1918 * ARCSTARTROT = 216 degrees (how much the start location of the arc

1919 * should rotate each time, 216 gives us a

1920 * 5 pointed star shape (it's 360/5 * 3).

1921 * For a 7 pointed star, we might do

1922 * 360/7 * 3 = 154.286)

1923 * SHRINK_TIME = 400ms

1924 */

1925

1926 :host {

1927 display: inline-block;

1928 position: relative;	1514 position: relative;

1929 width: 28px;	1515 width: 28px;

1930 height: 28px;	1516 height: 28px;

1931	1517

1932 /* 360 * ARCTIME / (ARCSTARTROT + (360-ARCSIZE)) */	1518

1933 --paper-spinner-container-rotation-duration: 1568ms;	1519 --paper-spinner-container-rotation-duration: 1568ms;

1934	1520

1935 /* ARCTIME */	1521

1936 --paper-spinner-expand-contract-duration: 1333ms;	1522 --paper-spinner-expand-contract-duration: 1333ms;

1937	1523

1938 /* 4 * ARCTIME */	1524

1939 --paper-spinner-full-cycle-duration: 5332ms;	1525 --paper-spinner-full-cycle-duration: 5332ms;

1940	1526

1941 /* SHRINK_TIME */	1527

1942 --paper-spinner-cooldown-duration: 400ms;	1528 --paper-spinner-cooldown-duration: 400ms;

1943 }	1529 }

1944	1530

1945 #spinnerContainer {	1531 #spinnerContainer {

1946 width: 100%;	1532 width: 100%;

1947 height: 100%;	1533 height: 100%;

1948	1534

1949 /* The spinner does not have any contents that would have to be	1535

1950 * flipped if the direction changes. Always use ltr so that the

1951 * style works out correctly in both cases. */

1952 direction: ltr;	1536 direction: ltr;

1953 }	1537 }

1954	1538

1955 #spinnerContainer.active {	1539 #spinnerContainer.active {

1956 -webkit-animation: container-rotate var(--paper-spinner-container-rotati on-duration) linear infinite;	1540 -webkit-animation: container-rotate var(--paper-spinner-container-rotation-dur ation) linear infinite;

1957 animation: container-rotate var(--paper-spinner-container-rotation-durat ion) linear infinite;	1541 animation: container-rotate var(--paper-spinner-container-rotation-durat ion) linear infinite;

1958 }	1542 }

1959	1543

1960 @-webkit-keyframes container-rotate {	1544 @-webkit-keyframes container-rotate {

1961 to { -webkit-transform: rotate(360deg) }	1545 to {

1962 }	1546 -webkit-transform: rotate(360deg)

	1547 }

1963	1548

1964 @keyframes container-rotate {	1549 }

1965 to { transform: rotate(360deg) }

1966 }

1967	1550

1968 .spinner-layer {	1551 @keyframes container-rotate {

1969 position: absolute;	1552 to {

	1553 transform: rotate(360deg)

	1554 }

	1555

	1556 }

	1557

	1558 .spinner-layer {

	1559 position: absolute;

1970 width: 100%;	1560 width: 100%;

1971 height: 100%;	1561 height: 100%;

1972 opacity: 0;	1562 opacity: 0;

1973 white-space: nowrap;	1563 white-space: nowrap;

1974 border-color: var(--paper-spinner-color, --google-blue-500);	1564 border-color: var(--paper-spinner-color,var(--google-blue-500));;

1975 }	1565 }

1976	1566

1977 .layer-1 {	1567 .layer-1 {

1978 border-color: var(--paper-spinner-layer-1-color, --google-blue-500);	1568 border-color: var(--paper-spinner-layer-1-color,var(--google-blue-500));;

1979 }	1569 }

1980	1570

1981 .layer-2 {	1571 .layer-2 {

1982 border-color: var(--paper-spinner-layer-2-color, --google-red-500);	1572 border-color: var(--paper-spinner-layer-2-color,var(--google-red-500));;

1983 }	1573 }

1984	1574

1985 .layer-3 {	1575 .layer-3 {

1986 border-color: var(--paper-spinner-layer-3-color, --google-yellow-500);	1576 border-color: var(--paper-spinner-layer-3-color,var(--google-yellow-500));;

1987 }	1577 }

1988	1578

1989 .layer-4 {	1579 .layer-4 {

1990 border-color: var(--paper-spinner-layer-4-color, --google-green-500);	1580 border-color: var(--paper-spinner-layer-4-color,var(--google-green-500));;

1991 }	1581 }

1992	1582

1993 /**	1583 .active .spinner-layer {

1994 * IMPORTANT NOTE ABOUT CSS ANIMATION PROPERTIES (keanulee):	1584 -webkit-animation-name: fill-unfill-rotate;

1995 *

1996 * iOS Safari (tested on iOS 8.1) does not handle animation-delay very wel l - it doesn't

1997 * guarantee that the animation will start _exactly_ after that value. So we avoid using

1998 * animation-delay and instead set custom keyframes for each color (as lay er-2undant as it

1999 * seems).

2000 */

2001 .active .spinner-layer {

2002 -webkit-animation-name: fill-unfill-rotate;

2003 -webkit-animation-duration: var(--paper-spinner-full-cycle-duration);	1585 -webkit-animation-duration: var(--paper-spinner-full-cycle-duration);

2004 -webkit-animation-timing-function: cubic-bezier(0.4, 0.0, 0.2, 1);	1586 -webkit-animation-timing-function: cubic-bezier(0.4, 0.0, 0.2, 1);

2005 -webkit-animation-iteration-count: infinite;	1587 -webkit-animation-iteration-count: infinite;

2006 animation-name: fill-unfill-rotate;	1588 animation-name: fill-unfill-rotate;

2007 animation-duration: var(--paper-spinner-full-cycle-duration);	1589 animation-duration: var(--paper-spinner-full-cycle-duration);

2008 animation-timing-function: cubic-bezier(0.4, 0.0, 0.2, 1);	1590 animation-timing-function: cubic-bezier(0.4, 0.0, 0.2, 1);

2009 animation-iteration-count: infinite;	1591 animation-iteration-count: infinite;

2010 opacity: 1;	1592 opacity: 1;

2011 }	1593 }

2012	1594

2013 .active .spinner-layer.layer-1 {	1595 .active .spinner-layer.layer-1 {

2014 -webkit-animation-name: fill-unfill-rotate, layer-1-fade-in-out;	1596 -webkit-animation-name: fill-unfill-rotate, layer-1-fade-in-out;

2015 animation-name: fill-unfill-rotate, layer-1-fade-in-out;	1597 animation-name: fill-unfill-rotate, layer-1-fade-in-out;

2016 }	1598 }

2017	1599

2018 .active .spinner-layer.layer-2 {	1600 .active .spinner-layer.layer-2 {

2019 -webkit-animation-name: fill-unfill-rotate, layer-2-fade-in-out;	1601 -webkit-animation-name: fill-unfill-rotate, layer-2-fade-in-out;

2020 animation-name: fill-unfill-rotate, layer-2-fade-in-out;	1602 animation-name: fill-unfill-rotate, layer-2-fade-in-out;

2021 }	1603 }

2022	1604

2023 .active .spinner-layer.layer-3 {	1605 .active .spinner-layer.layer-3 {

2024 -webkit-animation-name: fill-unfill-rotate, layer-3-fade-in-out;	1606 -webkit-animation-name: fill-unfill-rotate, layer-3-fade-in-out;

2025 animation-name: fill-unfill-rotate, layer-3-fade-in-out;	1607 animation-name: fill-unfill-rotate, layer-3-fade-in-out;

2026 }	1608 }

2027	1609

2028 .active .spinner-layer.layer-4 {	1610 .active .spinner-layer.layer-4 {

2029 -webkit-animation-name: fill-unfill-rotate, layer-4-fade-in-out;	1611 -webkit-animation-name: fill-unfill-rotate, layer-4-fade-in-out;

2030 animation-name: fill-unfill-rotate, layer-4-fade-in-out;	1612 animation-name: fill-unfill-rotate, layer-4-fade-in-out;

2031 }	1613 }

2032	1614

2033 @-webkit-keyframes fill-unfill-rotate {	1615 @-webkit-keyframes fill-unfill-rotate {

2034 12.5% { -webkit-transform: rotate(135deg) } /* 0.5 * ARCSIZE */	1616 12.5% {

2035 25% { -webkit-transform: rotate(270deg) } /* 1 * ARCSIZE */	1617 -webkit-transform: rotate(135deg)

2036 37.5% { -webkit-transform: rotate(405deg) } /* 1.5 * ARCSIZE */	1618 }

2037 50% { -webkit-transform: rotate(540deg) } /* 2 * ARCSIZE */	1619

2038 62.5% { -webkit-transform: rotate(675deg) } /* 2.5 * ARCSIZE */	1620 25% {

2039 75% { -webkit-transform: rotate(810deg) } /* 3 * ARCSIZE */	1621 -webkit-transform: rotate(270deg)

2040 87.5% { -webkit-transform: rotate(945deg) } /* 3.5 * ARCSIZE */	1622 }

2041 to { -webkit-transform: rotate(1080deg) } /* 4 * ARCSIZE */	1623

2042 }	1624 37.5% {

2043	1625 -webkit-transform: rotate(405deg)

2044 @keyframes fill-unfill-rotate {	1626 }

2045 12.5% { transform: rotate(135deg) } /* 0.5 * ARCSIZE */	1627

2046 25% { transform: rotate(270deg) } /* 1 * ARCSIZE */	1628 50% {

2047 37.5% { transform: rotate(405deg) } /* 1.5 * ARCSIZE */	1629 -webkit-transform: rotate(540deg)

2048 50% { transform: rotate(540deg) } /* 2 * ARCSIZE */	1630 }

2049 62.5% { transform: rotate(675deg) } /* 2.5 * ARCSIZE */	1631

2050 75% { transform: rotate(810deg) } /* 3 * ARCSIZE */	1632 62.5% {

2051 87.5% { transform: rotate(945deg) } /* 3.5 * ARCSIZE */	1633 -webkit-transform: rotate(675deg)

2052 to { transform: rotate(1080deg) } /* 4 * ARCSIZE */	1634 }

2053 }	1635

2054	1636 75% {

2055 @-webkit-keyframes layer-1-fade-in-out {	1637 -webkit-transform: rotate(810deg)

2056 0% { opacity: 1 }	1638 }

2057 25% { opacity: 1 }	1639

2058 26% { opacity: 0 }	1640 87.5% {

2059 89% { opacity: 0 }	1641 -webkit-transform: rotate(945deg)

2060 90% { opacity: 1 }	1642 }

2061 to { opacity: 1 }	1643

2062 }	1644 to {

2063	1645 -webkit-transform: rotate(1080deg)

2064 @keyframes layer-1-fade-in-out {	1646 }

2065 0% { opacity: 1 }	1647

2066 25% { opacity: 1 }	1648 }

2067 26% { opacity: 0 }	1649

2068 89% { opacity: 0 }	1650 @keyframes fill-unfill-rotate {

2069 90% { opacity: 1 }	1651 12.5% {

2070 to { opacity: 1 }	1652 transform: rotate(135deg)

2071 }	1653 }

2072	1654

2073 @-webkit-keyframes layer-2-fade-in-out {	1655 25% {

2074 0% { opacity: 0 }	1656 transform: rotate(270deg)

2075 15% { opacity: 0 }	1657 }

2076 25% { opacity: 1 }	1658

2077 50% { opacity: 1 }	1659 37.5% {

2078 51% { opacity: 0 }	1660 transform: rotate(405deg)

2079 to { opacity: 0 }	1661 }

2080 }	1662

2081	1663 50% {

2082 @keyframes layer-2-fade-in-out {	1664 transform: rotate(540deg)

2083 0% { opacity: 0 }	1665 }

2084 15% { opacity: 0 }	1666

2085 25% { opacity: 1 }	1667 62.5% {

2086 50% { opacity: 1 }	1668 transform: rotate(675deg)

2087 51% { opacity: 0 }	1669 }

2088 to { opacity: 0 }	1670

2089 }	1671 75% {

2090	1672 transform: rotate(810deg)

2091 @-webkit-keyframes layer-3-fade-in-out {	1673 }

2092 0% { opacity: 0 }	1674

2093 40% { opacity: 0 }	1675 87.5% {

2094 50% { opacity: 1 }	1676 transform: rotate(945deg)

2095 75% { opacity: 1 }	1677 }

2096 76% { opacity: 0 }	1678

2097 to { opacity: 0 }	1679 to {

2098 }	1680 transform: rotate(1080deg)

2099	1681 }

2100 @keyframes layer-3-fade-in-out {	1682

2101 0% { opacity: 0 }	1683 }

2102 40% { opacity: 0 }	1684

2103 50% { opacity: 1 }	1685 @-webkit-keyframes layer-1-fade-in-out {

2104 75% { opacity: 1 }	1686 0% {

2105 76% { opacity: 0 }	1687 opacity: 1

2106 to { opacity: 0 }	1688 }

2107 }	1689

2108	1690 25% {

2109 @-webkit-keyframes layer-4-fade-in-out {	1691 opacity: 1

2110 0% { opacity: 0 }	1692 }

2111 65% { opacity: 0 }	1693

2112 75% { opacity: 1 }	1694 26% {

2113 90% { opacity: 1 }	1695 opacity: 0

2114 to { opacity: 0 }	1696 }

2115 }	1697

2116	1698 89% {

2117 @keyframes layer-4-fade-in-out {	1699 opacity: 0

2118 0% { opacity: 0 }	1700 }

2119 65% { opacity: 0 }	1701

2120 75% { opacity: 1 }	1702 90% {

2121 90% { opacity: 1 }	1703 opacity: 1

2122 to { opacity: 0 }	1704 }

2123 }	1705

2124	1706 to {

2125 .circle-clipper {	1707 opacity: 1

2126 display: inline-block;	1708 }

	1709

	1710 }

	1711

	1712 @keyframes layer-1-fade-in-out {

	1713 0% {

	1714 opacity: 1

	1715 }

	1716

	1717 25% {

	1718 opacity: 1

	1719 }

	1720

	1721 26% {

	1722 opacity: 0

	1723 }

	1724

	1725 89% {

	1726 opacity: 0

	1727 }

	1728

	1729 90% {

	1730 opacity: 1

	1731 }

	1732

	1733 to {

	1734 opacity: 1

	1735 }

	1736

	1737 }

	1738

	1739 @-webkit-keyframes layer-2-fade-in-out {

	1740 0% {

	1741 opacity: 0

	1742 }

	1743

	1744 15% {

	1745 opacity: 0

	1746 }

	1747

	1748 25% {

	1749 opacity: 1

	1750 }

	1751

	1752 50% {

	1753 opacity: 1

	1754 }

	1755

	1756 51% {

	1757 opacity: 0

	1758 }

	1759

	1760 to {

	1761 opacity: 0

	1762 }

	1763

	1764 }

	1765

	1766 @keyframes layer-2-fade-in-out {

	1767 0% {

	1768 opacity: 0

	1769 }

	1770

	1771 15% {

	1772 opacity: 0

	1773 }

	1774

	1775 25% {

	1776 opacity: 1

	1777 }

	1778

	1779 50% {

	1780 opacity: 1

	1781 }

	1782

	1783 51% {

	1784 opacity: 0

	1785 }

	1786

	1787 to {

	1788 opacity: 0

	1789 }

	1790

	1791 }

	1792

	1793 @-webkit-keyframes layer-3-fade-in-out {

	1794 0% {

	1795 opacity: 0

	1796 }

	1797

	1798 40% {

	1799 opacity: 0

	1800 }

	1801

	1802 50% {

	1803 opacity: 1

	1804 }

	1805

	1806 75% {

	1807 opacity: 1

	1808 }

	1809

	1810 76% {

	1811 opacity: 0

	1812 }

	1813

	1814 to {

	1815 opacity: 0

	1816 }

	1817

	1818 }

	1819

	1820 @keyframes layer-3-fade-in-out {

	1821 0% {

	1822 opacity: 0

	1823 }

	1824

	1825 40% {

	1826 opacity: 0

	1827 }

	1828

	1829 50% {

	1830 opacity: 1

	1831 }

	1832

	1833 75% {

	1834 opacity: 1

	1835 }

	1836

	1837 76% {

	1838 opacity: 0

	1839 }

	1840

	1841 to {

	1842 opacity: 0

	1843 }

	1844

	1845 }

	1846

	1847 @-webkit-keyframes layer-4-fade-in-out {

	1848 0% {

	1849 opacity: 0

	1850 }

	1851

	1852 65% {

	1853 opacity: 0

	1854 }

	1855

	1856 75% {

	1857 opacity: 1

	1858 }

	1859

	1860 90% {

	1861 opacity: 1

	1862 }

	1863

	1864 to {

	1865 opacity: 0

	1866 }

	1867

	1868 }

	1869

	1870 @keyframes layer-4-fade-in-out {

	1871 0% {

	1872 opacity: 0

	1873 }

	1874

	1875 65% {

	1876 opacity: 0

	1877 }

	1878

	1879 75% {

	1880 opacity: 1

	1881 }

	1882

	1883 90% {

	1884 opacity: 1

	1885 }

	1886

	1887 to {

	1888 opacity: 0

	1889 }

	1890

	1891 }

	1892

	1893 .circle-clipper {

	1894 display: inline-block;

2127 position: relative;	1895 position: relative;

2128 width: 50%;	1896 width: 50%;

2129 height: 100%;	1897 height: 100%;

2130 overflow: hidden;	1898 overflow: hidden;

2131 border-color: inherit;	1899 border-color: inherit;

2132 }	1900 }

2133	1901

2134 /**	1902 .spinner-layer::after {

2135 * Patch the gap that appear between the two adjacent div.circle-clipper w hile the	1903 left: 45%;

2136 * spinner is rotating (appears on Chrome 50, Safari 9.1.1, and Edge).

2137 */

2138 .spinner-layer::after {

2139 left: 45%;

2140 width: 10%;	1904 width: 10%;

2141 border-top-style: solid;	1905 border-top-style: solid;

2142 }	1906 }

2143	1907

2144 .spinner-layer::after,	1908 .spinner-layer::after, .circle-clipper::after {

2145 .circle-clipper::after {	1909 content: '';

2146 content: '';

2147 box-sizing: border-box;	1910 box-sizing: border-box;

2148 position: absolute;	1911 position: absolute;

2149 top: 0;	1912 top: 0;

2150 border-width: var(--paper-spinner-stroke-width, 3px);	1913 border-width: var(--paper-spinner-stroke-width, 3px);

2151 border-color: inherit;	1914 border-color: inherit;

2152 border-radius: 50%;	1915 border-radius: 50%;

2153 }	1916 }

2154	1917

2155 .circle-clipper::after {	1918 .circle-clipper::after {

2156 bottom: 0;	1919 bottom: 0;

2157 width: 200%;	1920 width: 200%;

2158 border-style: solid;	1921 border-style: solid;

2159 border-bottom-color: transparent !important;	1922 border-bottom-color: transparent !important;

2160 }	1923 }

2161	1924

2162 .circle-clipper.left::after {	1925 .circle-clipper.left::after {

2163 left: 0;	1926 left: 0;

2164 border-right-color: transparent !important;	1927 border-right-color: transparent !important;

2165 -webkit-transform: rotate(129deg);	1928 -webkit-transform: rotate(129deg);

2166 transform: rotate(129deg);	1929 transform: rotate(129deg);

2167 }	1930 }

2168	1931

2169 .circle-clipper.right::after {	1932 .circle-clipper.right::after {

2170 left: -100%;	1933 left: -100%;

2171 border-left-color: transparent !important;	1934 border-left-color: transparent !important;

2172 -webkit-transform: rotate(-129deg);	1935 -webkit-transform: rotate(-129deg);

2173 transform: rotate(-129deg);	1936 transform: rotate(-129deg);

2174 }	1937 }

2175	1938

2176 .active .gap-patch::after,	1939 .active .gap-patch::after, .active .circle-clipper::after {

2177 .active .circle-clipper::after {	1940 -webkit-animation-duration: var(--paper-spinner-expand-contract-duration);

2178 -webkit-animation-duration: var(--paper-spinner-expand-contract-duration );

2179 -webkit-animation-timing-function: cubic-bezier(0.4, 0.0, 0.2, 1);	1941 -webkit-animation-timing-function: cubic-bezier(0.4, 0.0, 0.2, 1);

2180 -webkit-animation-iteration-count: infinite;	1942 -webkit-animation-iteration-count: infinite;

2181 animation-duration: var(--paper-spinner-expand-contract-duration);	1943 animation-duration: var(--paper-spinner-expand-contract-duration);

2182 animation-timing-function: cubic-bezier(0.4, 0.0, 0.2, 1);	1944 animation-timing-function: cubic-bezier(0.4, 0.0, 0.2, 1);

2183 animation-iteration-count: infinite;	1945 animation-iteration-count: infinite;

2184 }	1946 }

2185	1947

2186 .active .circle-clipper.left::after {	1948 .active .circle-clipper.left::after {

2187 -webkit-animation-name: left-spin;	1949 -webkit-animation-name: left-spin;

2188 animation-name: left-spin;	1950 animation-name: left-spin;

2189 }	1951 }

2190	1952

2191 .active .circle-clipper.right::after {	1953 .active .circle-clipper.right::after {

2192 -webkit-animation-name: right-spin;	1954 -webkit-animation-name: right-spin;

2193 animation-name: right-spin;	1955 animation-name: right-spin;

2194 }	1956 }

2195	1957

2196 @-webkit-keyframes left-spin {	1958 @-webkit-keyframes left-spin {

2197 0% { -webkit-transform: rotate(130deg) }	1959 0% {

2198 50% { -webkit-transform: rotate(-5deg) }	1960 -webkit-transform: rotate(130deg)

2199 to { -webkit-transform: rotate(130deg) }	1961 }

2200 }	1962

2201	1963 50% {

2202 @keyframes left-spin {	1964 -webkit-transform: rotate(-5deg)

2203 0% { transform: rotate(130deg) }	1965 }

2204 50% { transform: rotate(-5deg) }	1966

2205 to { transform: rotate(130deg) }	1967 to {

2206 }	1968 -webkit-transform: rotate(130deg)

2207	1969 }

2208 @-webkit-keyframes right-spin {	1970

2209 0% { -webkit-transform: rotate(-130deg) }	1971 }

2210 50% { -webkit-transform: rotate(5deg) }	1972

2211 to { -webkit-transform: rotate(-130deg) }	1973 @keyframes left-spin {

2212 }	1974 0% {

2213	1975 transform: rotate(130deg)

2214 @keyframes right-spin {	1976 }

2215 0% { transform: rotate(-130deg) }	1977

2216 50% { transform: rotate(5deg) }	1978 50% {

2217 to { transform: rotate(-130deg) }	1979 transform: rotate(-5deg)

2218 }	1980 }

2219	1981

2220 #spinnerContainer.cooldown {	1982 to {

2221 -webkit-animation: container-rotate var(--paper-spinner-container-rotati on-duration) linear infinite, fade-out var(--paper-spinner-cooldown-duration) cu bic-bezier(0.4, 0.0, 0.2, 1);	1983 transform: rotate(130deg)

	1984 }

	1985

	1986 }

	1987

	1988 @-webkit-keyframes right-spin {

	1989 0% {

	1990 -webkit-transform: rotate(-130deg)

	1991 }

	1992

	1993 50% {

	1994 -webkit-transform: rotate(5deg)

	1995 }

	1996

	1997 to {

	1998 -webkit-transform: rotate(-130deg)

	1999 }

	2000

	2001 }

	2002

	2003 @keyframes right-spin {

	2004 0% {

	2005 transform: rotate(-130deg)

	2006 }

	2007

	2008 50% {

	2009 transform: rotate(5deg)

	2010 }

	2011

	2012 to {

	2013 transform: rotate(-130deg)

	2014 }

	2015

	2016 }

	2017

	2018 #spinnerContainer.cooldown {

	2019 -webkit-animation: container-rotate var(--paper-spinner-container-rotation-dur ation) linear infinite, fade-out var(--paper-spinner-cooldown-duration) cubic-be zier(0.4, 0.0, 0.2, 1);

2222 animation: container-rotate var(--paper-spinner-container-rotation-durat ion) linear infinite, fade-out var(--paper-spinner-cooldown-duration) cubic-bezi er(0.4, 0.0, 0.2, 1);	2020 animation: container-rotate var(--paper-spinner-container-rotation-durat ion) linear infinite, fade-out var(--paper-spinner-cooldown-duration) cubic-bezi er(0.4, 0.0, 0.2, 1);

2223 }	2021 }

2224	2022

2225 @-webkit-keyframes fade-out {	2023 @-webkit-keyframes fade-out {

2226 0% { opacity: 1 }	2024 0% {

2227 to { opacity: 0 }	2025 opacity: 1

2228 }	2026 }

2229	2027

2230 @keyframes fade-out {	2028 to {

2231 0% { opacity: 1 }	2029 opacity: 0

2232 to { opacity: 0 }	2030 }

2233 }	2031

2234 </style>	2032 }

	2033

	2034 @keyframes fade-out {

	2035 0% {

	2036 opacity: 1

	2037 }

	2038

	2039 to {

	2040 opacity: 0

	2041 }

	2042

	2043 }

	2044

	2045 </style>

2235 </template>	2046 </template>

2236 </dom-module>	2047 </dom-module>

2237	2048

2238	2049

2239 <dom-module id="paper-spinner-lite" assetpath="chrome://resources/polymer/v1_0/p aper-spinner/">	2050 <dom-module id="paper-spinner-lite" assetpath="chrome://resources/polymer/v1_0/p aper-spinner/" css-build="shadow">

2240 <template strip-whitespace="">	2051 <template strip-whitespace="">

2241 <style include="paper-spinner-styles"></style>	2052 <style scope="paper-spinner-lite">:host {

	2053 display: inline-block;

	2054 position: relative;

	2055 width: 28px;

	2056 height: 28px;

	2057

	2058

	2059 --paper-spinner-container-rotation-duration: 1568ms;

	2060

	2061

	2062 --paper-spinner-expand-contract-duration: 1333ms;

	2063

	2064

	2065 --paper-spinner-full-cycle-duration: 5332ms;

	2066

	2067

	2068 --paper-spinner-cooldown-duration: 400ms;

	2069 }

	2070

	2071 #spinnerContainer {

	2072 width: 100%;

	2073 height: 100%;

	2074

	2075

	2076 direction: ltr;

	2077 }

	2078

	2079 #spinnerContainer.active {

	2080 -webkit-animation: container-rotate var(--paper-spinner-container-rotation-dur ation) linear infinite;

	2081 animation: container-rotate var(--paper-spinner-container-rotation-durat ion) linear infinite;

	2082 }

	2083

	2084 @-webkit-keyframes container-rotate {

	2085 to {

	2086 -webkit-transform: rotate(360deg)

	2087 }

	2088

	2089 }

	2090

	2091 @keyframes container-rotate {

	2092 to {

	2093 transform: rotate(360deg)

	2094 }

	2095

	2096 }

	2097

	2098 .spinner-layer {

	2099 position: absolute;

	2100 width: 100%;

	2101 height: 100%;

	2102 opacity: 0;

	2103 white-space: nowrap;

	2104 border-color: var(--paper-spinner-color,var(--google-blue-500));;

	2105 }

	2106

	2107 .layer-1 {

	2108 border-color: var(--paper-spinner-layer-1-color,var(--google-blue-500));;

	2109 }

	2110

	2111 .layer-2 {

	2112 border-color: var(--paper-spinner-layer-2-color,var(--google-red-500));;

	2113 }

	2114

	2115 .layer-3 {

	2116 border-color: var(--paper-spinner-layer-3-color,var(--google-yellow-500));;

	2117 }

	2118

	2119 .layer-4 {

	2120 border-color: var(--paper-spinner-layer-4-color,var(--google-green-500));;

	2121 }

	2122

	2123 .active .spinner-layer {

	2124 -webkit-animation-name: fill-unfill-rotate;

	2125 -webkit-animation-duration: var(--paper-spinner-full-cycle-duration);

	2126 -webkit-animation-timing-function: cubic-bezier(0.4, 0.0, 0.2, 1);

	2127 -webkit-animation-iteration-count: infinite;

	2128 animation-name: fill-unfill-rotate;

	2129 animation-duration: var(--paper-spinner-full-cycle-duration);

	2130 animation-timing-function: cubic-bezier(0.4, 0.0, 0.2, 1);

	2131 animation-iteration-count: infinite;

	2132 opacity: 1;

	2133 }

	2134

	2135 .active .spinner-layer.layer-1 {

	2136 -webkit-animation-name: fill-unfill-rotate, layer-1-fade-in-out;

	2137 animation-name: fill-unfill-rotate, layer-1-fade-in-out;

	2138 }

	2139

	2140 .active .spinner-layer.layer-2 {

	2141 -webkit-animation-name: fill-unfill-rotate, layer-2-fade-in-out;

	2142 animation-name: fill-unfill-rotate, layer-2-fade-in-out;

	2143 }

	2144

	2145 .active .spinner-layer.layer-3 {

	2146 -webkit-animation-name: fill-unfill-rotate, layer-3-fade-in-out;

	2147 animation-name: fill-unfill-rotate, layer-3-fade-in-out;

	2148 }

	2149

	2150 .active .spinner-layer.layer-4 {

	2151 -webkit-animation-name: fill-unfill-rotate, layer-4-fade-in-out;

	2152 animation-name: fill-unfill-rotate, layer-4-fade-in-out;

	2153 }

	2154

	2155 @-webkit-keyframes fill-unfill-rotate {

	2156 12.5% {

	2157 -webkit-transform: rotate(135deg)

	2158 }

	2159

	2160 25% {

	2161 -webkit-transform: rotate(270deg)

	2162 }

	2163

	2164 37.5% {

	2165 -webkit-transform: rotate(405deg)

	2166 }

	2167

	2168 50% {

	2169 -webkit-transform: rotate(540deg)

	2170 }

	2171

	2172 62.5% {

	2173 -webkit-transform: rotate(675deg)

	2174 }

	2175

	2176 75% {

	2177 -webkit-transform: rotate(810deg)

	2178 }

	2179

	2180 87.5% {

	2181 -webkit-transform: rotate(945deg)

	2182 }

	2183

	2184 to {

	2185 -webkit-transform: rotate(1080deg)

	2186 }

	2187

	2188 }

	2189

	2190 @keyframes fill-unfill-rotate {

	2191 12.5% {

	2192 transform: rotate(135deg)

	2193 }

	2194

	2195 25% {

	2196 transform: rotate(270deg)

	2197 }

	2198

	2199 37.5% {

	2200 transform: rotate(405deg)

	2201 }

	2202

	2203 50% {

	2204 transform: rotate(540deg)

	2205 }

	2206

	2207 62.5% {

	2208 transform: rotate(675deg)

	2209 }

	2210

	2211 75% {

	2212 transform: rotate(810deg)

	2213 }

	2214

	2215 87.5% {

	2216 transform: rotate(945deg)

	2217 }

	2218

	2219 to {

	2220 transform: rotate(1080deg)

	2221 }

	2222

	2223 }

	2224

	2225 @-webkit-keyframes layer-1-fade-in-out {

	2226 0% {

	2227 opacity: 1

	2228 }

	2229

	2230 25% {

	2231 opacity: 1

	2232 }

	2233

	2234 26% {

	2235 opacity: 0

	2236 }

	2237

	2238 89% {

	2239 opacity: 0

	2240 }

	2241

	2242 90% {

	2243 opacity: 1

	2244 }

	2245

	2246 to {

	2247 opacity: 1

	2248 }

	2249

	2250 }

	2251

	2252 @keyframes layer-1-fade-in-out {

	2253 0% {

	2254 opacity: 1

	2255 }

	2256

	2257 25% {

	2258 opacity: 1

	2259 }

	2260

	2261 26% {

	2262 opacity: 0

	2263 }

	2264

	2265 89% {

	2266 opacity: 0

	2267 }

	2268

	2269 90% {

	2270 opacity: 1

	2271 }

	2272

	2273 to {

	2274 opacity: 1

	2275 }

	2276

	2277 }

	2278

	2279 @-webkit-keyframes layer-2-fade-in-out {

	2280 0% {

	2281 opacity: 0

	2282 }

	2283

	2284 15% {

	2285 opacity: 0

	2286 }

	2287

	2288 25% {

	2289 opacity: 1

	2290 }

	2291

	2292 50% {

	2293 opacity: 1

	2294 }

	2295

	2296 51% {

	2297 opacity: 0

	2298 }

	2299

	2300 to {

	2301 opacity: 0

	2302 }

	2303

	2304 }

	2305

	2306 @keyframes layer-2-fade-in-out {

	2307 0% {

	2308 opacity: 0

	2309 }

	2310

	2311 15% {

	2312 opacity: 0

	2313 }

	2314

	2315 25% {

	2316 opacity: 1

	2317 }

	2318

	2319 50% {

	2320 opacity: 1

	2321 }

	2322

	2323 51% {

	2324 opacity: 0

	2325 }

	2326

	2327 to {

	2328 opacity: 0

	2329 }

	2330

	2331 }

	2332

	2333 @-webkit-keyframes layer-3-fade-in-out {

	2334 0% {

	2335 opacity: 0

	2336 }

	2337

	2338 40% {

	2339 opacity: 0

	2340 }

	2341

	2342 50% {

	2343 opacity: 1

	2344 }

	2345

	2346 75% {

	2347 opacity: 1

	2348 }

	2349

	2350 76% {

	2351 opacity: 0

	2352 }

	2353

	2354 to {

	2355 opacity: 0

	2356 }

	2357

	2358 }

	2359

	2360 @keyframes layer-3-fade-in-out {

	2361 0% {

	2362 opacity: 0

	2363 }

	2364

	2365 40% {

	2366 opacity: 0

	2367 }

	2368

	2369 50% {

	2370 opacity: 1

	2371 }

	2372

	2373 75% {

	2374 opacity: 1

	2375 }

	2376

	2377 76% {

	2378 opacity: 0

	2379 }

	2380

	2381 to {

	2382 opacity: 0

	2383 }

	2384

	2385 }

	2386

	2387 @-webkit-keyframes layer-4-fade-in-out {

	2388 0% {

	2389 opacity: 0

	2390 }

	2391

	2392 65% {

	2393 opacity: 0

	2394 }

	2395

	2396 75% {

	2397 opacity: 1

	2398 }

	2399

	2400 90% {

	2401 opacity: 1

	2402 }

	2403

	2404 to {

	2405 opacity: 0

	2406 }

	2407

	2408 }

	2409

	2410 @keyframes layer-4-fade-in-out {

	2411 0% {

	2412 opacity: 0

	2413 }

	2414

	2415 65% {

	2416 opacity: 0

	2417 }

	2418

	2419 75% {

	2420 opacity: 1

	2421 }

	2422

	2423 90% {

	2424 opacity: 1

	2425 }

	2426

	2427 to {

	2428 opacity: 0

	2429 }

	2430

	2431 }

	2432

	2433 .circle-clipper {

	2434 display: inline-block;

	2435 position: relative;

	2436 width: 50%;

	2437 height: 100%;

	2438 overflow: hidden;

	2439 border-color: inherit;

	2440 }

	2441

	2442 .spinner-layer::after {

	2443 left: 45%;

	2444 width: 10%;

	2445 border-top-style: solid;

	2446 }

	2447

	2448 .spinner-layer::after, .circle-clipper::after {

	2449 content: '';

	2450 box-sizing: border-box;

	2451 position: absolute;

	2452 top: 0;

	2453 border-width: var(--paper-spinner-stroke-width, 3px);

	2454 border-color: inherit;

	2455 border-radius: 50%;

	2456 }

	2457

	2458 .circle-clipper::after {

	2459 bottom: 0;

	2460 width: 200%;

	2461 border-style: solid;

	2462 border-bottom-color: transparent !important;

	2463 }

	2464

	2465 .circle-clipper.left::after {

	2466 left: 0;

	2467 border-right-color: transparent !important;

	2468 -webkit-transform: rotate(129deg);

	2469 transform: rotate(129deg);

	2470 }

	2471

	2472 .circle-clipper.right::after {

	2473 left: -100%;

	2474 border-left-color: transparent !important;

	2475 -webkit-transform: rotate(-129deg);

	2476 transform: rotate(-129deg);

	2477 }

	2478

	2479 .active .gap-patch::after, .active .circle-clipper::after {

	2480 -webkit-animation-duration: var(--paper-spinner-expand-contract-duration);

	2481 -webkit-animation-timing-function: cubic-bezier(0.4, 0.0, 0.2, 1);

	2482 -webkit-animation-iteration-count: infinite;

	2483 animation-duration: var(--paper-spinner-expand-contract-duration);

	2484 animation-timing-function: cubic-bezier(0.4, 0.0, 0.2, 1);

	2485 animation-iteration-count: infinite;

	2486 }

	2487

	2488 .active .circle-clipper.left::after {

	2489 -webkit-animation-name: left-spin;

	2490 animation-name: left-spin;

	2491 }

	2492

	2493 .active .circle-clipper.right::after {

	2494 -webkit-animation-name: right-spin;

	2495 animation-name: right-spin;

	2496 }

	2497

	2498 @-webkit-keyframes left-spin {

	2499 0% {

	2500 -webkit-transform: rotate(130deg)

	2501 }

	2502

	2503 50% {

	2504 -webkit-transform: rotate(-5deg)

	2505 }

	2506

	2507 to {

	2508 -webkit-transform: rotate(130deg)

	2509 }

	2510

	2511 }

	2512

	2513 @keyframes left-spin {

	2514 0% {

	2515 transform: rotate(130deg)

	2516 }

	2517

	2518 50% {

	2519 transform: rotate(-5deg)

	2520 }

	2521

	2522 to {

	2523 transform: rotate(130deg)

	2524 }

	2525

	2526 }

	2527

	2528 @-webkit-keyframes right-spin {

	2529 0% {

	2530 -webkit-transform: rotate(-130deg)

	2531 }

	2532

	2533 50% {

	2534 -webkit-transform: rotate(5deg)

	2535 }

	2536

	2537 to {

	2538 -webkit-transform: rotate(-130deg)

	2539 }

	2540

	2541 }

	2542

	2543 @keyframes right-spin {

	2544 0% {

	2545 transform: rotate(-130deg)

	2546 }

	2547

	2548 50% {

	2549 transform: rotate(5deg)

	2550 }

	2551

	2552 to {

	2553 transform: rotate(-130deg)

	2554 }

	2555

	2556 }

	2557

	2558 #spinnerContainer.cooldown {

	2559 -webkit-animation: container-rotate var(--paper-spinner-container-rotation-dur ation) linear infinite, fade-out var(--paper-spinner-cooldown-duration) cubic-be zier(0.4, 0.0, 0.2, 1);

	2560 animation: container-rotate var(--paper-spinner-container-rotation-durat ion) linear infinite, fade-out var(--paper-spinner-cooldown-duration) cubic-bezi er(0.4, 0.0, 0.2, 1);

	2561 }

	2562

	2563 @-webkit-keyframes fade-out {

	2564 0% {

	2565 opacity: 1

	2566 }

	2567

	2568 to {

	2569 opacity: 0

	2570 }

	2571

	2572 }

	2573

	2574 @keyframes fade-out {

	2575 0% {

	2576 opacity: 1

	2577 }

	2578

	2579 to {

	2580 opacity: 0

	2581 }

	2582

	2583 }

	2584

	2585 </style>

2242	2586

2243 <div id="spinnerContainer" class-name="[[__computeContainerClasses(active, _ _coolingDown)]]">	2587 <div id="spinnerContainer" class-name="[[__computeContainerClasses(active, _ _coolingDown)]]">

2244 <div class="spinner-layer">	2588 <div class="spinner-layer">

2245 <div class="circle-clipper left"></div>	2589 <div class="circle-clipper left"></div>

2246 <div class="circle-clipper right"></div>	2590 <div class="circle-clipper right"></div>

2247 </div>	2591 </div>

2248 </div>	2592 </div>

2249 </template>	2593 </template>

2250	2594

2251 </dom-module>	2595 </dom-module>

2252 <dom-module id="cr-toolbar-search-field" assetpath="chrome://resources/cr_elemen ts/cr_toolbar/">	2596 <dom-module id="cr-toolbar-search-field" assetpath="chrome://resources/cr_elemen ts/cr_toolbar/" css-build="shadow">

2253 <template>	2597 <template>

2254 <style>	2598 <style scope="cr-toolbar-search-field">:host {

2255 :host {	2599 align-items: center;

2256 align-items: center;

2257 display: flex;	2600 display: flex;

2258 height: 40px;	2601 height: 40px;

2259 transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1),	2602 transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1),

2260 width 150ms cubic-bezier(0.4, 0, 0.2, 1);	2603 width 150ms cubic-bezier(0.4, 0, 0.2, 1);

2261 width: 44px;	2604 width: 44px;

2262 }	2605 }

2263	2606

2264 [hidden] {	2607 [hidden] {

2265 display: none !important;	2608 display: none !important;

2266 }	2609 }

2267	2610

2268 paper-icon-button {	2611 paper-icon-button {

2269 height: 32px;	2612 height: 32px;

2270 margin: 6px;	2613 margin: 6px;

2271 min-width: 32px;	2614 min-width: 32px;

2272 padding: 6px;	2615 padding: 6px;

2273 width: 32px;	2616 width: 32px;

2274 }	2617 }

2275	2618

2276 #icon {	2619 #icon {

2277 --paper-icon-button-ink-color: white;	2620 --paper-icon-button-ink-color: white;

2278 transition: margin 150ms, opacity 200ms;	2621 transition: margin 150ms, opacity 200ms;

2279 }	2622 }

2280	2623

2281 #prompt {	2624 #prompt {

2282 opacity: 0;	2625 opacity: 0;

2283 }	2626 }

2284	2627

2285 paper-spinner-lite {	2628 paper-spinner-lite {

2286 --paper-spinner-color: white;	2629 --paper-spinner-color: white;

2287 height: 20px;	2630 height: 20px;

2288 margin: 0 6px;	2631 margin: 0 6px;

2289 opacity: 0;	2632 opacity: 0;

2290 padding: 6px;	2633 padding: 6px;

2291 position: absolute;	2634 position: absolute;

2292 width: 20px;	2635 width: 20px;

2293 }	2636 }

2294	2637

2295 paper-spinner-lite[active] {	2638 paper-spinner-lite[active] {

2296 opacity: 1;	2639 opacity: 1;

2297 }	2640 }

2298	2641

2299 #prompt,	2642 #prompt, paper-spinner-lite {

2300 paper-spinner-lite {	2643 transition: opacity 200ms;

2301 transition: opacity 200ms;	2644 }

2302 }	2645

2303	2646 paper-input-container {

2304 paper-input-container {	2647 --paper-input-container-input-color: white;

2305 --paper-input-container-input-color: white;	2648 --paper-input-container-underline_-_display: none;;

2306 --paper-input-container-underline: {	2649 --paper-input-container-underline-focus_-_display: none;;

2307 display: none;	2650 --paper-input-container-label_-_color: apply-shim-inherit; --paper-input -container-label_-_font-size: apply-shim-inherit;;

2308 };

2309 --paper-input-container-underline-focus: {

2310 display: none;

2311 };

2312 --paper-input-container-label: {

2313 color: inherit;

2314 font-size: inherit;

2315 };

2316 -webkit-padding-start: 2px;	2651 -webkit-padding-start: 2px;

2317 flex: 1;	2652 flex: 1;

2318 }	2653 }

2319	2654

2320 input[type='search']::-webkit-search-decoration,	2655 input[type='search']::-webkit-search-decoration, input[type='search']::-webkit-s earch-cancel-button, input[type='search']::-webkit-search-results-button {

2321 input[type='search']::-webkit-search-cancel-button,	2656 -webkit-appearance: none;

2322 input[type='search']::-webkit-search-results-button {	2657 }

2323 -webkit-appearance: none;	2658

2324 }	2659 :host(:not([narrow])) {

2325	2660 -webkit-padding-end: 0;

2326 /** Wide layout. */

2327 :host(:not([narrow])) {

2328 -webkit-padding-end: 0;

2329 background: rgba(0, 0, 0, 0.22);	2661 background: rgba(0, 0, 0, 0.22);

2330 border-radius: 2px;	2662 border-radius: 2px;

2331 cursor: text;	2663 cursor: text;

2332 width: var(--cr-toolbar-field-width);	2664 width: var(--cr-toolbar-field-width);

2333 }	2665 }

2334	2666

2335 :host(:not([narrow]):not([showing-search])) #icon,	2667 :host(:not([narrow]):not([showing-search])) #icon, :host(:not([narrow])) #prompt {

2336 :host(:not([narrow])) #prompt {	2668 opacity: 0.6;

2337 opacity: 0.6;	2669 }

2338 }	2670

2339	2671 :host([narrow]:not([showing-search])) paper-input-container {

2340 :host([narrow]:not([showing-search])) paper-input-container {	2672 display: none;

2341 display: none;	2673 }

2342 }	2674

2343	2675 :host([showing-search][spinner-active]) #icon {

2344 /* Search open. */	2676 opacity: 0;

2345 :host([showing-search][spinner-active]) #icon {	2677 }

2346 opacity: 0;	2678

2347 }	2679 :host([narrow][showing-search]) {

2348	2680 width: 100%;

2349 :host([narrow][showing-search]) {	2681 }

2350 width: 100%;	2682

2351 }	2683 :host([narrow][showing-search]) #icon, :host([narrow][showing-search]) paper-spi nner-lite {

2352	2684 -webkit-margin-start: 18px;

2353 :host([narrow][showing-search]) #icon,	2685 }

2354 :host([narrow][showing-search]) paper-spinner-lite {	2686

2355 -webkit-margin-start: 18px;	2687 </style>

2356 }

2357 </style>

2358 <paper-spinner-lite active="[[isSpinnerShown_(spinnerActive, showingSearch)] ]">	2688 <paper-spinner-lite active="[[isSpinnerShown_(spinnerActive, showingSearch)] ]">

2359 </paper-spinner-lite>	2689 </paper-spinner-lite>

2360 <paper-icon-button id="icon" icon="cr:search" title="[[label]]" tabindex$="[ [computeIconTabIndex_(narrow)]]">	2690 <paper-icon-button id="icon" icon="cr:search" title="[[label]]" tabindex$="[ [computeIconTabIndex_(narrow)]]">

2361 </paper-icon-button>	2691 </paper-icon-button>

2362 <paper-input-container id="searchTerm" on-search="onSearchTermSearch" on-key down="onSearchTermKeydown" no-label-float="">	2692 <paper-input-container id="searchTerm" on-search="onSearchTermSearch" on-key down="onSearchTermKeydown" no-label-float="">

2363 <label id="prompt" for="searchInput">[[label]]</label>	2693 <label id="prompt" for="searchInput">[[label]]</label>

2364 <input is="iron-input" id="searchInput" type="search" on-blur="onInputBlur _" incremental="" autofocus="">	2694 <input is="iron-input" id="searchInput" type="search" on-blur="onInputBlur _" incremental="" autofocus="">

2365 </paper-input-container>	2695 </paper-input-container>

2366 <paper-icon-button icon="cr:cancel" id="clearSearch" title="[[clearLabel]]" hidden$="[[!hasSearchText_]]" on-tap="hideSearch_">	2696 <paper-icon-button icon="cr:cancel" id="clearSearch" title="[[clearLabel]]" hidden$="[[!hasSearchText_]]" on-tap="hideSearch_">

2367 </paper-icon-button>	2697 </paper-icon-button>

2368 </template>	2698 </template>

2369 </dom-module>	2699 </dom-module>

2370 <dom-module id="cr-toolbar" assetpath="chrome://resources/cr_elements/cr_toolbar /">	2700 <dom-module id="cr-toolbar" assetpath="chrome://resources/cr_elements/cr_toolbar /" css-build="shadow">

2371 <template>	2701 <template>

2372 <style>	2702 <style scope="cr-toolbar">:host {

2373 :host {	2703 --cr-toolbar-field-width: 580px;

2374 --cr-toolbar-field-width: 580px;

2375 color: #fff;	2704 color: #fff;

2376 display: flex;	2705 display: flex;

2377 height: 56px;	2706 height: 56px;

2378 }	2707 }

2379	2708

2380 h1 {	2709 h1 {

2381 -webkit-margin-start: 6px;	2710 -webkit-margin-start: 6px;

2382 flex: 1;	2711 flex: 1;

2383 font-size: 123%;	2712 font-size: 123%;

2384 font-weight: 400;	2713 font-weight: 400;

2385 text-overflow: ellipsis;	2714 text-overflow: ellipsis;

2386 overflow: hidden;	2715 overflow: hidden;

2387 white-space: nowrap;	2716 white-space: nowrap;

2388 }	2717 }

2389	2718

2390 #leftContent {	2719 #leftContent {

2391 -webkit-margin-start: 18px;	2720 -webkit-margin-start: 18px;

2392 align-items: center;	2721 align-items: center;

2393 display: flex;	2722 display: flex;

2394 position: absolute;	2723 position: absolute;

2395 transition: opacity 100ms;	2724 transition: opacity 100ms;

2396 }	2725 }

2397	2726

2398 #menuButton {	2727 #menuButton {

2399 height: 32px;	2728 height: 32px;

2400 margin-bottom: 6px;	2729 margin-bottom: 6px;

2401 margin-top: 6px;	2730 margin-top: 6px;

2402 min-width: 32px;	2731 min-width: 32px;

2403 padding: 6px;	2732 padding: 6px;

2404 width: 32px;	2733 width: 32px;

2405 }	2734 }

2406	2735

2407 #centeredContent {	2736 #centeredContent {

2408 -webkit-margin-start: var(--cr-toolbar-field-margin, 0);	2737 -webkit-margin-start: var(--cr-toolbar-field-margin, 0);

2409 display: flex;	2738 display: flex;

2410 flex: 1 1 0;	2739 flex: 1 1 0;

2411 justify-content: center;	2740 justify-content: center;

2412 }	2741 }

2413	2742

2414 :host([narrow_]) #centeredContent {	2743 :host([narrow_]) #centeredContent {

2415 -webkit-padding-end: var(--cr-toolbar-field-end-padding, 12px);	2744 -webkit-padding-end: var(--cr-toolbar-field-end-padding, 12px);

2416 }	2745 }

2417	2746

2418 :host(:not([narrow_])) h1 {	2747 :host(:not([narrow_])) h1 {

2419 @apply(--cr-toolbar-header-wide);	2748 ;

2420 }	2749 }

2421	2750

2422 :host(:not([narrow_])) #leftContent {	2751 :host(:not([narrow_])) #leftContent {

2423 max-width: calc((100% - var(--cr-toolbar-field-width) - 18px) / 2);	2752 max-width: calc((100% - var(--cr-toolbar-field-width) - 18px) / 2);

2424 @apply(--cr-toolbar-left-content-wide);	2753 ;

2425 }	2754 }

2426	2755

2427 :host(:not([narrow_])) #rightContent {	2756 :host(:not([narrow_])) #rightContent {

2428 @apply(--cr-toolbar-right-content-wide);	2757 ;

2429 }	2758 }

2430	2759

2431 :host([narrow_]) #centeredContent {	2760 :host([narrow_]) #centeredContent {

2432 justify-content: flex-end;	2761 justify-content: flex-end;

2433 }	2762 }

2434	2763

2435 :host([narrow_][showing-search_]) #leftContent {	2764 :host([narrow_][showing-search_]) #leftContent {

2436 opacity: 0;	2765 opacity: 0;

2437 }	2766 }

2438 </style>	2767

	2768 </style>

2439 <div id="leftContent">	2769 <div id="leftContent">

2440 <template is="dom-if" if="[[showMenu]]">	2770 <template is="dom-if" if="[[showMenu]]">

2441 <paper-icon-button id="menuButton" icon="cr:menu" on-tap="onMenuTap_" ti tle="[[menuLabel]]">	2771 <paper-icon-button id="menuButton" icon="cr:menu" on-tap="onMenuTap_" ti tle="[[menuLabel]]">

2442 </paper-icon-button>	2772 </paper-icon-button>

2443 </template>	2773 </template>

2444 <h1>[[pageName]]</h1>	2774 <h1>[[pageName]]</h1>

2445 </div>	2775 </div>

2446	2776

2447 <div id="centeredContent">	2777 <div id="centeredContent">

2448 <cr-toolbar-search-field id="search" narrow="[[narrow_]]" label="[[searchP rompt]]" clear-label="[[clearLabel]]" spinner-active="[[spinnerActive]]" showing -search="{{showingSearch_}}">	2778 <cr-toolbar-search-field id="search" narrow="[[narrow_]]" label="[[searchP rompt]]" clear-label="[[clearLabel]]" spinner-active="[[spinnerActive]]" showing -search="{{showingSearch_}}">

2449 </cr-toolbar-search-field>	2779 </cr-toolbar-search-field>

2450 <iron-media-query query="(max-width: 900px)" query-matches="{{narrow_}}">	2780 <iron-media-query query="(max-width: 900px)" query-matches="{{narrow_}}">

2451 </iron-media-query>	2781 </iron-media-query>

2452 </div>	2782 </div>

2453	2783

2454 <div id="rightContent">	2784 <div id="rightContent">

2455 <content select=".more-actions"></content>	2785 <content select=".more-actions"></content>

2456 </div>	2786 </div>

2457 </template>	2787 </template>

2458 </dom-module>	2788 </dom-module>

2459 <iron-iconset-svg size="24" name="history">	2789 <iron-iconset-svg size="24" name="history">

2460 <svg>	2790 <svg>

2461 <defs>	2791 <defs>

2462	2792

2463 <g id="chevron-left"><path d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12 z"></path></g>	2793 <g id="chevron-left"><path d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12 z"></path></g>

2464 <g id="today"><path d="M19 3h-1V1h-2v2H8V1H6v2H5c-1.11 0-1.99.9-1.99 2L3 1 9c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H5V8h14v11zM7 10h5v5H7z "></path></g>	2794 <g id="today"><path d="M19 3h-1V1h-2v2H8V1H6v2H5c-1.11 0-1.99.9-1.99 2L3 1 9c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H5V8h14v11zM7 10h5v5H7z "></path></g>

2465 </defs>	2795 </defs>

2466 </svg>	2796 </svg>

2467 </iron-iconset-svg>	2797 </iron-iconset-svg>

2468 <style is="custom-style">	2798 <style is="custom-style" css-build="shadow">html {

2469 :root {	2799 --card-border-color: rgba(0, 0, 0, 0.14);

2470 --card-border-color: rgba(0, 0, 0, 0.14);	2800 --card-box-shadow_-_box-shadow: 0 2px 2px rgba(0, 0, 0, .05),

2471 --card-box-shadow: {

2472 box-shadow: 0 2px 2px rgba(0, 0, 0, .05),

2473 0 1px 4px rgba(0, 0, 0, .08),	2801 0 1px 4px rgba(0, 0, 0, .08),

2474 0 1px 1px rgba(0, 0, 0, .2);;	2802 0 1px 1px rgba(0, 0, 0, .2);;

2475 };	2803 --card-container-filter_-_filter: drop-shadow(0 2px 1px rgba(0, 0, 0, .05))

2476 --card-container-filter: {

2477 filter: drop-shadow(0 2px 1px rgba(0, 0, 0, .05))

2478 drop-shadow(0 1px 0px rgba(0, 0, 0, .08))	2804 drop-shadow(0 1px 0px rgba(0, 0, 0, .08))

2479 drop-shadow(0 1px 1px rgba(0, 0, 0, .2));	2805 drop-shadow(0 1px 1px rgba(0, 0, 0, .2));;

2480 };

2481 --card-first-last-item-padding: 8px;	2806 --card-first-last-item-padding: 8px;

2482 --card-max-width: 960px;	2807 --card-max-width: 960px;

2483 --card-min-width: 550px;	2808 --card-min-width: 550px;

2484 --card-padding-between: 20px;	2809 --card-padding-between: 20px;

2485 --card-padding-side: 24px;	2810 --card-padding-side: 24px;

2486 --card-sizing: {	2811 --card-sizing_-_margin: 0 auto; --card-sizing_-_max-width: var(--card-max- width); --card-sizing_-_min-width: var(--card-min-width); --card-sizing_-_paddi ng: 0 var(--card-padding-side); --card-sizing_-_width: calc(100% - 2 * var(--c ard-padding-side));;

2487 margin: 0 auto;

2488 max-width: var(--card-max-width);

2489 min-width: var(--card-min-width);

2490 padding: 0 var(--card-padding-side);

2491 width: calc(100% - 2 * var(--card-padding-side));

2492 };

2493 --first-card-padding-top: 24px;	2812 --first-card-padding-top: 24px;

2494 --item-height: 44px;	2813 --item-height: 44px;

2495 --primary-text-color: #333;	2814 --primary-text-color: #333;

2496 --secondary-text-color: #757575;	2815 --secondary-text-color: #757575;

2497 --side-bar-width: 256px;	2816 --side-bar-width: 256px;

2498 --toolbar-grouped-height: 101px;	2817 --toolbar-grouped-height: 101px;

2499 --toolbar-height: 56px;	2818 --toolbar-height: 56px;

2500 }	2819 }

	2820

2501 </style>	2821 </style>

2502 <dom-module id="shared-style" assetpath="chrome://history/">	2822 <dom-module id="shared-style" assetpath="chrome://history/" css-build="shadow">

2503 <template>	2823 <template>

2504 <style>	2824 <style scope="shared-style">[hidden] {

2505 [hidden] {	2825 display: none !important;

2506 display: none !important;	2826 }

2507 }

2508	2827

2509 .card-title {	2828 .card-title {

2510 -webkit-padding-start: 20px;	2829 -webkit-padding-start: 20px;

2511 align-items: center;	2830 align-items: center;

2512 border-bottom: 1px solid var(--card-border-color);	2831 border-bottom: 1px solid var(--card-border-color);

2513 border-radius: 2px 2px 0 0;	2832 border-radius: 2px 2px 0 0;

2514 color: var(--primary-text-color);	2833 color: var(--primary-text-color);

2515 display: flex;	2834 display: flex;

2516 font-size: 14px;	2835 font-size: 14px;

2517 font-weight: 500;	2836 font-weight: 500;

2518 height: 48px;	2837 height: 48px;

2519 }	2838 }

2520	2839

2521 .centered-message {	2840 .centered-message {

2522 align-items: center;	2841 align-items: center;

2523 color: #b4b4b4;	2842 color: #b4b4b4;

2524 display: flex;	2843 display: flex;

2525 flex: 1;	2844 flex: 1;

2526 font-size: 14px;	2845 font-size: 14px;

2527 font-weight: 500;	2846 font-weight: 500;

2528 height: 100%;	2847 height: 100%;

2529 justify-content: center;	2848 justify-content: center;

2530 }	2849 }

2531	2850

2532 .menu-item {	2851 .menu-item {

2533 -webkit-user-select: none;	2852 -webkit-user-select: none;

2534 cursor: pointer;	2853 cursor: pointer;

2535 font: inherit;	2854 font: inherit;

2536 white-space: nowrap;	2855 white-space: nowrap;

2537 }	2856 }

2538	2857

2539 .website-icon {	2858 .website-icon {

2540 -webkit-margin-end: 16px;	2859 -webkit-margin-end: 16px;

2541 background-repeat: no-repeat;	2860 background-repeat: no-repeat;

2542 background-size: 16px;	2861 background-size: 16px;

2543 height: 16px;	2862 height: 16px;

2544 width: 16px;	2863 width: 16px;

2545 }	2864 }

2546	2865

2547 .website-title {	2866 .website-title {

2548 color: var(--primary-text-color);	2867 color: var(--primary-text-color);

2549 overflow: hidden;	2868 overflow: hidden;

2550 text-decoration: none;	2869 text-decoration: none;

2551 text-overflow: ellipsis;	2870 text-overflow: ellipsis;

2552 white-space: nowrap;	2871 white-space: nowrap;

2553 }	2872 }

2554	2873

2555 button.icon-button {	2874 button.icon-button {

2556 height: 36px;	2875 height: 36px;

2557 width: 36px;	2876 width: 36px;

2558 }	2877 }

2559	2878

2560 button.icon-button iron-icon {	2879 button.icon-button iron-icon {

2561 color: var(--secondary-text-color);	2880 color: var(--secondary-text-color);

2562 height: 20px;	2881 height: 20px;

2563 width: 20px;	2882 width: 20px;

2564 }	2883 }

2565	2884

2566 button.more-vert-button {	2885 button.more-vert-button {

2567 height: 36px;	2886 height: 36px;

2568 padding: 6px;	2887 padding: 6px;

2569 width: 36px;	2888 width: 36px;

2570 }	2889 }

2571	2890

2572 button.more-vert-button div {	2891 button.more-vert-button div {

2573 border: 2px solid var(--secondary-text-color);	2892 border: 2px solid var(--secondary-text-color);

2574 border-radius: 2px;	2893 border-radius: 2px;

2575 margin: 1px 10px;	2894 margin: 1px 10px;

2576 pointer-events: none;	2895 pointer-events: none;

2577 transform: scale(0.8);	2896 transform: scale(0.8);

2578 }	2897 }

2579 </style>	2898

	2899 </style>

2580 </template>	2900 </template>

2581 </dom-module>	2901 </dom-module>

2582 <dom-module id="history-toolbar" assetpath="chrome://history/">	2902 <dom-module id="history-toolbar" assetpath="chrome://history/" css-build="shadow ">

2583 <template>	2903 <template>

2584 <style include="shared-style">	2904 <style scope="history-toolbar">[hidden] {

2585 :host {	2905 display: none !important;

2586 color: #fff;	2906 }

	2907

	2908 .card-title {

	2909 -webkit-padding-start: 20px;

	2910 align-items: center;

	2911 border-bottom: 1px solid var(--card-border-color);

	2912 border-radius: 2px 2px 0 0;

	2913 color: var(--primary-text-color);

	2914 display: flex;

	2915 font-size: 14px;

	2916 font-weight: 500;

	2917 height: 48px;

	2918 }

	2919

	2920 .centered-message {

	2921 align-items: center;

	2922 color: #b4b4b4;

	2923 display: flex;

	2924 flex: 1;

	2925 font-size: 14px;

	2926 font-weight: 500;

	2927 height: 100%;

	2928 justify-content: center;

	2929 }

	2930

	2931 .menu-item {

	2932 -webkit-user-select: none;

	2933 cursor: pointer;

	2934 font: inherit;

	2935 white-space: nowrap;

	2936 }

	2937

	2938 .website-icon {

	2939 -webkit-margin-end: 16px;

	2940 background-repeat: no-repeat;

	2941 background-size: 16px;

	2942 height: 16px;

	2943 width: 16px;

	2944 }

	2945

	2946 .website-title {

	2947 color: var(--primary-text-color);

	2948 overflow: hidden;

	2949 text-decoration: none;

	2950 text-overflow: ellipsis;

	2951 white-space: nowrap;

	2952 }

	2953

	2954 button.icon-button {

	2955 height: 36px;

	2956 width: 36px;

	2957 }

	2958

	2959 button.icon-button iron-icon {

	2960 color: var(--secondary-text-color);

	2961 height: 20px;

	2962 width: 20px;

	2963 }

	2964

	2965 button.more-vert-button {

	2966 height: 36px;

	2967 padding: 6px;

	2968 width: 36px;

	2969 }

	2970

	2971 button.more-vert-button div {

	2972 border: 2px solid var(--secondary-text-color);

	2973 border-radius: 2px;

	2974 margin: 1px 10px;

	2975 pointer-events: none;

	2976 transform: scale(0.8);

	2977 }

	2978

	2979 :host {

	2980 color: #fff;

2587 display: block;	2981 display: block;

2588 transition: background-color 150ms;	2982 transition: background-color 150ms;

2589 width: 100%;	2983 width: 100%;

2590 }	2984 }

2591	2985

2592 cr-toolbar,	2986 cr-toolbar, #overlay-buttons, #overlay-wrapper, #toolbar-container {

2593 #overlay-buttons,	2987 align-items: center;

2594 #overlay-wrapper,

2595 #toolbar-container {

2596 align-items: center;

2597 display: flex;	2988 display: flex;

2598 width: 100%;	2989 width: 100%;

2599 }	2990 }

2600	2991

2601 :host([items-selected_]) {	2992 :host([items-selected_]) {

2602 background: rgb(68, 136, 255);	2993 background: rgb(68, 136, 255);

2603 }	2994 }

2604	2995

2605 #toolbar-container {	2996 #toolbar-container {

2606 height: var(--toolbar-height);	2997 height: var(--toolbar-height);

2607 }	2998 }

2608	2999

2609 cr-toolbar {	3000 cr-toolbar {

2610 --cr-toolbar-field-margin: var(--side-bar-width);	3001 --cr-toolbar-field-margin: var(--side-bar-width);

2611 }	3002 }

2612	3003

2613 :host([has-drawer]) cr-toolbar {	3004 :host([has-drawer]) cr-toolbar {

2614 --cr-toolbar-field-margin: 0;	3005 --cr-toolbar-field-margin: 0;

2615 }	3006 }

2616	3007

2617 :host(:not([has-drawer])) #overlay-wrapper {	3008 :host(:not([has-drawer])) #overlay-wrapper {

2618 -webkit-margin-start: var(--side-bar-width);	3009 -webkit-margin-start: var(--side-bar-width);

2619 }	3010 }

2620	3011

2621 #overlay-buttons {	3012 #overlay-buttons {

2622 margin: 0 auto;	3013 margin: 0 auto;

2623 max-width: var(--card-max-width);	3014 max-width: var(--card-max-width);

2624 padding: 0 var(--card-padding-side);	3015 padding: 0 var(--card-padding-side);

2625 }	3016 }

2626	3017

2627 paper-button {	3018 paper-button {

2628 font-weight: 500;	3019 font-weight: 500;

2629 }	3020 }

2630	3021

2631 #number-selected {	3022 #number-selected {

2632 flex: 1;	3023 flex: 1;

2633 }	3024 }

2634	3025

2635 #cancel-icon-button {	3026 #cancel-icon-button {

2636 -webkit-margin-end: 24px;	3027 -webkit-margin-end: 24px;

2637 -webkit-margin-start: 2px;	3028 -webkit-margin-start: 2px;

2638 height: 36px;	3029 height: 36px;

2639 min-width: 36px;	3030 min-width: 36px;

2640 width: 36px;	3031 width: 36px;

2641 }	3032 }

2642	3033

2643 #grouped-nav-container paper-icon-button {	3034 #grouped-nav-container paper-icon-button {

2644 --paper-icon-button-ink-color: rgba(255, 255, 255, 0.4);	3035 --paper-icon-button-ink-color: rgba(255, 255, 255, 0.4);

2645 -webkit-margin-start: 24px;	3036 -webkit-margin-start: 24px;

2646 flex: 0 0 auto;	3037 flex: 0 0 auto;

2647 }	3038 }

2648	3039

2649 paper-tab {	3040 paper-tab {

2650 --paper-tab-ink: rgba(255, 255, 255, 0.4);	3041 --paper-tab-ink: rgba(255, 255, 255, 0.4);

2651 font-size: 13px;	3042 font-size: 13px;

2652 text-transform: uppercase;	3043 text-transform: uppercase;

2653 }	3044 }

2654	3045

2655 paper-tabs {	3046 paper-tabs {

2656 --paper-tabs-selection-bar-color: var(--google-blue-500);	3047 --paper-tabs-selection-bar-color: var(--google-blue-500);

2657 height: calc(var(--toolbar-grouped-height) - var(--toolbar-height));	3048 height: calc(var(--toolbar-grouped-height) - var(--toolbar-height));

2658 min-width: 300px;	3049 min-width: 300px;

2659 }	3050 }

2660	3051

2661 #grouped-buttons-container {	3052 #grouped-buttons-container {

2662 align-items: center;	3053 align-items: center;

2663 display: flex;	3054 display: flex;

2664 }	3055 }

2665	3056

2666 #grouped-range-buttons {	3057 #grouped-range-buttons {

2667 -webkit-margin-start: 32px;	3058 -webkit-margin-start: 32px;

2668 }	3059 }

2669	3060

2670 #grouped-nav-container {	3061 #grouped-nav-container {

2671 -webkit-margin-end: 24px;	3062 -webkit-margin-end: 24px;

2672 align-items: center;	3063 align-items: center;

2673 display: flex;	3064 display: flex;

2674 flex: 1;	3065 flex: 1;

2675 justify-content: flex-end;	3066 justify-content: flex-end;

2676 overflow: hidden;	3067 overflow: hidden;

2677 transition: opacity 150ms;	3068 transition: opacity 150ms;

2678 }	3069 }

2679	3070

2680 :host([grouped-range='0']) #grouped-nav-container {	3071 :host([grouped-range='0']) #grouped-nav-container {

2681 opacity: 0;	3072 opacity: 0;

2682 pointer-events: none;	3073 pointer-events: none;

2683 }	3074 }

2684	3075

2685 #grouped-date {	3076 #grouped-date {

2686 flex: 0 1 auto;	3077 flex: 0 1 auto;

2687 opacity: 0.7;	3078 opacity: 0.7;

2688 overflow: hidden;	3079 overflow: hidden;

2689 text-align: right;	3080 text-align: right;

2690 text-overflow: ellipsis;	3081 text-overflow: ellipsis;

2691 white-space: nowrap;	3082 white-space: nowrap;

2692 }	3083 }

2693	3084

2694 :host-context([dir=rtl]) .rtl-reversible {	3085 :host-context([dir=rtl]) .rtl-reversible {

2695 transform: rotate(180deg);	3086 transform: rotate(180deg);

2696 }	3087 }

2697 </style>	3088

	3089 </style>

2698 <div id="toolbar-container">	3090 <div id="toolbar-container">

2699 <cr-toolbar id="main-toolbar" page-name="$i18n{title}" clear-label="$i18n{ clearSearch}" search-prompt="$i18n{searchPrompt}" hidden$="[[itemsSelected_]]" s pinner-active="[[spinnerActive]]" show-menu="[[hasDrawer]]" menu-label="$i18n{hi storyMenuButton}" on-search-changed="onSearchChanged_">	3091 <cr-toolbar id="main-toolbar" page-name="$i18n{title}" clear-label="$i18n{ clearSearch}" search-prompt="$i18n{searchPrompt}" hidden$="[[itemsSelected_]]" s pinner-active="[[spinnerActive]]" show-menu="[[hasDrawer]]" menu-label="$i18n{hi storyMenuButton}" on-search-changed="onSearchChanged_">

2700 </cr-toolbar>	3092 </cr-toolbar>

2701 <template is="dom-if" if="[[itemsSelected_]]">	3093 <template is="dom-if" if="[[itemsSelected_]]">

2702 <div id="overlay-wrapper" hidden$="[[!itemsSelected_]]">	3094 <div id="overlay-wrapper" hidden$="[[!itemsSelected_]]">

2703 <div id="overlay-buttons">	3095 <div id="overlay-buttons">

2704 <paper-icon-button icon="cr:clear" id="cancel-icon-button" on-tap="o nClearSelectionTap_" title="$i18n{cancel}">	3096 <paper-icon-button icon="cr:clear" id="cancel-icon-button" on-tap="o nClearSelectionTap_" title="$i18n{cancel}">

2705 </paper-icon-button>	3097 </paper-icon-button>

2706 <div id="number-selected">[[numberOfItemsSelected_(count)]]</div>	3098 <div id="number-selected">[[numberOfItemsSelected_(count)]]</div>

2707 <paper-button id="cancel-button" on-tap="onClearSelectionTap_">	3099 <paper-button id="cancel-button" on-tap="onClearSelectionTap_">

(...skipping 18 matching lines...) Expand all Loading...
2726 {{getHistoryInterval_(queryStartTime, queryEndTime)}}	3118 {{getHistoryInterval_(queryStartTime, queryEndTime)}}

2727 </span>	3119 </span>

2728 <paper-icon-button icon="history:today" alt="$i18n{rangeToday}" title= "$i18n{rangeToday}"></paper-icon-button>	3120 <paper-icon-button icon="history:today" alt="$i18n{rangeToday}" title= "$i18n{rangeToday}"></paper-icon-button>

2729 <paper-icon-button icon="history:chevron-left" alt="$i18n{rangePreviou s}" title="$i18n{rangePrevious}" class="rtl-reversible"></paper-icon-button>	3121 <paper-icon-button icon="history:chevron-left" alt="$i18n{rangePreviou s}" title="$i18n{rangePrevious}" class="rtl-reversible"></paper-icon-button>

2730 <paper-icon-button icon="cr:chevron-right" alt="$i18n{rangeNext}" titl e="$i18n{rangeNext}" class="rtl-reversible"></paper-icon-button>	3122 <paper-icon-button icon="cr:chevron-right" alt="$i18n{rangeNext}" titl e="$i18n{rangeNext}" class="rtl-reversible"></paper-icon-button>

2731 </div>	3123 </div>

2732 </div>	3124 </div>

2733 </template>	3125 </template>

2734 </template>	3126 </template>

2735 </dom-module>	3127 </dom-module>

2736 <dom-module id="cr-dialog" assetpath="chrome://resources/cr_elements/cr_dialog/" >	3128 <dom-module id="cr-dialog" assetpath="chrome://resources/cr_elements/cr_dialog/" css-build="shadow">

2737 <template>	3129 <template>

2738 <style>	3130 <style scope="cr-dialog">:host {

2739 :host {	3131 border: 0;

2740 border: 0;

2741 border-radius: 2px;	3132 border-radius: 2px;

2742 bottom: 0;	3133 bottom: 0;

2743 color: inherit;	3134 color: inherit;

2744 padding: 0;	3135 padding: 0;

2745 top: 0;	3136 top: 0;

2746 }	3137 }

2747	3138

2748 :host::backdrop {	3139 :host::backdrop {

2749 background-color: rgba(0, 0, 0, 0.6);	3140 background-color: rgba(0, 0, 0, 0.6);

2750 bottom: 0;	3141 bottom: 0;

2751 left: 0;	3142 left: 0;

2752 position: fixed;	3143 position: fixed;

2753 right: 0;	3144 right: 0;

2754 top: 0;	3145 top: 0;

2755 }	3146 }

2756	3147

2757 .title-container {	3148 .title-container {

2758 align-items: center;	3149 align-items: center;

2759 /* TODO(dbeam): should this be a --settings-separator-line? */	3150

2760 border-bottom: 1px solid rgba(0, 0, 0, 0.14);	3151 border-bottom: 1px solid rgba(0, 0, 0, 0.14);

2761 display: flex;	3152 display: flex;

2762 min-height: 52px;	3153 min-height: 52px;

2763 }	3154 }

2764	3155

2765 :host ::content .title {	3156 :host ::content .title {

2766 font-size: 123.07%; /* (16px / 13px) * 100 */	3157 font-size: 123.07%;

2767 }	3158 }

2768	3159

2769 #close {	3160 #close {

2770 --paper-icon-button: {	3161 --paper-icon-button_-_height: 40px; --paper-icon-button_-_width: 40px;;

2771 height: 40px;

2772 width: 40px;

2773 };

2774 -webkit-margin-end: 6px;	3162 -webkit-margin-end: 6px;

2775 /* <paper-icon-button> overrides --iron-icon-{height,width}, so this	3163

2776 * padding essentially reduces 40x40 to 20x20. */

2777 padding: 10px;	3164 padding: 10px;

2778 }	3165 }

2779	3166

2780 .body-container {	3167 .body-container {

2781 display: flex;	3168 display: flex;

2782 flex-direction: column;	3169 flex-direction: column;

2783 max-width: 800px;	3170 max-width: 800px;

2784 min-width: 512px;	3171 min-width: 512px;

2785 /* TODO(dbeam): use <paper-dialog-scrollable> to get dividers? */	3172

2786 overflow: auto;	3173 overflow: auto;

2787 }	3174 }

2788	3175

2789 :host ::content .body {	3176 :host ::content .body {

2790 margin: 12px 0;	3177 margin: 12px 0;

2791 }	3178 }

2792	3179

2793 :host ::content .body,	3180 :host ::content .body, :host ::content .title {

2794 :host ::content .title {	3181 -webkit-padding-end: 24px;

2795 -webkit-padding-end: 24px;

2796 -webkit-padding-start: 24px;	3182 -webkit-padding-start: 24px;

2797 flex: 1;	3183 flex: 1;

2798 }	3184 }

2799	3185

2800 :host ::content .button-container {	3186 :host ::content .button-container {

2801 -webkit-padding-end: 16px;	3187 -webkit-padding-end: 16px;

2802 -webkit-padding-start: 16px;	3188 -webkit-padding-start: 16px;

2803 display: flex;	3189 display: flex;

2804 justify-content: flex-end;	3190 justify-content: flex-end;

2805 margin-bottom: 12px;	3191 margin-bottom: 12px;

2806 margin-top: 12px;	3192 margin-top: 12px;

2807 }	3193 }

2808	3194

2809 :host ::content .button-container .cancel-button {	3195 :host ::content .button-container .cancel-button {

2810 -webkit-margin-end: 8px;	3196 -webkit-margin-end: 8px;

2811 color: var(--paper-grey-600);	3197 color: var(--paper-grey-600);

2812 }	3198 }

2813	3199

2814 :host ::content .footer {	3200 :host ::content .footer {

2815 background-color: var(--paper-grey-200);	3201 background-color: var(--paper-grey-200);

2816 border-bottom-left-radius: inherit;	3202 border-bottom-left-radius: inherit;

2817 border-bottom-right-radius: inherit;	3203 border-bottom-right-radius: inherit;

2818 margin: 0;	3204 margin: 0;

2819 padding: 12px 20px;	3205 padding: 12px 20px;

2820 }	3206 }

2821 </style>	3207

	3208 </style>

2822 <div class="title-container">	3209 <div class="title-container">

2823 <content select=".title"></content>	3210 <content select=".title"></content>

2824 <paper-icon-button icon="cr:clear" on-tap="cancel" id="close">	3211 <paper-icon-button icon="cr:clear" on-tap="cancel" id="close">

2825 </paper-icon-button>	3212 </paper-icon-button>

2826 </div>	3213 </div>

2827 <div class="body-container">	3214 <div class="body-container">

2828 <content select=".body"></content>	3215 <content select=".body"></content>

2829 </div>	3216 </div>

2830 <content select=".button-container"></content>	3217 <content select=".button-container"></content>

2831 <content select=".footer"></content>	3218 <content select=".footer"></content>

2832 </template>	3219 </template>

2833 </dom-module>	3220 </dom-module>

2834 <dom-module id="iron-overlay-backdrop" assetpath="chrome://resources/polymer/v1_ 0/iron-overlay-behavior/">	3221 <dom-module id="iron-overlay-backdrop" assetpath="chrome://resources/polymer/v1_ 0/iron-overlay-behavior/" css-build="shadow">

2835	3222

2836 <template>	3223 <template>

2837 <style>	3224 <style scope="iron-overlay-backdrop">:host {

2838 :host {	3225 position: fixed;

2839 position: fixed;

2840 top: 0;	3226 top: 0;

2841 left: 0;	3227 left: 0;

2842 width: 100%;	3228 width: 100%;

2843 height: 100%;	3229 height: 100%;

2844 background-color: var(--iron-overlay-backdrop-background-color, #000);	3230 background-color: var(--iron-overlay-backdrop-background-color, #000);

2845 opacity: 0;	3231 opacity: 0;

2846 transition: opacity 0.2s;	3232 transition: opacity 0.2s;

2847 pointer-events: none;	3233 pointer-events: none;

2848 @apply(--iron-overlay-backdrop);	3234 ;

2849 }	3235 }

2850	3236

2851 :host(.opened) {	3237 :host(.opened) {

2852 opacity: var(--iron-overlay-backdrop-opacity, 0.6);	3238 opacity: var(--iron-overlay-backdrop-opacity, 0.6);

2853 pointer-events: auto;	3239 pointer-events: auto;

2854 @apply(--iron-overlay-backdrop-opened);	3240 ;

2855 }	3241 }

2856 </style>	3242

	3243 </style>

2857	3244

2858 <content></content>	3245 <content></content>

2859 </template>	3246 </template>

2860	3247

2861 </dom-module>	3248 </dom-module>

2862	3249

2863 <script src="chrome://resources/polymer/v1_0/web-animations-js/web-animations-ne xt-lite.min.js"></script>	3250 <script src="chrome://resources/polymer/v1_0/web-animations-js/web-animations-ne xt-lite.min.js"></script>

2864	3251

2865	3252

2866 <dom-module id="iron-dropdown" assetpath="chrome://resources/polymer/v1_0/iron-d ropdown/">	3253 <dom-module id="iron-dropdown" assetpath="chrome://resources/polymer/v1_0/iron-d ropdown/" css-build="shadow">

2867 <template>	3254 <template>

2868 <style>	3255 <style scope="iron-dropdown">:host {

2869 :host {	3256 position: fixed;

2870 position: fixed;	3257 }

2871 }	3258

2872	3259 #contentWrapper ::content > * {

2873 #contentWrapper ::content > * {	3260 overflow: auto;

2874 overflow: auto;	3261 }

2875 }	3262

2876	3263 #contentWrapper.animating ::content > * {

2877 #contentWrapper.animating ::content > * {	3264 overflow: hidden;

2878 overflow: hidden;	3265 }

2879 }	3266

2880 </style>	3267 </style>

2881	3268

2882 <div id="contentWrapper">	3269 <div id="contentWrapper">

2883 <content id="content" select=".dropdown-content"></content>	3270 <content id="content" select=".dropdown-content"></content>

2884 </div>	3271 </div>

2885 </template>	3272 </template>

2886	3273

2887 </dom-module>	3274 </dom-module>

2888 <link rel="import" href="chrome://resources/html/util.html">	3275 <link rel="import" href="chrome://resources/html/util.html">

2889 <dom-module id="cr-shared-menu" assetpath="chrome://resources/cr_elements/cr_sha red_menu/">	3276 <dom-module id="cr-shared-menu" assetpath="chrome://resources/cr_elements/cr_sha red_menu/" css-build="shadow">

2890 <template>	3277 <template>

2891 <style>	3278 <style scope="cr-shared-menu">#menu {

2892 #menu {	3279 box-shadow: var(--shadow-elevation-2dp_-_box-shadow);

2893 @apply(--shadow-elevation-2dp);

2894 background-color: white;	3280 background-color: white;

2895 overflow: hidden;	3281 overflow: hidden;

2896 padding: 8px 0;	3282 padding: 8px 0;

2897 position: relative;	3283 position: relative;

2898 }	3284 }

2899 </style>	3285

	3286 </style>

2900 <iron-dropdown id="dropdown" allow-outside-scroll="" restore-focus-on-close= "" vertical-align="auto" horizontal-align="right" opened="{{menuOpen}}" open-ani mation-config="[[openAnimationConfig]]" close-animation-config="[[closeAnimation Config]]">	3287 <iron-dropdown id="dropdown" allow-outside-scroll="" restore-focus-on-close= "" vertical-align="auto" horizontal-align="right" opened="{{menuOpen}}" open-ani mation-config="[[openAnimationConfig]]" close-animation-config="[[closeAnimation Config]]">

2901 <div id="menu" class="dropdown-content" role="menu">	3288 <div id="menu" class="dropdown-content" role="menu">

2902 <content></content>	3289 <content></content>

2903 </div>	3290 </div>

2904 </iron-dropdown>	3291 </iron-dropdown>

2905 </template>	3292 </template>

2906 </dom-module>	3293 </dom-module>

2907	3294

2908 <style is="custom-style">	3295 <style is="custom-style" css-build="shadow">html {

2909 :root {	3296 --cr-actionable_-_cursor: pointer;;

2910 --cr-actionable: {

2911 cursor: pointer;

2912 };

2913 --cr-focused-item-color: var(--google-grey-300);	3297 --cr-focused-item-color: var(--google-grey-300);

2914 --cr-selectable-focus: {	3298 --cr-selectable-focus_-_background-color: var(--cr-focused-item-color); --c r-selectable-focus_-_outline: none;

2915 background-color: var(--cr-focused-item-color);

2916 outline: none;

2917 }

2918 --cr-separator-line: 1px solid rgba(0, 0, 0, 0.06);	3299 --cr-separator-line: 1px solid rgba(0, 0, 0, 0.06);

2919 }	3300 }

2920 </style>	3301

2921	3302 </style>

2922 <dom-module id="cr-shared-style" assetpath="chrome://resources/cr_elements/">	3303

2923 <template>	3304 <dom-module id="cr-shared-style" assetpath="chrome://resources/cr_elements/" css -build="shadow">

2924 <style>	3305 <template>

2925 /* Chrome spinners should be blue. */	3306 <style scope="cr-shared-style">paper-spinner {

2926 paper-spinner {	3307 --paper-spinner-layer-1-color: var(--google-blue-500);

2927 --paper-spinner-layer-1-color: var(--google-blue-500);

2928 --paper-spinner-layer-2-color: var(--google-blue-500);	3308 --paper-spinner-layer-2-color: var(--google-blue-500);

2929 --paper-spinner-layer-3-color: var(--google-blue-500);	3309 --paper-spinner-layer-3-color: var(--google-blue-500);

2930 --paper-spinner-layer-4-color: var(--google-blue-500);	3310 --paper-spinner-layer-4-color: var(--google-blue-500);

2931 }	3311 }

2932	3312

2933 .action-button {	3313 .action-button {

2934 background: var(--google-blue-500);	3314 background: var(--google-blue-500);

2935 color: white;	3315 color: white;

2936 --paper-button-flat-keyboard-focus: {	3316 --paper-button-flat-keyboard-focus_-_background: rgb(58, 117, 215);;

2937 background: rgb(58, 117, 215); /* 88% of --google-blue-500 */	3317 }

2938 };	3318

2939 }	3319 .action-button[disabled] {

2940	3320 opacity: .25;

2941 .action-button[disabled] {	3321 }

2942 opacity: .25; /* TODO(dbeam): check this value with bettes. */	3322

2943 }	3323 .cancel-button {

2944	3324 --paper-button-flat-keyboard-focus_-_background: rgba(0, 0, 0, .12);;

2945 .cancel-button {	3325 }

2946 --paper-button-flat-keyboard-focus: {	3326

2947 background: rgba(0, 0, 0, .12);	3327 .action-button, .cancel-button {

2948 };	3328 font-weight: 500;

2949 }	3329 }

2950	3330

2951 .action-button,	3331 [actionable] {

2952 .cancel-button {	3332 cursor: var(--cr-actionable_-_cursor);

2953 font-weight: 500;	3333 }

2954 }	3334

2955	3335 [scrollable] {

2956 [actionable] {	3336 border-color: transparent;

2957 @apply(--cr-actionable);

2958 }

2959

2960 [scrollable] {

2961 border-color: transparent;

2962 border-style: solid;	3337 border-style: solid;

2963 border-width: 1px 0;	3338 border-width: 1px 0;

2964 overflow-y: auto;	3339 overflow-y: auto;

2965 }	3340 }

2966 [scrollable].is-scrolled {	3341

2967 border-top-color: var(--google-grey-300);	3342 [scrollable].is-scrolled {

2968 }	3343 border-top-color: var(--google-grey-300);

2969 [scrollable].can-scroll:not(.scrolled-to-bottom) {	3344 }

2970 border-bottom-color: var(--google-grey-300);	3345

2971 }	3346 [scrollable].can-scroll:not(.scrolled-to-bottom) {

2972 [scrollable] :focus {	3347 border-bottom-color: var(--google-grey-300);

2973 @apply(--cr-list-item-focus);	3348 }

2974 @apply(--cr-selectable-focus);	3349

2975 }	3350 [scrollable] :focus {

2976 [scrollable] iron-list > * {	3351 ;

2977 @apply(--cr-actionable);	3352 background-color: var(--cr-selectable-focus_-_background-color); outline : var(--cr-selectable-focus_-_outline);

2978 }	3353 }

2979	3354

2980 [selectable] :focus {	3355 [scrollable] iron-list > * {

2981 @apply(--cr-selectable-focus);	3356 cursor: var(--cr-actionable_-_cursor);

2982 }	3357 }

2983 [selectable] > * {	3358

2984 @apply(--cr-actionable);	3359 [selectable] :focus {

2985 }	3360 background-color: var(--cr-selectable-focus_-_background-color); outline: var( --cr-selectable-focus_-_outline);

2986 </style>	3361 }

	3362

	3363 [selectable] > * {

	3364 cursor: var(--cr-actionable_-_cursor);

	3365 }

	3366

	3367 </style>

2987 </template>	3368 </template>

2988 </dom-module>	3369 </dom-module>

2989	3370

2990	3371

2991 <dom-module id="paper-item-shared-styles" assetpath="chrome://resources/polymer/ v1_0/paper-item/">	3372 <dom-module id="paper-item-shared-styles" assetpath="chrome://resources/polymer/ v1_0/paper-item/" css-build="shadow">

2992 <template>	3373 <template>

2993 <style>	3374 <style scope="paper-item-shared-styles">:host, .paper-item {

2994 :host, .paper-item {	3375 display: block;

2995 display: block;

2996 position: relative;	3376 position: relative;

2997 min-height: var(--paper-item-min-height, 48px);	3377 min-height: var(--paper-item-min-height, 48px);

2998 padding: 0px 16px;	3378 padding: 0px 16px;

2999 }	3379 }

3000	3380

3001 .paper-item {	3381 .paper-item {

3002 @apply(--paper-font-subhead);	3382 font-family: var(--paper-font-subhead_-_font-family); -webkit-font-smoothing: var(--paper-font-subhead_-_-webkit-font-smoothing); font-size: var(--paper-font- subhead_-_font-size); font-weight: var(--paper-font-subhead_-_font-weight); line -height: var(--paper-font-subhead_-_line-height);

3003 border:none;	3383 border:none;

3004 outline: none;	3384 outline: none;

3005 background: white;	3385 background: white;

3006 width: 100%;	3386 width: 100%;

3007 text-align: left;	3387 text-align: left;

3008 }	3388 }

3009	3389

3010 :host([hidden]), .paper-item[hidden] {	3390 :host([hidden]), .paper-item[hidden] {

3011 display: none !important;	3391 display: none !important;

3012 }	3392 }

3013	3393

3014 :host(.iron-selected), .paper-item.iron-selected {	3394 :host(.iron-selected), .paper-item.iron-selected {

3015 font-weight: var(--paper-item-selected-weight, bold);	3395 font-weight: var(--paper-item-selected-weight, bold);

3016	3396

3017 @apply(--paper-item-selected);	3397 ;

3018 }	3398 }

3019	3399

3020 :host([disabled]), .paper-item[disabled] {	3400 :host([disabled]), .paper-item[disabled] {

3021 color: var(--paper-item-disabled-color, --disabled-text-color);	3401 color: var(--paper-item-disabled-color,var(--disabled-text-color));;

3022	3402

3023 @apply(--paper-item-disabled);	3403 ;

3024 }	3404 }

3025	3405

3026 :host(:focus), .paper-item:focus {	3406 :host(:focus), .paper-item:focus {

3027 position: relative;	3407 position: relative;

3028 outline: 0;	3408 outline: 0;

3029	3409

3030 @apply(--paper-item-focused);	3410 ;

3031 }	3411 }

3032	3412

3033 :host(:focus):before, .paper-item:focus:before {	3413 :host(:focus):before, .paper-item:focus:before {

3034 @apply(--layout-fit);	3414 position: var(--layout-fit_-_position); top: var(--layout-fit_-_top); right: v ar(--layout-fit_-_right); bottom: var(--layout-fit_-_bottom); left: var(--layout -fit_-_left);

3035	3415

3036 background: currentColor;	3416 background: currentColor;

3037 content: '';	3417 content: '';

3038 opacity: var(--dark-divider-opacity);	3418 opacity: var(--dark-divider-opacity);

3039 pointer-events: none;	3419 pointer-events: none;

3040	3420

3041 @apply(--paper-item-focused-before);	3421 ;

3042 }	3422 }

3043 </style>	3423

	3424 </style>

3044 </template>	3425 </template>

3045 </dom-module>	3426 </dom-module>

3046	3427

3047	3428

3048 <dom-module id="paper-item" assetpath="chrome://resources/polymer/v1_0/paper-ite m/">	3429 <dom-module id="paper-item" assetpath="chrome://resources/polymer/v1_0/paper-ite m/" css-build="shadow">

3049 <template>	3430 <template>

3050 <style include="paper-item-shared-styles"></style>	3431

3051 <style>	3432 <style scope="paper-item">:host, .paper-item {

3052 :host {	3433 display: block;

3053 @apply(--layout-horizontal);	3434 position: relative;

3054 @apply(--layout-center);	3435 min-height: var(--paper-item-min-height, 48px);

3055 @apply(--paper-font-subhead);	3436 padding: 0px 16px;

3056	3437 }

3057 @apply(--paper-item);	3438

3058 }	3439 .paper-item {

3059 </style>	3440 font-family: var(--paper-font-subhead_-_font-family); -webkit-font-smoothing: var(--paper-font-subhead_-_-webkit-font-smoothing); font-size: var(--paper-font- subhead_-_font-size); font-weight: var(--paper-font-subhead_-_font-weight); line -height: var(--paper-font-subhead_-_line-height);

	3441 border:none;

	3442 outline: none;

	3443 background: white;

	3444 width: 100%;

	3445 text-align: left;

	3446 }

	3447

	3448 :host([hidden]), .paper-item[hidden] {

	3449 display: none !important;

	3450 }

	3451

	3452 :host(.iron-selected), .paper-item.iron-selected {

	3453 font-weight: var(--paper-item-selected-weight, bold);

	3454

	3455 ;

	3456 }

	3457

	3458 :host([disabled]), .paper-item[disabled] {

	3459 color: var(--paper-item-disabled-color,var(--disabled-text-color));;

	3460

	3461 ;

	3462 }

	3463

	3464 :host(:focus), .paper-item:focus {

	3465 position: relative;

	3466 outline: 0;

	3467

	3468 ;

	3469 }

	3470

	3471 :host(:focus):before, .paper-item:focus:before {

	3472 position: var(--layout-fit_-_position); top: var(--layout-fit_-_top); right: v ar(--layout-fit_-_right); bottom: var(--layout-fit_-_bottom); left: var(--layout -fit_-_left);

	3473

	3474 background: currentColor;

	3475 content: '';

	3476 opacity: var(--dark-divider-opacity);

	3477 pointer-events: none;

	3478

	3479 ;

	3480 }

	3481

	3482 :host {

	3483 display: var(--layout-horizontal_-_display); -ms-flex-direction: var(--layout- horizontal_-_-ms-flex-direction); -webkit-flex-direction: var(--layout-horizonta l_-_-webkit-flex-direction); flex-direction: var(--layout-horizontal_-_flex-dire ction);

	3484 -ms-flex-align: var(--layout-center_-_-ms-flex-align); -webkit-align-ite ms: var(--layout-center_-_-webkit-align-items); align-items: var(--layout-center _-_align-items);

	3485 font-family: var(--paper-font-subhead_-_font-family); -webkit-font-smoot hing: var(--paper-font-subhead_-_-webkit-font-smoothing); font-size: var(--paper -font-subhead_-_font-size); font-weight: var(--paper-font-subhead_-_font-weight) ; line-height: var(--paper-font-subhead_-_line-height);

	3486

	3487 ;

	3488 }

	3489

	3490 </style>

3060	3491

3061 <content></content>	3492 <content></content>

3062 </template>	3493 </template>

3063	3494

3064 </dom-module>	3495 </dom-module>

3065 <link rel="import" href="chrome://history/constants.html">	3496 <link rel="import" href="chrome://history/constants.html">

3066 <dom-module id="iron-collapse" assetpath="chrome://resources/polymer/v1_0/iron-c ollapse/">	3497 <dom-module id="iron-collapse" assetpath="chrome://resources/polymer/v1_0/iron-c ollapse/" css-build="shadow">

3067	3498

3068 <template>	3499 <template>

3069	3500

3070 <style>	3501 <style scope="iron-collapse">:host {

3071 :host {	3502 display: block;

3072 display: block;

3073 transition-duration: var(--iron-collapse-transition-duration, 300ms);	3503 transition-duration: var(--iron-collapse-transition-duration, 300ms);

3074 overflow: visible;	3504 overflow: visible;

3075 }	3505 }

3076	3506

3077 :host(.iron-collapse-closed) {	3507 :host(.iron-collapse-closed) {

3078 display: none;	3508 display: none;

3079 }	3509 }

3080	3510

3081 :host(:not(.iron-collapse-opened)) {	3511 :host(:not(.iron-collapse-opened)) {

3082 overflow: hidden;	3512 overflow: hidden;

3083 }	3513 }

3084 </style>	3514

	3515 </style>

3085	3516

3086 <content></content>	3517 <content></content>

3087	3518

3088 </template>	3519 </template>

3089	3520

3090 </dom-module>	3521 </dom-module>

3091	3522

3092 <dom-module id="paper-checkbox" assetpath="chrome://resources/polymer/v1_0/paper -checkbox/">	3523 <dom-module id="paper-checkbox" assetpath="chrome://resources/polymer/v1_0/paper -checkbox/" css-build="shadow">

3093 <template strip-whitespace="">	3524 <template strip-whitespace="">

3094 <style>	3525 <style scope="paper-checkbox">:host {

3095 :host {	3526 display: inline-block;

3096 display: inline-block;

3097 white-space: nowrap;	3527 white-space: nowrap;

3098 cursor: pointer;	3528 cursor: pointer;

3099 --calculated-paper-checkbox-size: var(--paper-checkbox-size, 18px);	3529 --calculated-paper-checkbox-size: var(--paper-checkbox-size, 18px);

3100 @apply(--paper-font-common-base);	3530 font-family: var(--paper-font-common-base_-_font-family); -webkit-font-s moothing: var(--paper-font-common-base_-_-webkit-font-smoothing);

3101 line-height: 0;	3531 line-height: 0;

3102 -webkit-tap-highlight-color: transparent;	3532 -webkit-tap-highlight-color: transparent;

3103 }	3533 }

3104	3534

3105 :host([hidden]) {	3535 :host([hidden]) {

3106 display: none !important;	3536 display: none !important;

3107 }	3537 }

3108	3538

3109 :host(:focus) {	3539 :host(:focus) {

3110 outline: none;	3540 outline: none;

3111 }	3541 }

3112	3542

3113 .hidden {	3543 .hidden {

3114 display: none;	3544 display: none;

3115 }	3545 }

3116	3546

3117 #checkboxContainer {	3547 #checkboxContainer {

3118 display: inline-block;	3548 display: inline-block;

3119 position: relative;	3549 position: relative;

3120 width: var(--calculated-paper-checkbox-size);	3550 width: var(--calculated-paper-checkbox-size);

3121 height: var(--calculated-paper-checkbox-size);	3551 height: var(--calculated-paper-checkbox-size);

3122 min-width: var(--calculated-paper-checkbox-size);	3552 min-width: var(--calculated-paper-checkbox-size);

3123 margin: var(--paper-checkbox-margin, initial);	3553 margin: var(--paper-checkbox-margin, initial);

3124 vertical-align: var(--paper-checkbox-vertical-align, middle);	3554 vertical-align: var(--paper-checkbox-vertical-align, middle);

3125 background-color: var(--paper-checkbox-unchecked-background-color, trans parent);	3555 background-color: var(--paper-checkbox-unchecked-background-color, trans parent);

3126 }	3556 }

3127	3557

3128 #ink {	3558 #ink {

3129 position: absolute;	3559 position: absolute;

3130	3560

3131 /* Center the ripple in the checkbox by negative offsetting it by	3561

3132 * (inkWidth - rippleWidth) / 2 */

3133 top: calc(0px - (2.66 * var(--calculated-paper-checkbox-size) - var(--ca lculated-paper-checkbox-size)) / 2);	3562 top: calc(0px - (2.66 * var(--calculated-paper-checkbox-size) - var(--ca lculated-paper-checkbox-size)) / 2);

3134 left: calc(0px - (2.66 * var(--calculated-paper-checkbox-size) - var(--c alculated-paper-checkbox-size)) / 2);	3563 left: calc(0px - (2.66 * var(--calculated-paper-checkbox-size) - var(--c alculated-paper-checkbox-size)) / 2);

3135 width: calc(2.66 * var(--calculated-paper-checkbox-size));	3564 width: calc(2.66 * var(--calculated-paper-checkbox-size));

3136 height: calc(2.66 * var(--calculated-paper-checkbox-size));	3565 height: calc(2.66 * var(--calculated-paper-checkbox-size));

3137 color: var(--paper-checkbox-unchecked-ink-color, --primary-text-color);	3566 color: var(--paper-checkbox-unchecked-ink-color,var(--primary-text-color ));;

3138 opacity: 0.6;	3567 opacity: 0.6;

3139 pointer-events: none;	3568 pointer-events: none;

3140 }	3569 }

3141	3570

3142 :host-context([dir="rtl"]) #ink {	3571 :host-context([dir="rtl"]) #ink {

3143 right: calc(0px - (2.66 * var(--calculated-paper-checkbox-size) - var(-- calculated-paper-checkbox-size)) / 2);	3572 right: calc(0px - (2.66 * var(--calculated-paper-checkbox-size) - var(--calcul ated-paper-checkbox-size)) / 2);

3144 left: auto;	3573 left: auto;

3145 }	3574 }

3146	3575

3147 #ink[checked] {	3576 #ink[checked] {

3148 color: var(--paper-checkbox-checked-ink-color, --primary-color);	3577 color: var(--paper-checkbox-checked-ink-color,var(--primary-color));;

3149 }	3578 }

3150	3579

3151 #checkbox {	3580 #checkbox {

3152 position: relative;	3581 position: relative;

3153 box-sizing: border-box;	3582 box-sizing: border-box;

3154 height: 100%;	3583 height: 100%;

3155 border: solid 2px;	3584 border: solid 2px;

3156 border-color: var(--paper-checkbox-unchecked-color, --primary-text-color );	3585 border-color: var(--paper-checkbox-unchecked-color,var(--primary-text-co lor));;

3157 border-radius: 2px;	3586 border-radius: 2px;

3158 pointer-events: none;	3587 pointer-events: none;

3159 -webkit-transition: background-color 140ms, border-color 140ms;	3588 -webkit-transition: background-color 140ms, border-color 140ms;

3160 transition: background-color 140ms, border-color 140ms;	3589 transition: background-color 140ms, border-color 140ms;

3161 }	3590 }

3162	3591

3163 /* checkbox checked animations */	3592 #checkbox.checked #checkmark {

3164 #checkbox.checked #checkmark {	3593 -webkit-animation: checkmark-expand 140ms ease-out forwards;

3165 -webkit-animation: checkmark-expand 140ms ease-out forwards;

3166 animation: checkmark-expand 140ms ease-out forwards;	3594 animation: checkmark-expand 140ms ease-out forwards;

3167 }	3595 }

3168	3596

3169 @-webkit-keyframes checkmark-expand {	3597 @-webkit-keyframes checkmark-expand {

3170 0% {	3598 0% {

3171 -webkit-transform: scale(0, 0) rotate(45deg);	3599 -webkit-transform: scale(0, 0) rotate(45deg);

3172 }	3600 }

3173 100% {

3174 -webkit-transform: scale(1, 1) rotate(45deg);

3175 }

3176 }

3177	3601

3178 @keyframes checkmark-expand {	3602 100% {

3179 0% {	3603 -webkit-transform: scale(1, 1) rotate(45deg);

3180 transform: scale(0, 0) rotate(45deg);	3604 }

3181 }

3182 100% {

3183 transform: scale(1, 1) rotate(45deg);

3184 }

3185 }

3186	3605

3187 #checkbox.checked {	3606 }

3188 background-color: var(--paper-checkbox-checked-color, --primary-color);

3189 border-color: var(--paper-checkbox-checked-color, --primary-color);

3190 }

3191	3607

3192 #checkmark {	3608 @keyframes checkmark-expand {

3193 position: absolute;	3609 0% {

	3610 transform: scale(0, 0) rotate(45deg);

	3611 }

	3612

	3613 100% {

	3614 transform: scale(1, 1) rotate(45deg);

	3615 }

	3616

	3617 }

	3618

	3619 #checkbox.checked {

	3620 background-color: var(--paper-checkbox-checked-color,var(--primary-color));;

	3621 border-color: var(--paper-checkbox-checked-color,var(--primary-color));;

	3622 }

	3623

	3624 #checkmark {

	3625 position: absolute;

3194 width: 36%;	3626 width: 36%;

3195 height: 70%;	3627 height: 70%;

3196 border-style: solid;	3628 border-style: solid;

3197 border-top: none;	3629 border-top: none;

3198 border-left: none;	3630 border-left: none;

3199 border-right-width: calc(2/15 * var(--calculated-paper-checkbox-size));	3631 border-right-width: calc(2/15 * var(--calculated-paper-checkbox-size));

3200 border-bottom-width: calc(2/15 * var(--calculated-paper-checkbox-size));	3632 border-bottom-width: calc(2/15 * var(--calculated-paper-checkbox-size));

3201 border-color: var(--paper-checkbox-checkmark-color, white);	3633 border-color: var(--paper-checkbox-checkmark-color, white);

3202 -webkit-transform-origin: 97% 86%;	3634 -webkit-transform-origin: 97% 86%;

3203 transform-origin: 97% 86%;	3635 transform-origin: 97% 86%;

3204 box-sizing: content-box; /* protect against page-level box-sizing */	3636 box-sizing: content-box;

3205 }	3637 }

3206	3638

3207 :host-context([dir="rtl"]) #checkmark {	3639 :host-context([dir="rtl"]) #checkmark {

3208 -webkit-transform-origin: 50% 14%;	3640 -webkit-transform-origin: 50% 14%;

3209 transform-origin: 50% 14%;	3641 transform-origin: 50% 14%;

3210 }	3642 }

3211	3643

3212 /* label */	3644 #checkboxLabel {

3213 #checkboxLabel {	3645 position: relative;

3214 position: relative;

3215 display: inline-block;	3646 display: inline-block;

3216 vertical-align: middle;	3647 vertical-align: middle;

3217 padding-left: var(--paper-checkbox-label-spacing, 8px);	3648 padding-left: var(--paper-checkbox-label-spacing, 8px);

3218 white-space: normal;	3649 white-space: normal;

3219 line-height: normal;	3650 line-height: normal;

3220 color: var(--paper-checkbox-label-color, --primary-text-color);	3651 color: var(--paper-checkbox-label-color,var(--primary-text-color));;

3221 @apply(--paper-checkbox-label);	3652 ;

3222 }	3653 }

3223	3654

3224 :host([checked]) #checkboxLabel {	3655 :host([checked]) #checkboxLabel {

3225 color: var(--paper-checkbox-label-checked-color, --paper-checkbox-label- color);	3656 color: var(--paper-checkbox-label-checked-color,var(--paper-checkbox-label-col or));;

3226 @apply(--paper-checkbox-label-checked);	3657 ;

3227 }	3658 }

3228	3659

3229 :host-context([dir="rtl"]) #checkboxLabel {	3660 :host-context([dir="rtl"]) #checkboxLabel {

3230 padding-right: var(--paper-checkbox-label-spacing, 8px);	3661 padding-right: var(--paper-checkbox-label-spacing, 8px);

3231 padding-left: 0;	3662 padding-left: 0;

3232 }	3663 }

3233	3664

3234 #checkboxLabel[hidden] {	3665 #checkboxLabel[hidden] {

3235 display: none;	3666 display: none;

3236 }	3667 }

3237	3668

3238 /* disabled state */	3669 :host([disabled]) #checkbox {

	3670 opacity: 0.5;

	3671 border-color: var(--paper-checkbox-unchecked-color,var(--primary-text-co lor));;

	3672 }

3239	3673

3240 :host([disabled]) #checkbox {	3674 :host([disabled][checked]) #checkbox {

	3675 background-color: var(--paper-checkbox-unchecked-color,var(--primary-text-colo r));;

3241 opacity: 0.5;	3676 opacity: 0.5;

3242 border-color: var(--paper-checkbox-unchecked-color, --primary-text-color );	3677 }

3243 }

3244	3678

3245 :host([disabled][checked]) #checkbox {	3679 :host([disabled]) #checkboxLabel {

3246 background-color: var(--paper-checkbox-unchecked-color, --primary-text-c olor);	3680 opacity: 0.65;

3247 opacity: 0.5;	3681 }

3248 }

3249	3682

3250 :host([disabled]) #checkboxLabel {	3683 #checkbox.invalid:not(.checked) {

3251 opacity: 0.65;	3684 border-color: var(--paper-checkbox-error-color,var(--error-color));;

3252 }	3685 }

3253	3686

3254 /* invalid state */	3687 </style>

3255 #checkbox.invalid:not(.checked) {

3256 border-color: var(--paper-checkbox-error-color, --error-color);

3257 }

3258 </style>

3259	3688

3260 <div id="checkboxContainer">	3689 <div id="checkboxContainer">

3261 <div id="checkbox" class$="[[_computeCheckboxClass(checked, invalid)]]">	3690 <div id="checkbox" class$="[[_computeCheckboxClass(checked, invalid)]]">

3262 <div id="checkmark" class$="[[_computeCheckmarkClass(checked)]]"></div>	3691 <div id="checkmark" class$="[[_computeCheckmarkClass(checked)]]"></div>

3263 </div>	3692 </div>

3264 </div>	3693 </div>

3265	3694

3266 <div id="checkboxLabel"><content></content></div>	3695 <div id="checkboxLabel"><content></content></div>

3267 </template>	3696 </template>

3268	3697

3269 </dom-module>	3698 </dom-module>

3270 <dom-module id="paper-icon-button-light" assetpath="chrome://resources/polymer/v 1_0/paper-icon-button/">	3699 <dom-module id="paper-icon-button-light" assetpath="chrome://resources/polymer/v 1_0/paper-icon-button/" css-build="shadow">

3271 <template strip-whitespace="">	3700 <template strip-whitespace="">

3272 <style>	3701 <style scope="paper-icon-button-light">:host {

3273 :host {	3702 vertical-align: middle;

3274 vertical-align: middle;

3275 color: inherit;	3703 color: inherit;

3276 outline: none;	3704 outline: none;

3277 width: 24px;	3705 width: 24px;

3278 height: 24px;	3706 height: 24px;

3279 background: none;	3707 background: none;

3280 margin: 0;	3708 margin: 0;

3281 border: none;	3709 border: none;

3282 padding: 0;	3710 padding: 0;

3283	3711

3284 position: relative;	3712 position: relative;

3285 cursor: pointer;	3713 cursor: pointer;

3286	3714

3287 /* NOTE: Both values are needed, since some phones require the value to be `transparent`. */	3715

3288 -webkit-tap-highlight-color: rgba(0, 0, 0, 0);	3716 -webkit-tap-highlight-color: rgba(0, 0, 0, 0);

3289 -webkit-tap-highlight-color: transparent;	3717 -webkit-tap-highlight-color: transparent;

3290 }	3718 }

3291	3719

3292 :host([disabled]) {	3720 :host([disabled]) {

3293 color: #9b9b9b;	3721 color: #9b9b9b;

3294 pointer-events: none;	3722 pointer-events: none;

3295 cursor: auto;	3723 cursor: auto;

3296 }	3724 }

3297	3725

3298 paper-ripple {	3726 paper-ripple {

3299 opacity: 0.6;	3727 opacity: 0.6;

3300 color: currentColor;	3728 color: currentColor;

3301 }	3729 }

3302 </style>	3730

	3731 </style>

3303 <content></content>	3732 <content></content>

3304 </template>	3733 </template>

3305 </dom-module>	3734 </dom-module>

3306 <dom-module id="history-searched-label" assetpath="chrome://history/">	3735 <dom-module id="history-searched-label" assetpath="chrome://history/" css-build= "shadow">

3307 <template>	3736 <template>

3308 <span id="container"></span>	3737 <span id="container"></span>

3309 </template>	3738 </template>

3310 </dom-module>	3739 </dom-module>

3311 <dom-module id="history-item" assetpath="chrome://history/">	3740 <dom-module id="history-item" assetpath="chrome://history/" css-build="shadow">

3312 <template>	3741 <template>

3313 <style include="shared-style">	3742 <style scope="history-item">[hidden] {

3314 :host {	3743 display: none !important;

3315 display: block;	3744 }

3316 }	3745

3317	3746 .card-title {

3318 :host(:not([embedded])) #main-container {	3747 -webkit-padding-start: 20px;

3319 position: relative;	3748 align-items: center;

3320 }	3749 border-bottom: 1px solid var(--card-border-color);

3321	3750 border-radius: 2px 2px 0 0;

3322 :host(:not([embedded])) #sizing-container {	3751 color: var(--primary-text-color);

3323 @apply(--card-sizing);	3752 display: flex;

3324 }	3753 font-size: 14px;

3325	3754 font-weight: 500;

3326 :host([is-first-item]) #main-container {	3755 height: 48px;

3327 margin-top: var(--first-card-padding-top);	3756 }

3328 }	3757

3329	3758 .centered-message {

3330 :host([is-card-end]) #main-container {	3759 align-items: center;

3331 margin-bottom: var(--card-padding-between);	3760 color: #b4b4b4;

3332 }	3761 display: flex;

3333	3762 flex: 1;

3334 :host([is-card-start][is-card-end]) #main-container {	3763 font-size: 14px;

	3764 font-weight: 500;

	3765 height: 100%;

	3766 justify-content: center;

	3767 }

	3768

	3769 .menu-item {

	3770 -webkit-user-select: none;

	3771 cursor: pointer;

	3772 font: inherit;

	3773 white-space: nowrap;

	3774 }

	3775

	3776 .website-icon {

	3777 -webkit-margin-end: 16px;

	3778 background-repeat: no-repeat;

	3779 background-size: 16px;

	3780 height: 16px;

	3781 width: 16px;

	3782 }

	3783

	3784 .website-title {

	3785 color: var(--primary-text-color);

	3786 overflow: hidden;

	3787 text-decoration: none;

	3788 text-overflow: ellipsis;

	3789 white-space: nowrap;

	3790 }

	3791

	3792 button.icon-button {

	3793 height: 36px;

	3794 width: 36px;

	3795 }

	3796

	3797 button.icon-button iron-icon {

	3798 color: var(--secondary-text-color);

	3799 height: 20px;

	3800 width: 20px;

	3801 }

	3802

	3803 button.more-vert-button {

	3804 height: 36px;

	3805 padding: 6px;

	3806 width: 36px;

	3807 }

	3808

	3809 button.more-vert-button div {

	3810 border: 2px solid var(--secondary-text-color);

3335 border-radius: 2px;	3811 border-radius: 2px;

3336 }	3812 margin: 1px 10px;

3337	3813 pointer-events: none;

3338 #date-accessed {	3814 transform: scale(0.8);

3339 display: none;	3815 }

3340 }	3816

3341	3817 :host {

3342 :host([is-card-start]) #date-accessed {	3818 display: block;

3343 display: flex;	3819 }

3344 }	3820

3345	3821 :host(:not([embedded])) #main-container {

3346 #item-container {	3822 position: relative;

3347 align-items: center;	3823 }

	3824

	3825 :host(:not([embedded])) #sizing-container {

	3826 margin: var(--card-sizing_-_margin); max-width: var(--card-sizing_-_max-width) ; min-width: var(--card-sizing_-_min-width); padding: var(--card-sizing_-_paddin g); width: var(--card-sizing_-_width);

	3827 }

	3828

	3829 :host([is-first-item]) #main-container {

	3830 margin-top: var(--first-card-padding-top);

	3831 }

	3832

	3833 :host([is-card-end]) #main-container {

	3834 margin-bottom: var(--card-padding-between);

	3835 }

	3836

	3837 :host([is-card-start][is-card-end]) #main-container {

	3838 border-radius: 2px;

	3839 }

	3840

	3841 #date-accessed {

	3842 display: none;

	3843 }

	3844

	3845 :host([is-card-start]) #date-accessed {

	3846 display: flex;

	3847 }

	3848

	3849 #item-container {

	3850 align-items: center;

3348 display: flex;	3851 display: flex;

3349 min-height: var(--item-height);	3852 min-height: var(--item-height);

3350 }	3853 }

3351	3854

3352 :host([is-card-start]) #item-container {	3855 :host([is-card-start]) #item-container {

3353 padding-top: var(--card-first-last-item-padding);	3856 padding-top: var(--card-first-last-item-padding);

3354 }	3857 }

3355	3858

3356 :host([is-card-end]) #item-container {	3859 :host([is-card-end]) #item-container {

3357 padding-bottom: var(--card-first-last-item-padding);	3860 padding-bottom: var(--card-first-last-item-padding);

3358 }	3861 }

3359	3862

3360 #title-and-domain {	3863 #title-and-domain {

3361 align-items: center;	3864 align-items: center;

3362 display: flex;	3865 display: flex;

3363 flex: 1;	3866 flex: 1;

3364 height: var(--item-height);	3867 height: var(--item-height);

3365 overflow: hidden;	3868 overflow: hidden;

3366 }	3869 }

3367	3870

3368 paper-checkbox {	3871 paper-checkbox {

3369 --paper-checkbox-checked-color: rgb(68, 136, 255);	3872 --paper-checkbox-checked-color: rgb(68, 136, 255);

3370 --paper-checkbox-size: 16px;	3873 --paper-checkbox-size: 16px;

3371 --paper-checkbox-unchecked-color: var(--secondary-text-color);	3874 --paper-checkbox-unchecked-color: var(--secondary-text-color);

3372 height: 16px;	3875 height: 16px;

3373 margin: 0 16px 0 20px;	3876 margin: 0 16px 0 20px;

3374 padding: 2px;	3877 padding: 2px;

3375 width: 16px;	3878 width: 16px;

3376 }	3879 }

3377	3880

3378 #time-accessed {	3881 #time-accessed {

3379 color: #646464;	3882 color: #646464;

3380 min-width: 96px;	3883 min-width: 96px;

3381 }	3884 }

3382	3885

3383 #domain {	3886 #domain {

3384 -webkit-margin-start: 16px;	3887 -webkit-margin-start: 16px;

3385 color: var(--secondary-text-color);	3888 color: var(--secondary-text-color);

3386 flex-shrink: 0;	3889 flex-shrink: 0;

3387 }	3890 }

3388	3891

3389 #menu-button {	3892 #menu-button {

3390 -webkit-margin-end: 12px;	3893 -webkit-margin-end: 12px;

3391 }	3894 }

3392	3895

3393 #star-container {	3896 #star-container {

3394 -webkit-margin-end: 4px;	3897 -webkit-margin-end: 4px;

3395 -webkit-margin-start: 12px;	3898 -webkit-margin-start: 12px;

3396 width: 32px;	3899 width: 32px;

3397 }	3900 }

3398	3901

3399 #bookmark-star {	3902 #bookmark-star {

3400 color: rgb(68, 136, 255);	3903 color: rgb(68, 136, 255);

3401 height: 32px;	3904 height: 32px;

3402 width: 32px;	3905 width: 32px;

3403 }	3906 }

3404	3907

3405 #bookmark-star iron-icon {	3908 #bookmark-star iron-icon {

3406 height: 16px;	3909 height: 16px;

3407 width: 16px;	3910 width: 16px;

3408 }	3911 }

3409	3912

3410 #time-gap-separator {	3913 #time-gap-separator {

3411 -webkit-border-start: 1px solid #888;	3914 -webkit-border-start: 1px solid #888;

3412 -webkit-margin-start: 77px;	3915 -webkit-margin-start: 77px;

3413 height: 15px;	3916 height: 15px;

3414 }	3917 }

3415	3918

3416 #background {	3919 #background {

3417 background: #fff;	3920 background: #fff;

3418 bottom: -1px; /* Prevents shadow artifacts when zoomed */	3921 bottom: -1px;

3419 left: 0;	3922 left: 0;

3420 position: absolute;	3923 position: absolute;

3421 right: 0;	3924 right: 0;

3422 top: 0;	3925 top: 0;

3423 z-index: -1;	3926 z-index: -1;

3424 }	3927 }

3425	3928

3426 :host([embedded]) #background {	3929 :host([embedded]) #background {

3427 display: none;	3930 display: none;

3428 }	3931 }

3429	3932

3430 :host([is-card-start]) #background {	3933 :host([is-card-start]) #background {

3431 border-radius: 2px 2px 0 0;	3934 border-radius: 2px 2px 0 0;

3432 }	3935 }

3433	3936

3434 :host([is-card-end]) #background {	3937 :host([is-card-end]) #background {

3435 border-radius: 0 0 2px 2px;	3938 border-radius: 0 0 2px 2px;

3436 bottom: 0;	3939 bottom: 0;

3437 }	3940 }

3438 </style>	3941

	3942 </style>

3439	3943

3440 <div id="sizing-container">	3944 <div id="sizing-container">

3441 <div id="main-container">	3945 <div id="main-container">

3442 <div id="background"></div>	3946 <div id="background"></div>

3443 <div id="date-accessed" class="card-title">	3947 <div id="date-accessed" class="card-title">

3444 [[cardTitle_(numberOfItems, item.dateRelativeDay, searchTerm)]]	3948 [[cardTitle_(numberOfItems, item.dateRelativeDay, searchTerm)]]

3445 </div>	3949 </div>

3446 <div id="item-container">	3950 <div id="item-container">

3447 <paper-checkbox id="checkbox" on-mousedown="onCheckboxMousedown_" on-c lick="onCheckboxSelected_" checked="{{selected}}" disabled="[[selectionNotAllowe d_()]]" aria-label$="[[getEntrySummary_(item)]]">	3951 <paper-checkbox id="checkbox" on-mousedown="onCheckboxMousedown_" on-c lick="onCheckboxSelected_" checked="{{selected}}" disabled="[[selectionNotAllowe d_()]]" aria-label$="[[getEntrySummary_(item)]]">

3448 </paper-checkbox>	3952 </paper-checkbox>

(...skipping 16 matching lines...) Expand all Loading...
3465 <div></div>	3969 <div></div>

3466 <div></div>	3970 <div></div>

3467 <div></div>	3971 <div></div>

3468 </button>	3972 </button>

3469 </div>	3973 </div>

3470 <div id="time-gap-separator" hidden="[[!hasTimeGap]]"></div>	3974 <div id="time-gap-separator" hidden="[[!hasTimeGap]]"></div>

3471 </div>	3975 </div>

3472 </div>	3976 </div>

3473 </template>	3977 </template>

3474 </dom-module>	3978 </dom-module>

3475 <dom-module id="history-grouped-list" assetpath="chrome://history/">	3979 <dom-module id="history-grouped-list" assetpath="chrome://history/" css-build="s hadow">

3476 <template>	3980 <template>

3477 <style include="shared-style">	3981 <style scope="history-grouped-list">[hidden] {

3478 :host {	3982 display: none !important;

3479 display: block;	3983 }

	3984

	3985 .card-title {

	3986 -webkit-padding-start: 20px;

	3987 align-items: center;

	3988 border-bottom: 1px solid var(--card-border-color);

	3989 border-radius: 2px 2px 0 0;

	3990 color: var(--primary-text-color);

	3991 display: flex;

	3992 font-size: 14px;

	3993 font-weight: 500;

	3994 height: 48px;

	3995 }

	3996

	3997 .centered-message {

	3998 align-items: center;

	3999 color: #b4b4b4;

	4000 display: flex;

	4001 flex: 1;

	4002 font-size: 14px;

	4003 font-weight: 500;

	4004 height: 100%;

	4005 justify-content: center;

	4006 }

	4007

	4008 .menu-item {

	4009 -webkit-user-select: none;

	4010 cursor: pointer;

	4011 font: inherit;

	4012 white-space: nowrap;

	4013 }

	4014

	4015 .website-icon {

	4016 -webkit-margin-end: 16px;

	4017 background-repeat: no-repeat;

	4018 background-size: 16px;

	4019 height: 16px;

	4020 width: 16px;

	4021 }

	4022

	4023 .website-title {

	4024 color: var(--primary-text-color);

	4025 overflow: hidden;

	4026 text-decoration: none;

	4027 text-overflow: ellipsis;

	4028 white-space: nowrap;

	4029 }

	4030

	4031 button.icon-button {

	4032 height: 36px;

	4033 width: 36px;

	4034 }

	4035

	4036 button.icon-button iron-icon {

	4037 color: var(--secondary-text-color);

	4038 height: 20px;

	4039 width: 20px;

	4040 }

	4041

	4042 button.more-vert-button {

	4043 height: 36px;

	4044 padding: 6px;

	4045 width: 36px;

	4046 }

	4047

	4048 button.more-vert-button div {

	4049 border: 2px solid var(--secondary-text-color);

	4050 border-radius: 2px;

	4051 margin: 1px 10px;

	4052 pointer-events: none;

	4053 transform: scale(0.8);

	4054 }

	4055

	4056 :host {

	4057 display: block;

3480 overflow: auto;	4058 overflow: auto;

3481 position: relative;	4059 position: relative;

3482 }	4060 }

3483	4061

3484 #main-container {	4062 #main-container {

3485 @apply(--card-sizing);	4063 margin: var(--card-sizing_-_margin); max-width: var(--card-sizing_-_max-width) ; min-width: var(--card-sizing_-_min-width); padding: var(--card-sizing_-_paddin g); width: var(--card-sizing_-_width);

3486 align-items: center;	4064 align-items: center;

3487 display: flex;	4065 display: flex;

3488 flex-direction: column;	4066 flex-direction: column;

3489 padding-top: var(--first-card-padding-top);	4067 padding-top: var(--first-card-padding-top);

3490 }	4068 }

3491	4069

3492 .domain-heading {	4070 .domain-heading {

3493 align-items: center;	4071 align-items: center;

3494 display: flex;	4072 display: flex;

3495 height: var(--item-height);	4073 height: var(--item-height);

3496 padding: 0 20px;	4074 padding: 0 20px;

3497 }	4075 }

3498	4076

3499 .domain-count {	4077 .domain-count {

3500 color: rgb(151, 156, 160);	4078 color: rgb(151, 156, 160);

3501 padding-left: 10px;	4079 padding-left: 10px;

3502 }	4080 }

3503	4081

3504 .domain-heading-text {	4082 .domain-heading-text {

3505 display: flex;	4083 display: flex;

3506 }	4084 }

3507	4085

3508 .group-container {	4086 .group-container {

3509 @apply(--card-box-shadow);	4087 box-shadow: var(--card-box-shadow_-_box-shadow);

3510 background: #fff;	4088 background: #fff;

3511 border-radius: 2px;	4089 border-radius: 2px;

3512 margin-bottom: var(--card-padding-between);	4090 margin-bottom: var(--card-padding-between);

3513 max-width: var(--card-max-width);	4091 max-width: var(--card-max-width);

3514 min-width: var(--card-min-width);	4092 min-width: var(--card-min-width);

3515 width: 100%;	4093 width: 100%;

3516 }	4094 }

3517	4095

3518 .card-title {	4096 .card-title {

3519 margin-bottom: var(--card-first-last-item-padding);	4097 margin-bottom: var(--card-first-last-item-padding);

3520 }	4098 }

3521	4099

3522 .domain-heading-text {	4100 .domain-heading-text {

3523 flex: 1 1 0;	4101 flex: 1 1 0;

3524 }	4102 }

3525	4103

3526 .dropdown-indicator {	4104 .dropdown-indicator {

3527 max-width: 16px;	4105 max-width: 16px;

3528 }	4106 }

3529	4107

3530 history-item {	4108 history-item {

3531 padding-left: 20px;	4109 padding-left: 20px;

3532 }	4110 }

3533 </style>	4111

	4112 </style>

3534 <div id="no-results" class="centered-message" hidden$="[[hasResults(groupedH istoryData_.length)]]">	4113 <div id="no-results" class="centered-message" hidden$="[[hasResults(groupedH istoryData_.length)]]">

3535 [[noResultsMessage(searchedTerm, querying)]]	4114 [[noResultsMessage(searchedTerm, querying)]]

3536 </div>	4115 </div>

3537 <div id="main-container" hidden$="[[!hasResults(groupedHistoryData_.length)] ]">	4116 <div id="main-container" hidden$="[[!hasResults(groupedHistoryData_.length)] ]">

3538 <template is="dom-repeat" items="[[groupedHistoryData_]]" as="group" initi al-count="1" index-as="groupIndex">	4117 <template is="dom-repeat" items="[[groupedHistoryData_]]" as="group" initi al-count="1" index-as="groupIndex">

3539 <div class="group-container">	4118 <div class="group-container">

3540 <div class="card-title">	4119 <div class="card-title">

3541 [[group.title]]	4120 [[group.title]]

3542 </div>	4121 </div>

3543	4122

(...skipping 19 matching lines...) Expand all Loading...
3563 </iron-collapse>	4142 </iron-collapse>

3564 </div>	4143 </div>

3565 </template>	4144 </template>

3566 </div>	4145 </div>

3567 </template>	4146 </template>

3568 </div>	4147 </div>

3569 </template>	4148 </template>

3570 </dom-module>	4149 </dom-module>

3571	4150

3572	4151

3573 <dom-module id="iron-list" assetpath="chrome://resources/polymer/v1_0/iron-list/ ">	4152 <dom-module id="iron-list" assetpath="chrome://resources/polymer/v1_0/iron-list/ " css-build="shadow">

3574 <template>	4153 <template>

3575 <style>	4154 <style scope="iron-list">:host {

3576 :host {	4155 display: block;

3577 display: block;

3578 position: relative;	4156 position: relative;

3579 }	4157 }

3580	4158

3581 @media only screen and (-webkit-max-device-pixel-ratio: 1) {	4159 @media only screen and (-webkit-max-device-pixel-ratio: 1) {

3582 :host {	4160 :host {

3583 will-change: transform;	4161 will-change: transform;

3584 }	4162 }

3585 }

3586	4163

3587 #items {	4164 }

3588 @apply(--iron-list-items-container);	4165

	4166 #items {

	4167 ;

3589 position: relative;	4168 position: relative;

3590 }	4169 }

3591	4170

3592 :host(:not([grid])) #items > ::content > * {	4171 :host(:not([grid])) #items > ::content > * {

3593 width: 100%;	4172 width: 100%;

3594 };	4173 }

3595	4174

3596 #items > ::content > * {	4175 #items > ::content > * {

3597 box-sizing: border-box;	4176 box-sizing: border-box;

3598 margin: 0;	4177 margin: 0;

3599 position: absolute;	4178 position: absolute;

3600 top: 0;	4179 top: 0;

3601 will-change: transform;	4180 will-change: transform;

3602 }	4181 }

3603 </style>	4182

	4183 </style>

3604	4184

3605 <array-selector id="selector" items="{{items}}" selected="{{selectedItems}}" selected-item="{{selectedItem}}">	4185 <array-selector id="selector" items="{{items}}" selected="{{selectedItems}}" selected-item="{{selectedItem}}">

3606 </array-selector>	4186 </array-selector>

3607	4187

3608 <div id="items">	4188 <div id="items">

3609 <content></content>	4189 <content></content>

3610 </div>	4190 </div>

3611	4191

3612 </template>	4192 </template>

3613 </dom-module>	4193 </dom-module>

3614	4194

3615 <dom-module id="iron-scroll-threshold" assetpath="chrome://resources/polymer/v1_ 0/iron-scroll-threshold/">	4195 <dom-module id="iron-scroll-threshold" assetpath="chrome://resources/polymer/v1_ 0/iron-scroll-threshold/" css-build="shadow">

3616 <template>	4196 <template>

3617 <style>	4197 <style scope="iron-scroll-threshold">:host {

3618 :host {	4198 display: block;

3619 display: block;	4199 }

3620 }	4200

3621 </style>	4201 </style>

3622	4202

3623 <content></content>	4203 <content></content>

3624	4204

3625 </template>	4205 </template>

3626 </dom-module>	4206 </dom-module>

3627	4207

3628 <dom-module id="history-list" assetpath="chrome://history/">	4208 <dom-module id="history-list" assetpath="chrome://history/" css-build="shadow">

3629 <template>	4209 <template>

3630 <style include="shared-style">	4210 <style scope="history-list">[hidden] {

3631 :host {	4211 display: none !important;

3632 display: block;	4212 }

	4213

	4214 .card-title {

	4215 -webkit-padding-start: 20px;

	4216 align-items: center;

	4217 border-bottom: 1px solid var(--card-border-color);

	4218 border-radius: 2px 2px 0 0;

	4219 color: var(--primary-text-color);

	4220 display: flex;

	4221 font-size: 14px;

	4222 font-weight: 500;

	4223 height: 48px;

	4224 }

	4225

	4226 .centered-message {

	4227 align-items: center;

	4228 color: #b4b4b4;

	4229 display: flex;

	4230 flex: 1;

	4231 font-size: 14px;

	4232 font-weight: 500;

	4233 height: 100%;

	4234 justify-content: center;

	4235 }

	4236

	4237 .menu-item {

	4238 -webkit-user-select: none;

	4239 cursor: pointer;

	4240 font: inherit;

	4241 white-space: nowrap;

	4242 }

	4243

	4244 .website-icon {

	4245 -webkit-margin-end: 16px;

	4246 background-repeat: no-repeat;

	4247 background-size: 16px;

	4248 height: 16px;

	4249 width: 16px;

	4250 }

	4251

	4252 .website-title {

	4253 color: var(--primary-text-color);

	4254 overflow: hidden;

	4255 text-decoration: none;

	4256 text-overflow: ellipsis;

	4257 white-space: nowrap;

	4258 }

	4259

	4260 button.icon-button {

	4261 height: 36px;

	4262 width: 36px;

	4263 }

	4264

	4265 button.icon-button iron-icon {

	4266 color: var(--secondary-text-color);

	4267 height: 20px;

	4268 width: 20px;

	4269 }

	4270

	4271 button.more-vert-button {

	4272 height: 36px;

	4273 padding: 6px;

	4274 width: 36px;

	4275 }

	4276

	4277 button.more-vert-button div {

	4278 border: 2px solid var(--secondary-text-color);

	4279 border-radius: 2px;

	4280 margin: 1px 10px;

	4281 pointer-events: none;

	4282 transform: scale(0.8);

	4283 }

	4284

	4285 :host {

	4286 display: block;

3633 overflow: auto;	4287 overflow: auto;

3634 }	4288 }

3635	4289

3636 #infinite-list {	4290 #infinite-list {

3637 @apply(--card-container-filter);	4291 filter: var(--card-container-filter_-_filter);

3638 }	4292 }

3639	4293

3640 history-item {	4294 history-item {

3641 --history-item-padding-side: var(--card-padding-side);	4295 --history-item-padding-side: var(--card-padding-side);

3642 }	4296 }

3643 </style>	4297

	4298 </style>

3644 <div id="no-results" class="centered-message" hidden$="[[hasResults(historyD ata_.length)]]">	4299 <div id="no-results" class="centered-message" hidden$="[[hasResults(historyD ata_.length)]]">

3645 {{noResultsMessage(searchedTerm, querying)}}	4300 {{noResultsMessage(searchedTerm, querying)}}

3646 </div>	4301 </div>

3647 <iron-list items="{{historyData_}}" as="item" id="infinite-list" hidden$="[[ !hasResults(historyData_.length)]]">	4302 <iron-list items="{{historyData_}}" as="item" id="infinite-list" hidden$="[[ !hasResults(historyData_.length)]]">

3648 <template>	4303 <template>

3649 <history-item item="[[item]]" selected="{{item.selected}}" is-first-item ="[[isFirstItem_(index)]]" is-card-start="[[isCardStart_(item, index, historyDat a_.length)]]" is-card-end="[[isCardEnd_(item, index, historyData_.length)]]" has -time-gap="[[needsTimeGap_(item, index, historyData_.length)]]" search-term="[[s earchedTerm]]" number-of-items="[[historyData_.length]]" path="[[pathForItem_(in dex)]]" index="[[index]]">	4304 <history-item item="[[item]]" selected="{{item.selected}}" is-first-item ="[[isFirstItem_(index)]]" is-card-start="[[isCardStart_(item, index, historyDat a_.length)]]" is-card-end="[[isCardEnd_(item, index, historyData_.length)]]" has -time-gap="[[needsTimeGap_(item, index, historyData_.length)]]" search-term="[[s earchedTerm]]" number-of-items="[[historyData_.length]]" path="[[pathForItem_(in dex)]]" index="[[index]]">

3650 </history-item>	4305 </history-item>

3651 </template>	4306 </template>

3652 </iron-list>	4307 </iron-list>

3653 <iron-scroll-threshold id="scroll-threshold" scroll-target="infinite-list" l ower-threshold="500" on-lower-threshold="loadMoreData_">	4308 <iron-scroll-threshold id="scroll-threshold" scroll-target="infinite-list" l ower-threshold="500" on-lower-threshold="loadMoreData_">

3654 </iron-scroll-threshold>	4309 </iron-scroll-threshold>

3655 </template>	4310 </template>

3656 </dom-module>	4311 </dom-module>

3657 <dom-module id="history-list-container" assetpath="chrome://history/">	4312 <dom-module id="history-list-container" assetpath="chrome://history/" css-build= "shadow">

3658 <template>	4313 <template>

3659 <style include="shared-style cr-shared-style">	4314 <style scope="history-list-container">[hidden] {

3660 :host {	4315 display: none !important;

3661 display: block;	4316 }

	4317

	4318 .card-title {

	4319 -webkit-padding-start: 20px;

	4320 align-items: center;

	4321 border-bottom: 1px solid var(--card-border-color);

	4322 border-radius: 2px 2px 0 0;

	4323 color: var(--primary-text-color);

	4324 display: flex;

	4325 font-size: 14px;

	4326 font-weight: 500;

	4327 height: 48px;

	4328 }

	4329

	4330 .centered-message {

	4331 align-items: center;

	4332 color: #b4b4b4;

	4333 display: flex;

	4334 flex: 1;

	4335 font-size: 14px;

	4336 font-weight: 500;

	4337 height: 100%;

	4338 justify-content: center;

	4339 }

	4340

	4341 .menu-item {

	4342 -webkit-user-select: none;

	4343 cursor: pointer;

	4344 font: inherit;

	4345 white-space: nowrap;

	4346 }

	4347

	4348 .website-icon {

	4349 -webkit-margin-end: 16px;

	4350 background-repeat: no-repeat;

	4351 background-size: 16px;

	4352 height: 16px;

	4353 width: 16px;

	4354 }

	4355

	4356 .website-title {

	4357 color: var(--primary-text-color);

	4358 overflow: hidden;

	4359 text-decoration: none;

	4360 text-overflow: ellipsis;

	4361 white-space: nowrap;

	4362 }

	4363

	4364 button.icon-button {

	4365 height: 36px;

	4366 width: 36px;

	4367 }

	4368

	4369 button.icon-button iron-icon {

	4370 color: var(--secondary-text-color);

	4371 height: 20px;

	4372 width: 20px;

	4373 }

	4374

	4375 button.more-vert-button {

	4376 height: 36px;

	4377 padding: 6px;

	4378 width: 36px;

	4379 }

	4380

	4381 button.more-vert-button div {

	4382 border: 2px solid var(--secondary-text-color);

	4383 border-radius: 2px;

	4384 margin: 1px 10px;

	4385 pointer-events: none;

	4386 transform: scale(0.8);

	4387 }

	4388

	4389 paper-spinner {

	4390 --paper-spinner-layer-1-color: var(--google-blue-500);

	4391 --paper-spinner-layer-2-color: var(--google-blue-500);

	4392 --paper-spinner-layer-3-color: var(--google-blue-500);

	4393 --paper-spinner-layer-4-color: var(--google-blue-500);

	4394 }

	4395

	4396 .action-button {

	4397 background: var(--google-blue-500);

	4398 color: white;

	4399 --paper-button-flat-keyboard-focus_-_background: rgb(58, 117, 215);;

	4400 }

	4401

	4402 .action-button[disabled] {

	4403 opacity: .25;

	4404 }

	4405

	4406 .cancel-button {

	4407 --paper-button-flat-keyboard-focus_-_background: rgba(0, 0, 0, .12);;

	4408 }

	4409

	4410 .action-button, .cancel-button {

	4411 font-weight: 500;

	4412 }

	4413

	4414 [actionable] {

	4415 cursor: var(--cr-actionable_-_cursor);

	4416 }

	4417

	4418 [scrollable] {

	4419 border-color: transparent;

	4420 border-style: solid;

	4421 border-width: 1px 0;

	4422 overflow-y: auto;

	4423 }

	4424

	4425 [scrollable].is-scrolled {

	4426 border-top-color: var(--google-grey-300);

	4427 }

	4428

	4429 [scrollable].can-scroll:not(.scrolled-to-bottom) {

	4430 border-bottom-color: var(--google-grey-300);

	4431 }

	4432

	4433 [scrollable] :focus {

	4434 ;

	4435 background-color: var(--cr-selectable-focus_-_background-color); outline : var(--cr-selectable-focus_-_outline);

	4436 }

	4437

	4438 [scrollable] iron-list > * {

	4439 cursor: var(--cr-actionable_-_cursor);

	4440 }

	4441

	4442 [selectable] :focus {

	4443 background-color: var(--cr-selectable-focus_-_background-color); outline: var( --cr-selectable-focus_-_outline);

	4444 }

	4445

	4446 [selectable] > * {

	4447 cursor: var(--cr-actionable_-_cursor);

	4448 }

	4449

	4450 :host {

	4451 display: block;

3662 height: 100%;	4452 height: 100%;

3663 overflow: hidden;	4453 overflow: hidden;

3664 }	4454 }

3665	4455

3666 #content,	4456 #content, #content > * {

3667 #content > * {	4457 height: 100%;

3668 height: 100%;	4458 }

3669 }

3670	4459

3671 dialog .body {	4460 dialog .body {

3672 white-space: pre-wrap;	4461 white-space: pre-wrap;

3673 }	4462 }

3674 </style>	4463

	4464 </style>

3675 <iron-pages id="content" attr-for-selected="id" selected="[[selectedPage_]]" >	4465 <iron-pages id="content" attr-for-selected="id" selected="[[selectedPage_]]" >

3676 <history-list id="infinite-list" querying="[[queryState.querying]]" search ed-term="[[queryResult.info.term]]"></history-list>	4466 <history-list id="infinite-list" querying="[[queryState.querying]]" search ed-term="[[queryResult.info.term]]"></history-list>

3677 <template is="dom-if" if="[[grouped]]">	4467 <template is="dom-if" if="[[grouped]]">

3678 <history-grouped-list id="grouped-list" range="[[groupedRange]]" query-s tart-time="[[queryResult.info.queryStartTime]]" query-end-time="[[queryResult.in fo.queryEndTime]]" searched-term="[[queryResult.info.term]]">	4468 <history-grouped-list id="grouped-list" range="[[groupedRange]]" query-s tart-time="[[queryResult.info.queryStartTime]]" query-end-time="[[queryResult.in fo.queryEndTime]]" searched-term="[[queryResult.info.term]]">

3679 </history-grouped-list>	4469 </history-grouped-list>

3680 </template>	4470 </template>

3681 </iron-pages>	4471 </iron-pages>

3682	4472

3683 <template is="history-lazy-render" id="dialog">	4473 <template is="history-lazy-render" id="dialog">

3684 <dialog is="cr-dialog">	4474 <dialog is="cr-dialog">

(...skipping 15 matching lines...) Expand all Loading...
3700 <paper-item id="menuMoreButton" class="menu-item" on-tap="onMoreFromSite Tap_">	4490 <paper-item id="menuMoreButton" class="menu-item" on-tap="onMoreFromSite Tap_">

3701 $i18n{moreFromSite}	4491 $i18n{moreFromSite}

3702 </paper-item>	4492 </paper-item>

3703 <paper-item id="menuRemoveButton" class="menu-item" on-tap="onRemoveFrom HistoryTap_">	4493 <paper-item id="menuRemoveButton" class="menu-item" on-tap="onRemoveFrom HistoryTap_">

3704 $i18n{removeFromHistory}	4494 $i18n{removeFromHistory}

3705 </paper-item>	4495 </paper-item>

3706 </cr-shared-menu>	4496 </cr-shared-menu>

3707 </template>	4497 </template>

3708 </template>	4498 </template>

3709 </dom-module>	4499 </dom-module>

3710 <dom-module id="history-synced-device-card" assetpath="chrome://history/">	4500 <dom-module id="history-synced-device-card" assetpath="chrome://history/" css-bu ild="shadow">

3711 <template>	4501 <template>

3712 <style include="shared-style">	4502 <style scope="history-synced-device-card">[hidden] {

3713 :host {	4503 display: none !important;

3714 @apply(--card-sizing);	4504 }

	4505

	4506 .card-title {

	4507 -webkit-padding-start: 20px;

	4508 align-items: center;

	4509 border-bottom: 1px solid var(--card-border-color);

	4510 border-radius: 2px 2px 0 0;

	4511 color: var(--primary-text-color);

	4512 display: flex;

	4513 font-size: 14px;

	4514 font-weight: 500;

	4515 height: 48px;

	4516 }

	4517

	4518 .centered-message {

	4519 align-items: center;

	4520 color: #b4b4b4;

	4521 display: flex;

	4522 flex: 1;

	4523 font-size: 14px;

	4524 font-weight: 500;

	4525 height: 100%;

	4526 justify-content: center;

	4527 }

	4528

	4529 .menu-item {

	4530 -webkit-user-select: none;

	4531 cursor: pointer;

	4532 font: inherit;

	4533 white-space: nowrap;

	4534 }

	4535

	4536 .website-icon {

	4537 -webkit-margin-end: 16px;

	4538 background-repeat: no-repeat;

	4539 background-size: 16px;

	4540 height: 16px;

	4541 width: 16px;

	4542 }

	4543

	4544 .website-title {

	4545 color: var(--primary-text-color);

	4546 overflow: hidden;

	4547 text-decoration: none;

	4548 text-overflow: ellipsis;

	4549 white-space: nowrap;

	4550 }

	4551

	4552 button.icon-button {

	4553 height: 36px;

	4554 width: 36px;

	4555 }

	4556

	4557 button.icon-button iron-icon {

	4558 color: var(--secondary-text-color);

	4559 height: 20px;

	4560 width: 20px;

	4561 }

	4562

	4563 button.more-vert-button {

	4564 height: 36px;

	4565 padding: 6px;

	4566 width: 36px;

	4567 }

	4568

	4569 button.more-vert-button div {

	4570 border: 2px solid var(--secondary-text-color);

	4571 border-radius: 2px;

	4572 margin: 1px 10px;

	4573 pointer-events: none;

	4574 transform: scale(0.8);

	4575 }

	4576

	4577 :host {

	4578 margin: var(--card-sizing_-_margin); max-width: var(--card-sizing_-_max-width) ; min-width: var(--card-sizing_-_min-width); padding: var(--card-sizing_-_paddin g); width: var(--card-sizing_-_width);

3715 display: block;	4579 display: block;

3716 padding-bottom: var(--card-padding-between);	4580 padding-bottom: var(--card-padding-between);

3717 }	4581 }

3718	4582

3719 #card-heading {	4583 #card-heading {

3720 cursor: pointer;	4584 cursor: pointer;

3721 justify-content: space-between;	4585 justify-content: space-between;

3722 }	4586 }

3723	4587

3724 #tab-item-list {	4588 #tab-item-list {

3725 padding: 8px 0;	4589 padding: 8px 0;

3726 }	4590 }

3727	4591

3728 #last-update-time {	4592 #last-update-time {

3729 color: var(--secondary-text-color);	4593 color: var(--secondary-text-color);

3730 }	4594 }

3731	4595

3732 #right-buttons {	4596 #right-buttons {

3733 -webkit-margin-end: 4px;	4597 -webkit-margin-end: 4px;

3734 }	4598 }

3735	4599

3736 #menu-button {	4600 #menu-button {

3737 -webkit-margin-end: 8px;	4601 -webkit-margin-end: 8px;

3738 }	4602 }

3739	4603

3740 #collapse {	4604 #collapse {

3741 overflow: hidden;	4605 overflow: hidden;

3742 }	4606 }

3743	4607

3744 #history-item-container {	4608 #history-item-container {

3745 @apply(--card-box-shadow);	4609 box-shadow: var(--card-box-shadow_-_box-shadow);

3746 background: #fff;	4610 background: #fff;

3747 border-radius: 2px;	4611 border-radius: 2px;

3748 }	4612 }

3749	4613

3750 #item-container {	4614 #item-container {

3751 align-items: center;	4615 align-items: center;

3752 display: flex;	4616 display: flex;

3753 margin: 0 20px;	4617 margin: 0 20px;

3754 min-height: var(--item-height);	4618 min-height: var(--item-height);

3755 }	4619 }

3756	4620

3757 #window-separator {	4621 #window-separator {

3758 background-color: var(--card-border-color);	4622 background-color: var(--card-border-color);

3759 height: 1px;	4623 height: 1px;

3760 margin: 5px auto;	4624 margin: 5px auto;

3761 width: 80%;	4625 width: 80%;

3762 }	4626 }

3763 </style>	4627

	4628 </style>

3764 <div id="history-item-container">	4629 <div id="history-item-container">

3765 <div class="card-title" id="card-heading" aria-expanded$="[[opened]]" aria -controls="collapse" on-tap="toggleTabCard">	4630 <div class="card-title" id="card-heading" aria-expanded$="[[opened]]" aria -controls="collapse" on-tap="toggleTabCard">

3766 <div>	4631 <div>

3767 [[device]]	4632 [[device]]

3768 <span id="last-update-time">[[lastUpdateTime]]</span>	4633 <span id="last-update-time">[[lastUpdateTime]]</span>

3769 </div>	4634 </div>

3770 <div id="right-buttons">	4635 <div id="right-buttons">

3771 <button is="paper-icon-button-light" id="menu-button" class="more-vert -button" on-tap="onMenuButtonTap_" title="$i18n{moreActionsButton}">	4636 <button is="paper-icon-button-light" id="menu-button" class="more-vert -button" on-tap="onMenuButtonTap_" title="$i18n{moreActionsButton}">

3772 <div></div>	4637 <div></div>

3773 <div></div>	4638 <div></div>

(...skipping 16 matching lines...) Expand all Loading...
3790 </a>	4655 </a>

3791 </div>	4656 </div>

3792 <div id="window-separator" hidden$="[[!isWindowSeparatorIndex_(index , separatorIndexes)]]">	4657 <div id="window-separator" hidden$="[[!isWindowSeparatorIndex_(index , separatorIndexes)]]">

3793 </div>	4658 </div>

3794 </template>	4659 </template>

3795 </div>	4660 </div>

3796 </iron-collapse>	4661 </iron-collapse>

3797 </div>	4662 </div>

3798 </template>	4663 </template>

3799 </dom-module>	4664 </dom-module>

3800 <dom-module id="history-synced-device-manager" assetpath="chrome://history/">	4665 <dom-module id="history-synced-device-manager" assetpath="chrome://history/" css -build="shadow">

3801 <template>	4666 <template>

3802 <style include="shared-style cr-shared-style">	4667 <style scope="history-synced-device-manager">[hidden] {

3803 :host {	4668 display: none !important;

3804 display: block;	4669 }

	4670

	4671 .card-title {

	4672 -webkit-padding-start: 20px;

	4673 align-items: center;

	4674 border-bottom: 1px solid var(--card-border-color);

	4675 border-radius: 2px 2px 0 0;

	4676 color: var(--primary-text-color);

	4677 display: flex;

	4678 font-size: 14px;

	4679 font-weight: 500;

	4680 height: 48px;

	4681 }

	4682

	4683 .centered-message {

	4684 align-items: center;

	4685 color: #b4b4b4;

	4686 display: flex;

	4687 flex: 1;

	4688 font-size: 14px;

	4689 font-weight: 500;

	4690 height: 100%;

	4691 justify-content: center;

	4692 }

	4693

	4694 .menu-item {

	4695 -webkit-user-select: none;

	4696 cursor: pointer;

	4697 font: inherit;

	4698 white-space: nowrap;

	4699 }

	4700

	4701 .website-icon {

	4702 -webkit-margin-end: 16px;

	4703 background-repeat: no-repeat;

	4704 background-size: 16px;

	4705 height: 16px;

	4706 width: 16px;

	4707 }

	4708

	4709 .website-title {

	4710 color: var(--primary-text-color);

	4711 overflow: hidden;

	4712 text-decoration: none;

	4713 text-overflow: ellipsis;

	4714 white-space: nowrap;

	4715 }

	4716

	4717 button.icon-button {

	4718 height: 36px;

	4719 width: 36px;

	4720 }

	4721

	4722 button.icon-button iron-icon {

	4723 color: var(--secondary-text-color);

	4724 height: 20px;

	4725 width: 20px;

	4726 }

	4727

	4728 button.more-vert-button {

	4729 height: 36px;

	4730 padding: 6px;

	4731 width: 36px;

	4732 }

	4733

	4734 button.more-vert-button div {

	4735 border: 2px solid var(--secondary-text-color);

	4736 border-radius: 2px;

	4737 margin: 1px 10px;

	4738 pointer-events: none;

	4739 transform: scale(0.8);

	4740 }

	4741

	4742 paper-spinner {

	4743 --paper-spinner-layer-1-color: var(--google-blue-500);

	4744 --paper-spinner-layer-2-color: var(--google-blue-500);

	4745 --paper-spinner-layer-3-color: var(--google-blue-500);

	4746 --paper-spinner-layer-4-color: var(--google-blue-500);

	4747 }

	4748

	4749 .action-button {

	4750 background: var(--google-blue-500);

	4751 color: white;

	4752 --paper-button-flat-keyboard-focus_-_background: rgb(58, 117, 215);;

	4753 }

	4754

	4755 .action-button[disabled] {

	4756 opacity: .25;

	4757 }

	4758

	4759 .cancel-button {

	4760 --paper-button-flat-keyboard-focus_-_background: rgba(0, 0, 0, .12);;

	4761 }

	4762

	4763 .action-button, .cancel-button {

	4764 font-weight: 500;

	4765 }

	4766

	4767 [actionable] {

	4768 cursor: var(--cr-actionable_-_cursor);

	4769 }

	4770

	4771 [scrollable] {

	4772 border-color: transparent;

	4773 border-style: solid;

	4774 border-width: 1px 0;

	4775 overflow-y: auto;

	4776 }

	4777

	4778 [scrollable].is-scrolled {

	4779 border-top-color: var(--google-grey-300);

	4780 }

	4781

	4782 [scrollable].can-scroll:not(.scrolled-to-bottom) {

	4783 border-bottom-color: var(--google-grey-300);

	4784 }

	4785

	4786 [scrollable] :focus {

	4787 ;

	4788 background-color: var(--cr-selectable-focus_-_background-color); outline : var(--cr-selectable-focus_-_outline);

	4789 }

	4790

	4791 [scrollable] iron-list > * {

	4792 cursor: var(--cr-actionable_-_cursor);

	4793 }

	4794

	4795 [selectable] :focus {

	4796 background-color: var(--cr-selectable-focus_-_background-color); outline: var( --cr-selectable-focus_-_outline);

	4797 }

	4798

	4799 [selectable] > * {

	4800 cursor: var(--cr-actionable_-_cursor);

	4801 }

	4802

	4803 :host {

	4804 display: block;

3805 overflow: auto;	4805 overflow: auto;

3806 }	4806 }

3807	4807

3808 #illustration {	4808 #illustration {

3809 background: -webkit-image-set(	4809 background: -webkit-image-set(

3810 url("chrome://history/images/100/sign_in_promo.png") 1x,	4810 url("chrome://history/images/100/sign_in_promo.png") 1x,

3811 url("chrome://history/images/200/sign_in_promo.png") 2x)	4811 url("chrome://history/images/200/sign_in_promo.png") 2x)

3812 no-repeat center center;	4812 no-repeat center center;

3813 height: 222px;	4813 height: 222px;

3814 margin-top: 100px;	4814 margin-top: 100px;

3815 width: 594px;	4815 width: 594px;

3816 }	4816 }

3817	4817

3818 #no-synced-tabs {	4818 #no-synced-tabs {

3819 height: 100%;	4819 height: 100%;

3820 }	4820 }

3821	4821

3822 #sign-in-guide {	4822 #sign-in-guide {

3823 align-items: center;	4823 align-items: center;

3824 display: flex;	4824 display: flex;

3825 flex-direction: column;	4825 flex-direction: column;

3826 justify-content: center;	4826 justify-content: center;

3827 overflow-x: hidden;	4827 overflow-x: hidden;

3828 text-align: center;	4828 text-align: center;

3829 }	4829 }

3830	4830

3831 #sign-in-promo {	4831 #sign-in-promo {

3832 color: var(--primary-text-color);	4832 color: var(--primary-text-color);

3833 font-size: 215%;	4833 font-size: 215%;

3834 margin-top: 40px;	4834 margin-top: 40px;

3835 }	4835 }

3836	4836

3837 #sign-in-promo-desc {	4837 #sign-in-promo-desc {

3838 color: #848484;	4838 color: #848484;

3839 font-size: 123%;	4839 font-size: 123%;

3840 margin-top: 10px;	4840 margin-top: 10px;

3841 }	4841 }

3842	4842

3843 #sign-in-button {	4843 #sign-in-button {

3844 margin: 24px 0;	4844 margin: 24px 0;

3845 padding-left: 12px;	4845 padding-left: 12px;

3846 padding-right: 12px;	4846 padding-right: 12px;

3847 }	4847 }

3848	4848

3849 #synced-device-list {	4849 #synced-device-list {

3850 padding-top: var(--first-card-padding-top);	4850 padding-top: var(--first-card-padding-top);

3851 }	4851 }

3852 </style>	4852

	4853 </style>

3853 <div id="synced-device-list" hidden="[[!syncedDevices_.length]]">	4854 <div id="synced-device-list" hidden="[[!syncedDevices_.length]]">

3854 <template is="dom-repeat" items="[[syncedDevices_]]" as="syncedDevice">	4855 <template is="dom-repeat" items="[[syncedDevices_]]" as="syncedDevice">

3855 <history-synced-device-card device="[[syncedDevice.device]]" last-update -time="[[syncedDevice.lastUpdateTime]]" tabs="[[syncedDevice.tabs]]" separator-i ndexes="[[syncedDevice.separatorIndexes]]" search-term="[[searchTerm]]" session- tag="[[syncedDevice.tag]]" opened="{{syncedDevice.opened}}">	4856 <history-synced-device-card device="[[syncedDevice.device]]" last-update -time="[[syncedDevice.lastUpdateTime]]" tabs="[[syncedDevice.tabs]]" separator-i ndexes="[[syncedDevice.separatorIndexes]]" search-term="[[searchTerm]]" session- tag="[[syncedDevice.tag]]" opened="{{syncedDevice.opened}}">

3856 </history-synced-device-card>	4857 </history-synced-device-card>

3857 </template>	4858 </template>

3858 </div>	4859 </div>

3859 <div id="no-synced-tabs" class="centered-message" hidden="[[!showNoSyncedMes sage(signInState, syncedDevices_.length,	4860 <div id="no-synced-tabs" class="centered-message" hidden="[[!showNoSyncedMes sage(signInState, syncedDevices_.length,

3860 guestSession_)]]">	4861 guestSession_)]]">

3861 [[noSyncedTabsMessage(fetchingSyncedTabs_)]]	4862 [[noSyncedTabsMessage(fetchingSyncedTabs_)]]

3862 </div>	4863 </div>

(...skipping 11 matching lines...) Expand all Loading...
3874 <paper-item id="menuOpenButton" class="menu-item" on-tap="onOpenAllTap_" >	4875 <paper-item id="menuOpenButton" class="menu-item" on-tap="onOpenAllTap_" >

3875 $i18n{openAll}	4876 $i18n{openAll}

3876 </paper-item>	4877 </paper-item>

3877 <paper-item id="menuDeleteButton" class="menu-item" on-tap="onDeleteSess ionTap_">	4878 <paper-item id="menuDeleteButton" class="menu-item" on-tap="onDeleteSess ionTap_">

3878 $i18n{deleteSession}	4879 $i18n{deleteSession}

3879 </paper-item>	4880 </paper-item>

3880 </cr-shared-menu>	4881 </cr-shared-menu>

3881 </template>	4882 </template>

3882 </template>	4883 </template>

3883 </dom-module>	4884 </dom-module>

3884 <dom-module id="history-side-bar" assetpath="chrome://history/">	4885 <dom-module id="history-side-bar" assetpath="chrome://history/" css-build="shado w">

3885 <template>	4886 <template>

3886 <style include="shared-style">	4887 <style scope="history-side-bar">[hidden] {

3887 :host {	4888 display: none !important;

3888 display: block;	4889 }

	4890

	4891 .card-title {

	4892 -webkit-padding-start: 20px;

	4893 align-items: center;

	4894 border-bottom: 1px solid var(--card-border-color);

	4895 border-radius: 2px 2px 0 0;

	4896 color: var(--primary-text-color);

	4897 display: flex;

	4898 font-size: 14px;

	4899 font-weight: 500;

	4900 height: 48px;

	4901 }

	4902

	4903 .centered-message {

	4904 align-items: center;

	4905 color: #b4b4b4;

	4906 display: flex;

	4907 flex: 1;

	4908 font-size: 14px;

	4909 font-weight: 500;

	4910 height: 100%;

	4911 justify-content: center;

	4912 }

	4913

	4914 .menu-item {

	4915 -webkit-user-select: none;

	4916 cursor: pointer;

	4917 font: inherit;

	4918 white-space: nowrap;

	4919 }

	4920

	4921 .website-icon {

	4922 -webkit-margin-end: 16px;

	4923 background-repeat: no-repeat;

	4924 background-size: 16px;

	4925 height: 16px;

	4926 width: 16px;

	4927 }

	4928

	4929 .website-title {

	4930 color: var(--primary-text-color);

	4931 overflow: hidden;

	4932 text-decoration: none;

	4933 text-overflow: ellipsis;

	4934 white-space: nowrap;

	4935 }

	4936

	4937 button.icon-button {

	4938 height: 36px;

	4939 width: 36px;

	4940 }

	4941

	4942 button.icon-button iron-icon {

	4943 color: var(--secondary-text-color);

	4944 height: 20px;

	4945 width: 20px;

	4946 }

	4947

	4948 button.more-vert-button {

	4949 height: 36px;

	4950 padding: 6px;

	4951 width: 36px;

	4952 }

	4953

	4954 button.more-vert-button div {

	4955 border: 2px solid var(--secondary-text-color);

	4956 border-radius: 2px;

	4957 margin: 1px 10px;

	4958 pointer-events: none;

	4959 transform: scale(0.8);

	4960 }

	4961

	4962 :host {

	4963 display: block;

3889 height: 100%;	4964 height: 100%;

3890 padding-top: 5px;	4965 padding-top: 5px;

3891 width: var(--side-bar-width);	4966 width: var(--side-bar-width);

3892 }	4967 }

3893	4968

3894 div.separator {	4969 div.separator {

3895 background-color: rgba(0, 0, 0, 0.08);	4970 background-color: rgba(0, 0, 0, 0.08);

3896 height: 1px;	4971 height: 1px;

3897 margin: 8px 0;	4972 margin: 8px 0;

3898 }	4973 }

3899	4974

3900 #clear-browsing-data {	4975 #clear-browsing-data {

3901 text-transform: uppercase;	4976 text-transform: uppercase;

3902 }	4977 }

3903	4978

3904 iron-selector {	4979 iron-selector {

3905 -webkit-user-select: none;	4980 -webkit-user-select: none;

3906 background-color: transparent;	4981 background-color: transparent;

3907 color: #5a5a5a;	4982 color: #5a5a5a;

3908 }	4983 }

3909	4984

3910 iron-selector > a {	4985 iron-selector > a {

3911 @apply(--paper-font-subhead);	4986 font-family: var(--paper-font-subhead_-_font-family); -webkit-font-smoothing: var(--paper-font-subhead_-_-webkit-font-smoothing); font-size: var(--paper-font- subhead_-_font-size); font-weight: var(--paper-font-subhead_-_font-weight); line -height: var(--paper-font-subhead_-_line-height);

3912 -webkit-padding-start: 24px;	4987 -webkit-padding-start: 24px;

3913 align-items: center;	4988 align-items: center;

3914 box-sizing: border-box;	4989 box-sizing: border-box;

3915 color: inherit;	4990 color: inherit;

3916 cursor: pointer;	4991 cursor: pointer;

3917 display: flex;	4992 display: flex;

3918 font-size: 14px;	4993 font-size: 14px;

3919 font-weight: 500;	4994 font-weight: 500;

3920 min-height: 48px;	4995 min-height: 48px;

3921 position: relative;	4996 position: relative;

3922 text-decoration: none;	4997 text-decoration: none;

3923 }	4998 }

3924	4999

3925 iron-selector > a.iron-selected {	5000 iron-selector > a.iron-selected {

3926 color: var(--google-blue-500);	5001 color: var(--google-blue-500);

3927 font-weight: 500;	5002 font-weight: 500;

3928 }	5003 }

3929	5004

3930 #footer {	5005 #footer {

3931 bottom: 0;	5006 bottom: 0;

3932 color: var(--paper-grey-600);	5007 color: var(--paper-grey-600);

3933 position: absolute;	5008 position: absolute;

3934 width: var(--side-bar-width);	5009 width: var(--side-bar-width);

3935 }	5010 }

3936	5011

3937 :host([drawer]) #footer {	5012 :host([drawer]) #footer {

3938 /* This compensates the 120px by which app-drawer protrudes under	5013 bottom: 120px;

3939 * the viewport. */	5014 }

3940 bottom: 120px;

3941 }

3942	5015

3943 #footer-text {	5016 #footer-text {

3944 -webkit-padding-end: 16px;	5017 -webkit-padding-end: 16px;

3945 -webkit-padding-start: 24px;	5018 -webkit-padding-start: 24px;

3946 line-height: 20px;	5019 line-height: 20px;

3947 margin: 24px 0;	5020 margin: 24px 0;

3948 }	5021 }

3949	5022

3950 #footer a {	5023 #footer a {

3951 color: var(--google-blue-700);	5024 color: var(--google-blue-700);

3952 text-decoration: none;	5025 text-decoration: none;

3953 }	5026 }

3954 </style>	5027

	5028 </style>

3955	5029

3956 <iron-selector id="menu" selected="[[selectedPage]]" selectable=".page-item" attr-for-selected="path" fallback-selection="history" on-iron-activate="onSelec torActivate_">	5030 <iron-selector id="menu" selected="[[selectedPage]]" selectable=".page-item" attr-for-selected="path" fallback-selection="history" on-iron-activate="onSelec torActivate_">

3957 <a href="/[[getQueryString_(route)]]" class="page-item" path="history">	5031 <a href="/[[getQueryString_(route)]]" class="page-item" path="history">

3958 $i18n{historyMenuItem}	5032 $i18n{historyMenuItem}

3959 <paper-ripple></paper-ripple>	5033 <paper-ripple></paper-ripple>

3960 </a>	5034 </a>

3961 <a href="/syncedTabs[[getQueryString_(route)]]" class="page-item" path="sy ncedTabs">	5035 <a href="/syncedTabs[[getQueryString_(route)]]" class="page-item" path="sy ncedTabs">

3962 $i18n{openTabsMenuItem}	5036 $i18n{openTabsMenuItem}

3963 <paper-ripple></paper-ripple>	5037 <paper-ripple></paper-ripple>

3964 </a>	5038 </a>

3965 <div class="separator"></div>	5039 <div class="separator"></div>

3966 <a href="chrome://settings/clearBrowserData" on-tap="onClearBrowsingDataTa p_" id="clear-browsing-data">	5040 <a href="chrome://settings/clearBrowserData" on-tap="onClearBrowsingDataTa p_" id="clear-browsing-data">

3967 $i18n{clearBrowsingData}	5041 $i18n{clearBrowsingData}

3968 <paper-ripple></paper-ripple>	5042 <paper-ripple></paper-ripple>

3969 </a>	5043 </a>

3970 <div id="footer" hidden="[[!showFooter]]">	5044 <div id="footer" hidden="[[!showFooter]]">

3971 <div class="separator"></div>	5045 <div class="separator"></div>

3972 <div id="footer-text">$i18nRaw{sidebarFooter}</div>	5046 <div id="footer-text">$i18nRaw{sidebarFooter}</div>

3973 </div>	5047 </div>

3974 </iron-selector>	5048 </iron-selector>

3975 </template>	5049 </template>

3976 </dom-module>	5050 </dom-module>

3977 </div><dom-module id="history-app">	5051 </div><dom-module id="history-app" css-build="shadow">

3978 <template>	5052 <template>

3979 <style no-process="">	5053

3980 history-toolbar {	5054 <style scope="history-app">history-toolbar {

3981 background: var(--md-toolbar-color);	5055 background: var(--md-toolbar-color);

3982 }	5056 }

3983 </style>	5057

3984 <style include="shared-style">	5058 [hidden] {

3985 :host {	5059 display: none !important;

3986 display: block;	5060 }

	5061

	5062 .card-title {

	5063 -webkit-padding-start: 20px;

	5064 align-items: center;

	5065 border-bottom: 1px solid var(--card-border-color);

	5066 border-radius: 2px 2px 0 0;

	5067 color: var(--primary-text-color);

	5068 display: flex;

	5069 font-size: 14px;

	5070 font-weight: 500;

	5071 height: 48px;

	5072 }

	5073

	5074 .centered-message {

	5075 align-items: center;

	5076 color: #b4b4b4;

	5077 display: flex;

	5078 flex: 1;

	5079 font-size: 14px;

	5080 font-weight: 500;

	5081 height: 100%;

	5082 justify-content: center;

	5083 }

	5084

	5085 .menu-item {

	5086 -webkit-user-select: none;

	5087 cursor: pointer;

	5088 font: inherit;

	5089 white-space: nowrap;

	5090 }

	5091

	5092 .website-icon {

	5093 -webkit-margin-end: 16px;

	5094 background-repeat: no-repeat;

	5095 background-size: 16px;

	5096 height: 16px;

	5097 width: 16px;

	5098 }

	5099

	5100 .website-title {

	5101 color: var(--primary-text-color);

	5102 overflow: hidden;

	5103 text-decoration: none;

	5104 text-overflow: ellipsis;

	5105 white-space: nowrap;

	5106 }

	5107

	5108 button.icon-button {

	5109 height: 36px;

	5110 width: 36px;

	5111 }

	5112

	5113 button.icon-button iron-icon {

	5114 color: var(--secondary-text-color);

	5115 height: 20px;

	5116 width: 20px;

	5117 }

	5118

	5119 button.more-vert-button {

	5120 height: 36px;

	5121 padding: 6px;

	5122 width: 36px;

	5123 }

	5124

	5125 button.more-vert-button div {

	5126 border: 2px solid var(--secondary-text-color);

	5127 border-radius: 2px;

	5128 margin: 1px 10px;

	5129 pointer-events: none;

	5130 transform: scale(0.8);

	5131 }

	5132

	5133 :host {

	5134 display: block;

3987 height: 100%;	5135 height: 100%;

3988 overflow: hidden;	5136 overflow: hidden;

3989 }	5137 }

3990	5138

3991 /* Sizing this with flex causes slow load performance, see	5139 #main-container {

3992 * crbug.com/618153. TODO(dbeam): is this still an issue? */	5140 height: calc(100% - var(--toolbar-height));

3993 #main-container {

3994 height: calc(100% - var(--toolbar-height));

3995 position: relative;	5141 position: relative;

3996 }	5142 }

3997	5143

3998 :host([grouped_]) #main-container {	5144 :host([grouped_]) #main-container {

3999 height: calc(100% - var(--toolbar-grouped-height));	5145 height: calc(100% - var(--toolbar-grouped-height));

4000 }	5146 }

4001	5147

4002 #content-side-bar {	5148 #content-side-bar {

4003 float: left;	5149 float: left;

4004 }	5150 }

4005	5151

4006 :host-context([dir='rtl']) #content-side-bar {	5152 :host-context([dir='rtl']) #content-side-bar {

4007 float: right;	5153 float: right;

4008 }	5154 }

4009	5155

4010 #content,	5156 #content, #content > * {

4011 #content > * {	5157 height: 100%;

4012 height: 100%;	5158 }

4013 }

4014	5159

4015 #drawer-header {	5160 #drawer-header {

4016 align-items: center;	5161 align-items: center;

4017 border-bottom: 1px solid rgba(0, 0, 0, 0.08);	5162 border-bottom: 1px solid rgba(0, 0, 0, 0.08);

4018 display: flex;	5163 display: flex;

4019 height: var(--toolbar-height);	5164 height: var(--toolbar-height);

4020 margin-bottom: 5px;	5165 margin-bottom: 5px;

4021 }	5166 }

4022	5167

4023 h1 {	5168 h1 {

4024 -webkit-padding-start: 24px;	5169 -webkit-padding-start: 24px;

4025 color: rgb(66, 66, 66);	5170 color: rgb(66, 66, 66);

4026 font-size: 123%;	5171 font-size: 123%;

4027 font-weight: 400;	5172 font-weight: 400;

4028 }	5173 }

4029	5174

4030 #drop-shadow {	5175 #drop-shadow {

4031 box-shadow: inset 0 5px 6px -3px rgba(0, 0, 0, 0.4);	5176 box-shadow: inset 0 5px 6px -3px rgba(0, 0, 0, 0.4);

4032 height: 6px;	5177 height: 6px;

4033 left: 0;	5178 left: 0;

4034 opacity: 0;	5179 opacity: 0;

4035 pointer-events: none;	5180 pointer-events: none;

4036 position: absolute;	5181 position: absolute;

4037 right: 0;	5182 right: 0;

4038 top: 0;	5183 top: 0;

4039 transition: opacity 500ms;	5184 transition: opacity 500ms;

4040 }	5185 }

4041	5186

4042 :host([toolbar-shadow_]) #drop-shadow {	5187 :host([toolbar-shadow_]) #drop-shadow {

4043 opacity: 1;	5188 opacity: 1;

4044 }	5189 }

4045 </style>	5190

	5191 </style>

4046 <app-location route="{{route_}}"></app-location>	5192 <app-location route="{{route_}}"></app-location>

4047 <app-route route="{{route_}}" pattern="/:page" data="{{routeData_}}" query-p arams="{{queryParams_}}">	5193 <app-route route="{{route_}}" pattern="/:page" data="{{routeData_}}" query-p arams="{{queryParams_}}">

4048 </app-route>	5194 </app-route>

4049 <history-toolbar id="toolbar" spinner-active="[[shouldShowSpinner_(queryStat e_.querying,	5195 <history-toolbar id="toolbar" spinner-active="[[shouldShowSpinner_(queryStat e_.querying,

4050 queryState_.incremental,	5196 queryState_.incremental,

4051 queryState_.searchTerm)]]" is-group ed-mode="{{grouped_}}" grouped-range="{{queryState_.range}}" search-term="{{quer yState_.searchTerm}}" query-start-time="[[queryResult_.info.queryStartTime]]" qu ery-end-time="[[queryResult_.info.queryEndTime]]" has-drawer="[[hasDrawer_]]">	5197 queryState_.searchTerm)]]" is-group ed-mode="{{grouped_}}" grouped-range="{{queryState_.range}}" search-term="{{quer yState_.searchTerm}}" query-start-time="[[queryResult_.info.queryStartTime]]" qu ery-end-time="[[queryResult_.info.queryEndTime]]" has-drawer="[[hasDrawer_]]">

4052 </history-toolbar>	5198 </history-toolbar>

4053	5199

4054 <div id="main-container">	5200 <div id="main-container">

4055 <history-side-bar id="content-side-bar" selected-page="[[selectedPage_]]" route="[[route_]]" show-footer="[[showSidebarFooter]]" hidden$="[[hasDrawer_]]">	5201 <history-side-bar id="content-side-bar" selected-page="[[selectedPage_]]" route="[[route_]]" show-footer="[[showSidebarFooter]]" hidden$="[[hasDrawer_]]">

(...skipping 17 matching lines...) Expand all Loading...
4073 <history-side-bar id="drawer-side-bar" selected-page="[[selectedPage_]]" route="[[route_]]" show-footer="[[showSidebarFooter]]" drawer="">	5219 <history-side-bar id="drawer-side-bar" selected-page="[[selectedPage_]]" route="[[route_]]" show-footer="[[showSidebarFooter]]" drawer="">

4074 </history-side-bar>	5220 </history-side-bar>

4075 </app-drawer>	5221 </app-drawer>

4076 </template>	5222 </template>

4077	5223

4078 <iron-media-query query="(max-width: 1023px)" query-matches="{{hasDrawer_}}" >	5224 <iron-media-query query="(max-width: 1023px)" query-matches="{{hasDrawer_}}" >

4079 </iron-media-query>	5225 </iron-media-query>

4080 </template>	5226 </template>

4081 </dom-module>	5227 </dom-module>

4082 <script src="app.crisper.js"></script></body></html>	5228 <script src="app.crisper.js"></script></body></html>

OLD	NEW

« no previous file with comments | « chrome/browser/resources/md_downloads/vulcanized.html ('k') | chrome/browser/resources/vulcanize.py » ('j') | no next file with comments »