chrome/browser/resources/md_history/app.vulcanized.html - Issue 2224003003: Vulcanize MD History to improve page-load performance

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

Issue 2224003003: Vulcanize MD History to improve page-load performance (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master

Patch Set: Rebase Created 4 years, 4 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
(Empty)
	1 <html><head><!--

	2 @license

	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

	5 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt

	6 The complete set of contributors may be found at http://polymer.github.io/CONTRI BUTORS.txt

	7 Code distributed by Google as part of the polymer project is also

	8 subject to an additional IP rights grant found at http://polymer.github.io/PATEN TS.txt

	9 --><!--

	10 @license

	11 Copyright (c) 2016 The Polymer Project Authors. All rights reserved.

	12 This code may only be used under the BSD style license found at http://polymer.g ithub.io/LICENSE.txt

	13 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt

	14 The complete set of contributors may be found at http://polymer.github.io/CONTRI BUTORS.txt

	15 Code distributed by Google as part of the polymer project is also

	16 subject to an additional IP rights grant found at http://polymer.github.io/PATEN TS.txt

	17 --><!--

	18 @license

	19 Copyright (c) 2015 The Polymer Project Authors. All rights reserved.

	20 This code may only be used under the BSD style license found at http://polymer.g ithub.io/LICENSE.txt

	21 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt

	22 The complete set of contributors may be found at http://polymer.github.io/CONTRI BUTORS.txt

	23 Code distributed by Google as part of the polymer project is also

	24 subject to an additional IP rights grant found at http://polymer.github.io/PATEN TS.txt

	25 --><meta charset="UTF-8"><link rel="import" href="chrome://resources/html/polyme r.html">

	26 <style>

	27 /* Copyright 2016 The Chromium Authors. All rights reserved.

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

	29 * found in the LICENSE file. */

	30

	31 :root {

	32 /* This is a custom, Chrome-specific color that does not have a --paper or

	33 * --google equivalent. */

	34 --md-background-color: rgb(241, 241, 241);

	35 /* This is --google-blue-700, rewritten as a native custom property for speed.

	36 */

	37 --md-toolbar-color: rgb(51, 103, 214);

	38 }

	39

	40 </style>

	41

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

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

	44 [hidden] {

	45 display: none !important;

	46 }

	47 </style>

	48

	49 <style is="custom-style">

	50 :root {

	51

	52 --layout: {

	53 display: -ms-flexbox;

	54 display: -webkit-flex;

	55 display: flex;

	56 };

	57

	58 --layout-inline: {

	59 display: -ms-inline-flexbox;

	60 display: -webkit-inline-flex;

	61 display: inline-flex;

	62 };

	63

	64 --layout-horizontal: {

	65 @apply(--layout);

	66

	67 -ms-flex-direction: row;

	68 -webkit-flex-direction: row;

	69 flex-direction: row;

	70 };

	71

	72 --layout-horizontal-reverse: {

	73 @apply(--layout);

	74

	75 -ms-flex-direction: row-reverse;

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

	77 flex-direction: row-reverse;

	78 };

	79

	80 --layout-vertical: {

	81 @apply(--layout);

	82

	83 -ms-flex-direction: column;

	84 -webkit-flex-direction: column;

	85 flex-direction: column;

	86 };

	87

	88 --layout-vertical-reverse: {

	89 @apply(--layout);

	90

	91 -ms-flex-direction: column-reverse;

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

	93 flex-direction: column-reverse;

	94 };

	95

	96 --layout-wrap: {

	97 -ms-flex-wrap: wrap;

	98 -webkit-flex-wrap: wrap;

	99 flex-wrap: wrap;

	100 };

	101

	102 --layout-wrap-reverse: {

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

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

	105 flex-wrap: wrap-reverse;

	106 };

	107

	108 --layout-flex-auto: {

	109 -ms-flex: 1 1 auto;

	110 -webkit-flex: 1 1 auto;

	111 flex: 1 1 auto;

	112 };

	113

	114 --layout-flex-none: {

	115 -ms-flex: none;

	116 -webkit-flex: none;

	117 flex: none;

	118 };

	119

	120 --layout-flex: {

	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

	128 --layout-flex-2: {

	129 -ms-flex: 2;

	130 -webkit-flex: 2;

	131 flex: 2;

	132 };

	133

	134 --layout-flex-3: {

	135 -ms-flex: 3;

	136 -webkit-flex: 3;

	137 flex: 3;

	138 };

	139

	140 --layout-flex-4: {

	141 -ms-flex: 4;

	142 -webkit-flex: 4;

	143 flex: 4;

	144 };

	145

	146 --layout-flex-5: {

	147 -ms-flex: 5;

	148 -webkit-flex: 5;

	149 flex: 5;

	150 };

	151

	152 --layout-flex-6: {

	153 -ms-flex: 6;

	154 -webkit-flex: 6;

	155 flex: 6;

	156 };

	157

	158 --layout-flex-7: {

	159 -ms-flex: 7;

	160 -webkit-flex: 7;

	161 flex: 7;

	162 };

	163

	164 --layout-flex-8: {

	165 -ms-flex: 8;

	166 -webkit-flex: 8;

	167 flex: 8;

	168 };

	169

	170 --layout-flex-9: {

	171 -ms-flex: 9;

	172 -webkit-flex: 9;

	173 flex: 9;

	174 };

	175

	176 --layout-flex-10: {

	177 -ms-flex: 10;

	178 -webkit-flex: 10;

	179 flex: 10;

	180 };

	181

	182 --layout-flex-11: {

	183 -ms-flex: 11;

	184 -webkit-flex: 11;

	185 flex: 11;

	186 };

	187

	188 --layout-flex-12: {

	189 -ms-flex: 12;

	190 -webkit-flex: 12;

	191 flex: 12;

	192 };

	193

	194 /* alignment in cross axis */

	195

	196 --layout-start: {

	197 -ms-flex-align: start;

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

	199 align-items: flex-start;

	200 };

	201

	202 --layout-center: {

	203 -ms-flex-align: center;

	204 -webkit-align-items: center;

	205 align-items: center;

	206 };

	207

	208 --layout-end: {

	209 -ms-flex-align: end;

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

	211 align-items: flex-end;

	212 };

	213

	214 --layout-baseline: {

	215 -ms-flex-align: baseline;

	216 -webkit-align-items: baseline;

	217 align-items: baseline;

	218 };

	219

	220 /* alignment in main axis */

	221

	222 --layout-start-justified: {

	223 -ms-flex-pack: start;

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

	225 justify-content: flex-start;

	226 };

	227

	228 --layout-center-justified: {

	229 -ms-flex-pack: center;

	230 -webkit-justify-content: center;

	231 justify-content: center;

	232 };

	233

	234 --layout-end-justified: {

	235 -ms-flex-pack: end;

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

	237 justify-content: flex-end;

	238 };

	239

	240 --layout-around-justified: {

	241 -ms-flex-pack: distribute;

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

	243 justify-content: space-around;

	244 };

	245

	246 --layout-justified: {

	247 -ms-flex-pack: justify;

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

	249 justify-content: space-between;

	250 };

	251

	252 --layout-center-center: {

	253 @apply(--layout-center);

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

	255 };

	256

	257 /* self alignment */

	258

	259 --layout-self-start: {

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

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

	262 align-self: flex-start;

	263 };

	264

	265 --layout-self-center: {

	266 -ms-align-self: center;

	267 -webkit-align-self: center;

	268 align-self: center;

	269 };

	270

	271 --layout-self-end: {

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

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

	274 align-self: flex-end;

	275 };

	276

	277 --layout-self-stretch: {

	278 -ms-align-self: stretch;

	279 -webkit-align-self: stretch;

	280 align-self: stretch;

	281 };

	282

	283 --layout-self-baseline: {

	284 -ms-align-self: baseline;

	285 -webkit-align-self: baseline;

	286 align-self: baseline;

	287 };

	288

	289 /* multi-line alignment in main axis */

	290

	291 --layout-start-aligned: {

	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

	298 --layout-end-aligned: {

	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

	305 --layout-center-aligned: {

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

	307 -ms-align-content: center;

	308 -webkit-align-content: center;

	309 align-content: center;

	310 };

	311

	312 --layout-between-aligned: {

	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

	319 --layout-around-aligned: {

	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

	326 /*******************************

	327 Other Layout

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

	329

	330 --layout-block: {

	331 display: block;

	332 };

	333

	334 --layout-invisible: {

	335 visibility: hidden !important;

	336 };

	337

	338 --layout-relative: {

	339 position: relative;

	340 };

	341

	342 --layout-fit: {

	343 position: absolute;

	344 top: 0;

	345 right: 0;

	346 bottom: 0;

	347 left: 0;

	348 };

	349

	350 --layout-scroll: {

	351 -webkit-overflow-scrolling: touch;

	352 overflow: auto;

	353 };

	354

	355 --layout-fullbleed: {

	356 margin: 0;

	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

	392 </style>

	393

	394

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

	396 <template>

	397 <style>

	398 :host {

	399 position: fixed;

	400 top: -120px;

	401 right: 0;

	402 bottom: -120px;

	403 left: 0;

	404

	405 visibility: hidden;

	406

	407 transition: visibility 0.2s ease;

	408 }

	409

	410 :host([opened]) {

	411 visibility: visible;

	412 }

	413

	414 :host([persistent]) {

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

	416 }

	417

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

	419 right: auto;

	420 }

	421

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

	423 left: auto;

	424 }

	425

	426 #contentContainer {

	427 position: absolute;

	428 top: 0;

	429 bottom: 0;

	430 left: 0;

	431

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

	433 padding: 120px 0;

	434

	435 transition: 0.2s ease;

	436 transition-property: -webkit-transform;

	437 transition-property: transform;

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

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

	440

	441 background-color: #FFF;

	442

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

	444 }

	445

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

	447 right: 0;

	448 left: auto;

	449

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

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

	452 }

	453

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

	455 position: fixed;

	456 top: 0;

	457 bottom: 0;

	458 left: 100%;

	459

	460 visibility: visible;

	461

	462 width: 20px;

	463

	464 content: '';

	465 }

	466

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

	468 right: 100%;

	469 left: auto;

	470 }

	471

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

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

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

	475 }

	476

	477 #scrim {

	478 position: absolute;

	479 top: 0;

	480 right: 0;

	481 bottom: 0;

	482 left: 0;

	483

	484 transition: opacity 0.2s ease;

	485 -webkit-transform: translateZ(0);

	486 transform: translateZ(0);

	487

	488 opacity: 0;

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

	490 }

	491

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

	493 opacity: 1;

	494 }

	495

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

	497 visibility: hidden;

	498 /**

	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

	503 opacity: 0;

	504 }

	505 </style>

	506

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

	508

	509 <div id="contentContainer">

	510 <content></content>

	511 </div>

	512 </template>

	513

	514 </dom-module>

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

	516 <template>

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

	518 </iron-location>

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

	520 </iron-query-params>

	521 </template>

	522 </dom-module>

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

	524

	525 <template>

	526 <style>

	527 :host {

	528 display: block;

	529 }

	530

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

	532 display: none !important;

	533 }

	534 </style>

	535

	536 <content></content>

	537 </template>

	538

	539 </dom-module>

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

	541

	542 <template>

	543 <style>

	544 :host {

	545 display: block;

	546 position: absolute;

	547 border-radius: inherit;

	548 overflow: hidden;

	549 top: 0;

	550 left: 0;

	551 right: 0;

	552 bottom: 0;

	553

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

	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;

	559 }

	560

	561 :host([animating]) {

	562 /* This resolves a rendering issue in Chrome (as of 40) where the

	563 ripple is not properly clipped by its parent (which may have

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

	565

	566 Note: We only apply this style conditionally. Otherwise, the browser

	567 will create a new compositing layer for every ripple element on the

	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;

	579 top: 0;

	580 left: 0;

	581 width: 100%;

	582 height: 100%;

	583 }

	584

	585 #background,

	586 .wave {

	587 opacity: 0;

	588 }

	589

	590 #waves,

	591 .wave {

	592 overflow: hidden;

	593 }

	594

	595 .wave-container,

	596 .wave {

	597 border-radius: 50%;

	598 }

	599

	600 :host(.circle) #background,

	601 :host(.circle) #waves {

	602 border-radius: 50%;

	603 }

	604

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

	606 overflow: hidden;

	607 }

	608 </style>

	609

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

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

	612 </template>

	613 </dom-module>

	614 <style is="custom-style">

	615

	616 :root {

	617

	618 --shadow-transition: {

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

	620 };

	621

	622 --shadow-none: {

	623 box-shadow: none;

	624 };

	625

	626 /* from http://codepen.io/shyndman/pen/c5394ddf2e8b2a5c9185904b57421cdb */

	627

	628 --shadow-elevation-2dp: {

	629 box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14),

	630 0 1px 5px 0 rgba(0, 0, 0, 0.12),

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

	632 };

	633

	634 --shadow-elevation-3dp: {

	635 box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.14),

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

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

	638 };

	639

	640 --shadow-elevation-4dp: {

	641 box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14),

	642 0 1px 10px 0 rgba(0, 0, 0, 0.12),

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

	644 };

	645

	646 --shadow-elevation-6dp: {

	647 box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.14),

	648 0 1px 18px 0 rgba(0, 0, 0, 0.12),

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

	650 };

	651

	652 --shadow-elevation-8dp: {

	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),

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

	668 };

	669

	670 }

	671

	672 </style>

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

	674 <template>

	675 <style>

	676 :host {

	677 display: block;

	678 position: relative;

	679 }

	680

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

	682 @apply(--shadow-elevation-2dp);

	683 }

	684

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

	686 @apply(--shadow-elevation-4dp);

	687 }

	688

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

	690 @apply(--shadow-elevation-6dp);

	691 }

	692

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

	694 @apply(--shadow-elevation-8dp);

	695 }

	696

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

	698 @apply(--shadow-elevation-16dp);

	699 }

	700 </style>

	701 </template>

	702 </dom-module>

	703

	704

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

	706 <template strip-whitespace="">

	707 <style include="paper-material-shared-styles">

	708 :host {

	709 @apply(--layout-inline);

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

	711 position: relative;

	712 box-sizing: border-box;

	713 min-width: 5.14em;

	714 margin: 0 0.29em;

	715 background: transparent;

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

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

	718 font: inherit;

	719 text-transform: uppercase;

	720 outline-width: 0;

	721 border-radius: 3px;

	722 -moz-user-select: none;

	723 -ms-user-select: none;

	724 -webkit-user-select: none;

	725 user-select: none;

	726 cursor: pointer;

	727 z-index: 0;

	728 padding: 0.7em 0.57em;

	729

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

	731 @apply(--paper-button);

	732 }

	733

	734 :host([hidden]) {

	735 display: none !important;

	736 }

	737

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

	739 font-weight: bold;

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

	741 }

	742

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

	744 font-weight: bold;

	745 @apply(--paper-button-flat-keyboard-focus);

	746 }

	747

	748 :host([disabled]) {

	749 background: #eaeaea;

	750 color: #a8a8a8;

	751 cursor: auto;

	752 pointer-events: none;

	753

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

	755 }

	756

	757 :host([animated]) {

	758 @apply(--shadow-transition);

	759 }

	760

	761 paper-ripple {

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

	763 }

	764 </style>

	765

	766 <content></content>

	767 </template>

	768

	769 </dom-module>

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

	771 <template>

	772 <style>

	773 :host {

	774 @apply(--layout-inline);

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

	776 position: relative;

	777

	778 vertical-align: middle;

	779

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

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

	782

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

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

	785 }

	786 </style>

	787 </template>

	788

	789 </dom-module>

	790 <style is="custom-style">

	791

	792 :root {

	793

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

	795

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

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

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

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

	800

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

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

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

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

	805

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

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

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

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

	810

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

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

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

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

	815

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

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

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

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

	820

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

	822

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

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

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

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

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

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

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

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

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

	832 --paper-red-900: #b71c1c;

	833 --paper-red-a100: #ff8a80;

	834 --paper-red-a200: #ff5252;

	835 --paper-red-a400: #ff1744;

	836 --paper-red-a700: #d50000;

	837

	838 --paper-pink-50: #fce4ec;

	839 --paper-pink-100: #f8bbd0;

	840 --paper-pink-200: #f48fb1;

	841 --paper-pink-300: #f06292;

	842 --paper-pink-400: #ec407a;

	843 --paper-pink-500: #e91e63;

	844 --paper-pink-600: #d81b60;

	845 --paper-pink-700: #c2185b;

	846 --paper-pink-800: #ad1457;

	847 --paper-pink-900: #880e4f;

	848 --paper-pink-a100: #ff80ab;

	849 --paper-pink-a200: #ff4081;

	850 --paper-pink-a400: #f50057;

	851 --paper-pink-a700: #c51162;

	852

	853 --paper-purple-50: #f3e5f5;

	854 --paper-purple-100: #e1bee7;

	855 --paper-purple-200: #ce93d8;

	856 --paper-purple-300: #ba68c8;

	857 --paper-purple-400: #ab47bc;

	858 --paper-purple-500: #9c27b0;

	859 --paper-purple-600: #8e24aa;

	860 --paper-purple-700: #7b1fa2;

	861 --paper-purple-800: #6a1b9a;

	862 --paper-purple-900: #4a148c;

	863 --paper-purple-a100: #ea80fc;

	864 --paper-purple-a200: #e040fb;

	865 --paper-purple-a400: #d500f9;

	866 --paper-purple-a700: #aa00ff;

	867

	868 --paper-deep-purple-50: #ede7f6;

	869 --paper-deep-purple-100: #d1c4e9;

	870 --paper-deep-purple-200: #b39ddb;

	871 --paper-deep-purple-300: #9575cd;

	872 --paper-deep-purple-400: #7e57c2;

	873 --paper-deep-purple-500: #673ab7;

	874 --paper-deep-purple-600: #5e35b1;

	875 --paper-deep-purple-700: #512da8;

	876 --paper-deep-purple-800: #4527a0;

	877 --paper-deep-purple-900: #311b92;

	878 --paper-deep-purple-a100: #b388ff;

	879 --paper-deep-purple-a200: #7c4dff;

	880 --paper-deep-purple-a400: #651fff;

	881 --paper-deep-purple-a700: #6200ea;

	882

	883 --paper-indigo-50: #e8eaf6;

	884 --paper-indigo-100: #c5cae9;

	885 --paper-indigo-200: #9fa8da;

	886 --paper-indigo-300: #7986cb;

	887 --paper-indigo-400: #5c6bc0;

	888 --paper-indigo-500: #3f51b5;

	889 --paper-indigo-600: #3949ab;

	890 --paper-indigo-700: #303f9f;

	891 --paper-indigo-800: #283593;

	892 --paper-indigo-900: #1a237e;

	893 --paper-indigo-a100: #8c9eff;

	894 --paper-indigo-a200: #536dfe;

	895 --paper-indigo-a400: #3d5afe;

	896 --paper-indigo-a700: #304ffe;

	897

	898 --paper-blue-50: #e3f2fd;

	899 --paper-blue-100: #bbdefb;

	900 --paper-blue-200: #90caf9;

	901 --paper-blue-300: #64b5f6;

	902 --paper-blue-400: #42a5f5;

	903 --paper-blue-500: #2196f3;

	904 --paper-blue-600: #1e88e5;

	905 --paper-blue-700: #1976d2;

	906 --paper-blue-800: #1565c0;

	907 --paper-blue-900: #0d47a1;

	908 --paper-blue-a100: #82b1ff;

	909 --paper-blue-a200: #448aff;

	910 --paper-blue-a400: #2979ff;

	911 --paper-blue-a700: #2962ff;

	912

	913 --paper-light-blue-50: #e1f5fe;

	914 --paper-light-blue-100: #b3e5fc;

	915 --paper-light-blue-200: #81d4fa;

	916 --paper-light-blue-300: #4fc3f7;

	917 --paper-light-blue-400: #29b6f6;

	918 --paper-light-blue-500: #03a9f4;

	919 --paper-light-blue-600: #039be5;

	920 --paper-light-blue-700: #0288d1;

	921 --paper-light-blue-800: #0277bd;

	922 --paper-light-blue-900: #01579b;

	923 --paper-light-blue-a100: #80d8ff;

	924 --paper-light-blue-a200: #40c4ff;

	925 --paper-light-blue-a400: #00b0ff;

	926 --paper-light-blue-a700: #0091ea;

	927

	928 --paper-cyan-50: #e0f7fa;

	929 --paper-cyan-100: #b2ebf2;

	930 --paper-cyan-200: #80deea;

	931 --paper-cyan-300: #4dd0e1;

	932 --paper-cyan-400: #26c6da;

	933 --paper-cyan-500: #00bcd4;

	934 --paper-cyan-600: #00acc1;

	935 --paper-cyan-700: #0097a7;

	936 --paper-cyan-800: #00838f;

	937 --paper-cyan-900: #006064;

	938 --paper-cyan-a100: #84ffff;

	939 --paper-cyan-a200: #18ffff;

	940 --paper-cyan-a400: #00e5ff;

	941 --paper-cyan-a700: #00b8d4;

	942

	943 --paper-teal-50: #e0f2f1;

	944 --paper-teal-100: #b2dfdb;

	945 --paper-teal-200: #80cbc4;

	946 --paper-teal-300: #4db6ac;

	947 --paper-teal-400: #26a69a;

	948 --paper-teal-500: #009688;

	949 --paper-teal-600: #00897b;

	950 --paper-teal-700: #00796b;

	951 --paper-teal-800: #00695c;

	952 --paper-teal-900: #004d40;

	953 --paper-teal-a100: #a7ffeb;

	954 --paper-teal-a200: #64ffda;

	955 --paper-teal-a400: #1de9b6;

	956 --paper-teal-a700: #00bfa5;

	957

	958 --paper-green-50: #e8f5e9;

	959 --paper-green-100: #c8e6c9;

	960 --paper-green-200: #a5d6a7;

	961 --paper-green-300: #81c784;

	962 --paper-green-400: #66bb6a;

	963 --paper-green-500: #4caf50;

	964 --paper-green-600: #43a047;

	965 --paper-green-700: #388e3c;

	966 --paper-green-800: #2e7d32;

	967 --paper-green-900: #1b5e20;

	968 --paper-green-a100: #b9f6ca;

	969 --paper-green-a200: #69f0ae;

	970 --paper-green-a400: #00e676;

	971 --paper-green-a700: #00c853;

	972

	973 --paper-light-green-50: #f1f8e9;

	974 --paper-light-green-100: #dcedc8;

	975 --paper-light-green-200: #c5e1a5;

	976 --paper-light-green-300: #aed581;

	977 --paper-light-green-400: #9ccc65;

	978 --paper-light-green-500: #8bc34a;

	979 --paper-light-green-600: #7cb342;

	980 --paper-light-green-700: #689f38;

	981 --paper-light-green-800: #558b2f;

	982 --paper-light-green-900: #33691e;

	983 --paper-light-green-a100: #ccff90;

	984 --paper-light-green-a200: #b2ff59;

	985 --paper-light-green-a400: #76ff03;

	986 --paper-light-green-a700: #64dd17;

	987

	988 --paper-lime-50: #f9fbe7;

	989 --paper-lime-100: #f0f4c3;

	990 --paper-lime-200: #e6ee9c;

	991 --paper-lime-300: #dce775;

	992 --paper-lime-400: #d4e157;

	993 --paper-lime-500: #cddc39;

	994 --paper-lime-600: #c0ca33;

	995 --paper-lime-700: #afb42b;

	996 --paper-lime-800: #9e9d24;

	997 --paper-lime-900: #827717;

	998 --paper-lime-a100: #f4ff81;

	999 --paper-lime-a200: #eeff41;

	1000 --paper-lime-a400: #c6ff00;

	1001 --paper-lime-a700: #aeea00;

	1002

	1003 --paper-yellow-50: #fffde7;

	1004 --paper-yellow-100: #fff9c4;

	1005 --paper-yellow-200: #fff59d;

	1006 --paper-yellow-300: #fff176;

	1007 --paper-yellow-400: #ffee58;

	1008 --paper-yellow-500: #ffeb3b;

	1009 --paper-yellow-600: #fdd835;

	1010 --paper-yellow-700: #fbc02d;

	1011 --paper-yellow-800: #f9a825;

	1012 --paper-yellow-900: #f57f17;

	1013 --paper-yellow-a100: #ffff8d;

	1014 --paper-yellow-a200: #ffff00;

	1015 --paper-yellow-a400: #ffea00;

	1016 --paper-yellow-a700: #ffd600;

	1017

	1018 --paper-amber-50: #fff8e1;

	1019 --paper-amber-100: #ffecb3;

	1020 --paper-amber-200: #ffe082;

	1021 --paper-amber-300: #ffd54f;

	1022 --paper-amber-400: #ffca28;

	1023 --paper-amber-500: #ffc107;

	1024 --paper-amber-600: #ffb300;

	1025 --paper-amber-700: #ffa000;

	1026 --paper-amber-800: #ff8f00;

	1027 --paper-amber-900: #ff6f00;

	1028 --paper-amber-a100: #ffe57f;

	1029 --paper-amber-a200: #ffd740;

	1030 --paper-amber-a400: #ffc400;

	1031 --paper-amber-a700: #ffab00;

	1032

	1033 --paper-orange-50: #fff3e0;

	1034 --paper-orange-100: #ffe0b2;

	1035 --paper-orange-200: #ffcc80;

	1036 --paper-orange-300: #ffb74d;

	1037 --paper-orange-400: #ffa726;

	1038 --paper-orange-500: #ff9800;

	1039 --paper-orange-600: #fb8c00;

	1040 --paper-orange-700: #f57c00;

	1041 --paper-orange-800: #ef6c00;

	1042 --paper-orange-900: #e65100;

	1043 --paper-orange-a100: #ffd180;

	1044 --paper-orange-a200: #ffab40;

	1045 --paper-orange-a400: #ff9100;

	1046 --paper-orange-a700: #ff6500;

	1047

	1048 --paper-deep-orange-50: #fbe9e7;

	1049 --paper-deep-orange-100: #ffccbc;

	1050 --paper-deep-orange-200: #ffab91;

	1051 --paper-deep-orange-300: #ff8a65;

	1052 --paper-deep-orange-400: #ff7043;

	1053 --paper-deep-orange-500: #ff5722;

	1054 --paper-deep-orange-600: #f4511e;

	1055 --paper-deep-orange-700: #e64a19;

	1056 --paper-deep-orange-800: #d84315;

	1057 --paper-deep-orange-900: #bf360c;

	1058 --paper-deep-orange-a100: #ff9e80;

	1059 --paper-deep-orange-a200: #ff6e40;

	1060 --paper-deep-orange-a400: #ff3d00;

	1061 --paper-deep-orange-a700: #dd2c00;

	1062

	1063 --paper-brown-50: #efebe9;

	1064 --paper-brown-100: #d7ccc8;

	1065 --paper-brown-200: #bcaaa4;

	1066 --paper-brown-300: #a1887f;

	1067 --paper-brown-400: #8d6e63;

	1068 --paper-brown-500: #795548;

	1069 --paper-brown-600: #6d4c41;

	1070 --paper-brown-700: #5d4037;

	1071 --paper-brown-800: #4e342e;

	1072 --paper-brown-900: #3e2723;

	1073

	1074 --paper-grey-50: #fafafa;

	1075 --paper-grey-100: #f5f5f5;

	1076 --paper-grey-200: #eeeeee;

	1077 --paper-grey-300: #e0e0e0;

	1078 --paper-grey-400: #bdbdbd;

	1079 --paper-grey-500: #9e9e9e;

	1080 --paper-grey-600: #757575;

	1081 --paper-grey-700: #616161;

	1082 --paper-grey-800: #424242;

	1083 --paper-grey-900: #212121;

	1084

	1085 --paper-blue-grey-50: #eceff1;

	1086 --paper-blue-grey-100: #cfd8dc;

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

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

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

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

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

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

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

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

	1095

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

	1097 --dark-divider-opacity: 0.12;

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

	1099 --dark-secondary-opacity: 0.54;

	1100 --dark-primary-opacity: 0.87;

	1101

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

	1103 --light-divider-opacity: 0.12;

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

	1105 --light-secondary-opacity: 0.7;

	1106 --light-primary-opacity: 1.0;

	1107

	1108 }

	1109

	1110 </style>

	1111

	1112

	1113 <style is="custom-style">

	1114

	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);

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

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

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

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

	1128

	1129 /*

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

	1131 */

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

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

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

	1135

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

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

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

	1139

	1140

	1141 /*

	1142 * Material Design Light background theme

	1143 */

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

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

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

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

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

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

	1150

	1151 /*

	1152 * Material Design Dark background theme

	1153 */

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

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

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

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

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

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

	1160

	1161 /*

	1162 * Deprecated values because of their confusing names.

	1163 */

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

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

	1166

	1167 }

	1168

	1169 </style>

	1170

	1171

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

	1173 <template strip-whitespace="">

	1174 <style>

	1175 :host {

	1176 display: inline-block;

	1177 position: relative;

	1178 padding: 8px;

	1179 outline: none;

	1180 -webkit-user-select: none;

	1181 -moz-user-select: none;

	1182 -ms-user-select: none;

	1183 user-select: none;

	1184 cursor: pointer;

	1185 z-index: 0;

	1186 line-height: 1;

	1187

	1188 width: 40px;

	1189 height: 40px;

	1190

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

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

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

	1194

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

	1196 box-sizing: border-box !important;

	1197

	1198 @apply(--paper-icon-button);

	1199 }

	1200

	1201 :host #ink {

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

	1203 opacity: 0.6;

	1204 }

	1205

	1206 :host([disabled]) {

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

	1208 pointer-events: none;

	1209 cursor: auto;

	1210

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

	1212 }

	1213

	1214 :host(:hover) {

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

	1216 }

	1217

	1218 iron-icon {

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

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

	1221 }

	1222 </style>

	1223

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

	1225 </template>

	1226

	1227 </dom-module>

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

	1229 <template>

	1230 <style>

	1231 :host {

	1232 @apply(--layout-inline);

	1233 @apply(--layout-center);

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

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

	1236

	1237 position: relative;

	1238 padding: 0 12px;

	1239 overflow: hidden;

	1240 cursor: pointer;

	1241 vertical-align: middle;

	1242

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

	1244 @apply(--paper-tab);

	1245 }

	1246

	1247 :host(:focus) {

	1248 outline: none;

	1249 }

	1250

	1251 :host([link]) {

	1252 padding: 0;

	1253 }

	1254

	1255 .tab-content {

	1256 height: 100%;

	1257 transform: translateZ(0);

	1258 -webkit-transform: translateZ(0);

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

	1260 @apply(--layout-horizontal);

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

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

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

	1264 }

	1265

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

	1267 opacity: 0.8;

	1268

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

	1270 }

	1271

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

	1273 opacity: 1;

	1274 font-weight: 700;

	1275 }

	1276

	1277 paper-ripple {

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

	1279 }

	1280

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

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

	1283

	1284 height: 100%;

	1285 }

	1286 </style>

	1287

	1288 <div class="tab-content">

	1289 <content></content>

	1290 </div>

	1291 </template>

	1292

	1293 </dom-module>

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

	1295 <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>

	1297 <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>

	1299 </iron-iconset-svg>

	1300

	1301

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

	1303 <template>

	1304 <style>

	1305 :host {

	1306 @apply(--layout);

	1307 @apply(--layout-center);

	1308

	1309 height: 48px;

	1310 font-size: 14px;

	1311 font-weight: 500;

	1312 overflow: hidden;

	1313 -moz-user-select: none;

	1314 -ms-user-select: none;

	1315 -webkit-user-select: none;

	1316 user-select: none;

	1317

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

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

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

	1321

	1322 @apply(--paper-tabs);

	1323 }

	1324

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

	1326 @apply(--layout-horizontal-reverse);

	1327 }

	1328

	1329 #tabsContainer {

	1330 position: relative;

	1331 height: 100%;

	1332 white-space: nowrap;

	1333 overflow: hidden;

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

	1335 }

	1336

	1337 #tabsContent {

	1338 height: 100%;

	1339 -moz-flex-basis: auto;

	1340 -ms-flex-basis: auto;

	1341 flex-basis: auto;

	1342 }

	1343

	1344 #tabsContent.scrollable {

	1345 position: absolute;

	1346 white-space: nowrap;

	1347 }

	1348

	1349 #tabsContent:not(.scrollable),

	1350 #tabsContent.scrollable.fit-container {

	1351 @apply(--layout-horizontal);

	1352 }

	1353

	1354 #tabsContent.scrollable.fit-container {

	1355 min-width: 100%;

	1356 }

	1357

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

	1359 /* IE - prevent tabs from compressing when they should scroll. */

	1360 -ms-flex: 1 0 auto;

	1361 -webkit-flex: 1 0 auto;

	1362 flex: 1 0 auto;

	1363 }

	1364

	1365 .hidden {

	1366 display: none;

	1367 }

	1368

	1369 .not-visible {

	1370 opacity: 0;

	1371 cursor: default;

	1372 }

	1373

	1374 paper-icon-button {

	1375 width: 48px;

	1376 height: 48px;

	1377 padding: 12px;

	1378 margin: 0 4px;

	1379 }

	1380

	1381 #selectionBar {

	1382 position: absolute;

	1383 height: 2px;

	1384 bottom: 0;

	1385 left: 0;

	1386 right: 0;

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

	1388 -webkit-transform: scale(0);

	1389 transform: scale(0);

	1390 -webkit-transform-origin: left center;

	1391 transform-origin: left center;

	1392 transition: -webkit-transform;

	1393 transition: transform;

	1394

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

	1396 }

	1397

	1398 #selectionBar.align-bottom {

	1399 top: 0;

	1400 bottom: auto;

	1401 }

	1402

	1403 #selectionBar.expand {

	1404 transition-duration: 0.15s;

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

	1406 }

	1407

	1408 #selectionBar.contract {

	1409 transition-duration: 0.18s;

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

	1411 }

	1412

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

	1414 height: 100%;

	1415 }

	1416 </style>

	1417

	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>

	1419

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

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

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

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

	1424 </div>

	1425 </div>

	1426

	1427 <paper-icon-button icon="paper-tabs:chevron-right" class$="[[_computeScrollB uttonClass(_rightHidden, scrollable, hideScrollButtons)]]" on-up="_onScrollButto nUp" on-down="_onRightScrollButtonDown" tabindex="-1"></paper-icon-button>

	1428

	1429 </template>

	1430

	1431 </dom-module>

	1432 <iron-iconset-svg name="cr" size="24">

	1433 <svg>

	1434 <defs>

	1435

	1436 <g id="add"><path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"></path></g>

	1437 <g id="arrow-drop-down"><path d="M7 10l5 5 5-5z"></path></g>

	1438 <g id="cancel"><path d="M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10- 10S17.53 2 12 2zm5 13.59L15.59 17 12 13.41 8.41 17 7 15.59 10.59 12 7 8.41 8.41 7 12 10.59 15.59 7 17 8.41 13.41 12 17 15.59z"></path></g>

	1439 <if expr="chromeos">

	1440 <g id="check"><path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"> </path></g>

	1441 </if>

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

	1443 <g id="clear"><path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"></path></g>

	1444 <g id="close"><path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"></path></g>

	1445 <g id="domain"><path d="M12 7V3H2v18h20V7H12zM6 19H4v-2h2v2zm0-4H4v-2h2v2z m0-4H4V9h2v2zm0-4H4V5h2v2zm4 12H8v-2h2v2zm0-4H8v-2h2v2zm0-4H8V9h2v2zm0-4H8V5h2v2 zm10 12h-8v-2h2v-2h-2v-2h2v-2h-2V9h8v10zm-2-8h-2v2h2v-2zm0 4h-2v2h2v-2z"></path> </g>

	1446 <g id="expand-less"><path d="M12 8l-6 6 1.41 1.41L12 10.83l4.59 4.58L18 14 z"></path></g>

	1447 <g id="expand-more"><path d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z" ></path></g>

	1448 <g id="extension"><path d="M20.5 11H19V7c0-1.1-.9-2-2-2h-4V3.5C13 2.12 11. 88 1 10.5 1S8 2.12 8 3.5V5H4c-1.1 0-1.99.9-1.99 2v3.8H3.5c1.49 0 2.7 1.21 2.7 2. 7s-1.21 2.7-2.7 2.7H2V20c0 1.1.9 2 2 2h3.8v-1.5c0-1.49 1.21-2.7 2.7-2.7 1.49 0 2 .7 1.21 2.7 2.7V22H17c1.1 0 2-.9 2-2v-4h1.5c1.38 0 2.5-1.12 2.5-2.5S21.88 11 20. 5 11z"></path></g>

	1449 <g id="file-download"><path d="M19 9h-4V3H9v6H5l7 7 7-7zM5 18v2h14v-2H5z"> </path></g>

	1450 <g id="fullscreen"><path d="M7 14H5v5h5v-2H7v-3zm-2-4h2V7h3V5H5v5zm12 7h-3 v2h5v-5h-2v3zM14 5v2h3v3h2V5h-5z"></path></g>

	1451 <g id="group"><path d="M16 11c1.66 0 2.99-1.34 2.99-3S17.66 5 16 5c-1.66 0 -3 1.34-3 3s1.34 3 3 3zm-8 0c1.66 0 2.99-1.34 2.99-3S9.66 5 8 5C6.34 5 5 6.34 5 8s1.34 3 3 3zm0 2c-2.33 0-7 1.17-7 3.5V19h14v-2.5c0-2.33-4.67-3.5-7-3.5zm8 0c-.2 9 0-.62.02-.97.05 1.16.84 1.97 1.97 1.97 3.45V19h6v-2.5c0-2.33-4.67-3.5-7-3.5z"> </path></g>

	1452 <g id="menu"><path d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"></pat h></g>

	1453 <g id="more-vert"><path d="M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"></path></g>

	1454 <g id="person"><path d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1. 79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"></path></g>

	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>

	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>

	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>

	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>

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

	1460 </defs>

	1461 </svg>

	1462 </iron-iconset-svg>

	1463

	1464

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

	1466 <template>

	1467 <style>

	1468 :host {

	1469 display: inline-block;

	1470 position: fixed;

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

	1472 }

	1473 </style>

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

	1475 </template>

	1476

	1477 </dom-module>

	1478 <style>

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

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

	1481 * found in the LICENSE file. */

	1482

	1483 <if expr="not chromeos">

	1484 @font-face {

	1485 font-family: 'Roboto';

	1486 font-style: normal;

	1487 font-weight: 400;

	1488 src: local('Roboto'), local('Roboto-Regular'),

	1489 url("chrome://resources/roboto/roboto-regular.woff2") format('woff2');

	1490 }

	1491

	1492 @font-face {

	1493 font-family: 'Roboto';

	1494 font-style: normal;

	1495 font-weight: 500;

	1496 src: local('Roboto Medium'), local('Roboto-Medium'),

	1497 url("chrome://resources/roboto/roboto-medium.woff2") format('woff2');

	1498 }

	1499

	1500 @font-face {

	1501 font-family: 'Roboto';

	1502 font-style: normal;

	1503 font-weight: 700;

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

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

	1506 }

	1507 </if>

	1508

	1509 </style>

	1510 <style is="custom-style">

	1511

	1512 :root {

	1513

	1514 /* Shared Styles */

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

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

	1517 -webkit-font-smoothing: antialiased;

	1518 };

	1519

	1520 --paper-font-common-code: {

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

	1522 -webkit-font-smoothing: antialiased;

	1523 };

	1524

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

	1526 text-rendering: optimizeLegibility;

	1527 };

	1528

	1529 --paper-font-common-nowrap: {

	1530 white-space: nowrap;

	1531 overflow: hidden;

	1532 text-overflow: ellipsis;

	1533 };

	1534

	1535 /* Material Font Styles */

	1536

	1537 --paper-font-display4: {

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

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

	1540

	1541 font-size: 112px;

	1542 font-weight: 300;

	1543 letter-spacing: -.044em;

	1544 line-height: 120px;

	1545 };

	1546

	1547 --paper-font-display3: {

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

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

	1550

	1551 font-size: 56px;

	1552 font-weight: 400;

	1553 letter-spacing: -.026em;

	1554 line-height: 60px;

	1555 };

	1556

	1557 --paper-font-display2: {

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

	1559

	1560 font-size: 45px;

	1561 font-weight: 400;

	1562 letter-spacing: -.018em;

	1563 line-height: 48px;

	1564 };

	1565

	1566 --paper-font-display1: {

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

	1568

	1569 font-size: 34px;

	1570 font-weight: 400;

	1571 letter-spacing: -.01em;

	1572 line-height: 40px;

	1573 };

	1574

	1575 --paper-font-headline: {

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

	1577

	1578 font-size: 24px;

	1579 font-weight: 400;

	1580 letter-spacing: -.012em;

	1581 line-height: 32px;

	1582 };

	1583

	1584 --paper-font-title: {

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

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

	1587

	1588 font-size: 20px;

	1589 font-weight: 500;

	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

	1665 </style>

	1666

	1667

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

	1669 <template>

	1670 <style>

	1671 :host {

	1672 display: block;

	1673 padding: 8px 0;

	1674

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

	1676 }

	1677

	1678 :host([inline]) {

	1679 display: inline-block;

	1680 }

	1681

	1682 :host([disabled]) {

	1683 pointer-events: none;

	1684 opacity: 0.33;

	1685

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

	1687 }

	1688

	1689 :host([hidden]) {

	1690 display: none !important;

	1691 }

	1692

	1693 .floated-label-placeholder {

	1694 @apply(--paper-font-caption);

	1695 }

	1696

	1697 .underline {

	1698 position: relative;

	1699 }

	1700

	1701 .focused-line {

	1702 @apply(--layout-fit);

	1703

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

	1705 height: 2px;

	1706

	1707 -webkit-transform-origin: center center;

	1708 transform-origin: center center;

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

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

	1711

	1712 @apply(--paper-input-container-underline-focus);

	1713 }

	1714

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

	1716 -webkit-transform: none;

	1717 transform: none;

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

	1719 transition: transform 0.25s;

	1720

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

	1722 }

	1723

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

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

	1726 -webkit-transform: none;

	1727 transform: none;

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

	1729 transition: transform 0.25s;

	1730

	1731 @apply(--paper-transition-easing);

	1732 }

	1733

	1734 .unfocused-line {

	1735 @apply(--layout-fit);

	1736

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

	1738 height: 1px;

	1739

	1740 @apply(--paper-input-container-underline);

	1741 }

	1742

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

	1744 border-bottom: 1px dashed;

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

	1746 background: transparent;

	1747

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

	1749 }

	1750

	1751 .label-and-input-container {

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

	1753 @apply(--layout-relative);

	1754

	1755 width: 100%;

	1756 max-width: 100%;

	1757 }

	1758

	1759 .input-content {

	1760 @apply(--layout-horizontal);

	1761 @apply(--layout-center);

	1762

	1763 position: relative;

	1764 }

	1765

	1766 .input-content ::content label,

	1767 .input-content ::content .paper-input-label {

	1768 position: absolute;

	1769 top: 0;

	1770 right: 0;

	1771 left: 0;

	1772 width: 100%;

	1773 font: inherit;

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

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

	1776 transition: transform 0.25s, width 0.25s;

	1777 -webkit-transform-origin: left top;

	1778 transform-origin: left top;

	1779

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

	1781 @apply(--paper-font-subhead);

	1782 @apply(--paper-input-container-label);

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

	1784 }

	1785

	1786 .input-content.label-is-floating ::content label,

	1787 .input-content.label-is-floating ::content .paper-input-label {

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

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

	1790

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

	1792 original space now available */

	1793 width: 133%;

	1794

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

	1796 }

	1797

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

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

	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;

	1805 transform-origin: right top;

	1806 }

	1807

	1808 .input-content.label-is-highlighted ::content label,

	1809 .input-content.label-is-highlighted ::content .paper-input-label {

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

	1811

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

	1813 }

	1814

	1815 .input-content.is-invalid ::content label,

	1816 .input-content.is-invalid ::content .paper-input-label {

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

	1818 }

	1819

	1820 .input-content.label-is-hidden ::content label,

	1821 .input-content.label-is-hidden ::content .paper-input-label {

	1822 visibility: hidden;

	1823 }

	1824

	1825 .input-content ::content input,

	1826 .input-content ::content textarea,

	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;

	1831 box-shadow: none;

	1832 padding: 0;

	1833 width: 100%;

	1834 max-width: 100%;

	1835 background: transparent;

	1836 border: none;

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

	1838 -webkit-appearance: none;

	1839 text-align: inherit;

	1840

	1841 @apply(--paper-font-subhead);

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

	1843 }

	1844

	1845 ::content [prefix] {

	1846 @apply(--paper-font-subhead);

	1847

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

	1849 @apply(--layout-flex-none);

	1850 }

	1851

	1852 ::content [suffix] {

	1853 @apply(--paper-font-subhead);

	1854

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

	1856 @apply(--layout-flex-none);

	1857 }

	1858

	1859 /* Firefox sets a min-width on the input, which can cause layout issues */

	1860 .input-content ::content input {

	1861 min-width: 0;

	1862 }

	1863

	1864 .input-content ::content textarea {

	1865 resize: none;

	1866 }

	1867

	1868 .add-on-content {

	1869 position: relative;

	1870 }

	1871

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

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

	1874 }

	1875

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

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

	1878 }

	1879 </style>

	1880

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

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

	1883 </template>

	1884

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

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

	1887

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

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

	1890 </div>

	1891

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

	1893 </div>

	1894

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

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

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

	1898 </div>

	1899

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

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

	1902 </div>

	1903 </template>

	1904 </dom-module>

	1905

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

	1907 <template>

	1908 <style>

	1909 /*

	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;

	1929 width: 28px;

	1930 height: 28px;

	1931

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

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

	1934

	1935 /* ARCTIME */

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

	1937

	1938 /* 4 * ARCTIME */

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

	1940

	1941 /* SHRINK_TIME */

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

	1943 }

	1944

	1945 #spinnerContainer {

	1946 width: 100%;

	1947 height: 100%;

	1948

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

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

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

	1952 direction: ltr;

	1953 }

	1954

	1955 #spinnerContainer.active {

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

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

	1958 }

	1959

	1960 @-webkit-keyframes container-rotate {

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

	1962 }

	1963

	1964 @keyframes container-rotate {

	1965 to { transform: rotate(360deg) }

	1966 }

	1967

	1968 .spinner-layer {

	1969 position: absolute;

	1970 width: 100%;

	1971 height: 100%;

	1972 opacity: 0;

	1973 white-space: nowrap;

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

	1975 }

	1976

	1977 .layer-1 {

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

	1979 }

	1980

	1981 .layer-2 {

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

	1983 }

	1984

	1985 .layer-3 {

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

	1987 }

	1988

	1989 .layer-4 {

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

	1991 }

	1992

	1993 /**

	1994 * IMPORTANT NOTE ABOUT CSS ANIMATION PROPERTIES (keanulee):

	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);

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

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

	2006 animation-name: fill-unfill-rotate;

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

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

	2009 animation-iteration-count: infinite;

	2010 opacity: 1;

	2011 }

	2012

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

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

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

	2016 }

	2017

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

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

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

	2021 }

	2022

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

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

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

	2026 }

	2027

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

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

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

	2031 }

	2032

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

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

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

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

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

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

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

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

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

	2042 }

	2043

	2044 @keyframes fill-unfill-rotate {

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

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

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

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

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

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

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

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

	2053 }

	2054

	2055 @-webkit-keyframes layer-1-fade-in-out {

	2056 0% { opacity: 1 }

	2057 25% { opacity: 1 }

	2058 26% { opacity: 0 }

	2059 89% { opacity: 0 }

	2060 90% { opacity: 1 }

	2061 to { opacity: 1 }

	2062 }

	2063

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

	2065 0% { opacity: 1 }

	2066 25% { opacity: 1 }

	2067 26% { opacity: 0 }

	2068 89% { opacity: 0 }

	2069 90% { opacity: 1 }

	2070 to { opacity: 1 }

	2071 }

	2072

	2073 @-webkit-keyframes layer-2-fade-in-out {

	2074 0% { opacity: 0 }

	2075 15% { opacity: 0 }

	2076 25% { opacity: 1 }

	2077 50% { opacity: 1 }

	2078 51% { opacity: 0 }

	2079 to { opacity: 0 }

	2080 }

	2081

	2082 @keyframes layer-2-fade-in-out {

	2083 0% { opacity: 0 }

	2084 15% { opacity: 0 }

	2085 25% { opacity: 1 }

	2086 50% { opacity: 1 }

	2087 51% { opacity: 0 }

	2088 to { opacity: 0 }

	2089 }

	2090

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

	2092 0% { opacity: 0 }

	2093 40% { opacity: 0 }

	2094 50% { opacity: 1 }

	2095 75% { opacity: 1 }

	2096 76% { opacity: 0 }

	2097 to { opacity: 0 }

	2098 }

	2099

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

	2101 0% { opacity: 0 }

	2102 40% { opacity: 0 }

	2103 50% { opacity: 1 }

	2104 75% { opacity: 1 }

	2105 76% { opacity: 0 }

	2106 to { opacity: 0 }

	2107 }

	2108

	2109 @-webkit-keyframes layer-4-fade-in-out {

	2110 0% { opacity: 0 }

	2111 65% { opacity: 0 }

	2112 75% { opacity: 1 }

	2113 90% { opacity: 1 }

	2114 to { opacity: 0 }

	2115 }

	2116

	2117 @keyframes layer-4-fade-in-out {

	2118 0% { opacity: 0 }

	2119 65% { opacity: 0 }

	2120 75% { opacity: 1 }

	2121 90% { opacity: 1 }

	2122 to { opacity: 0 }

	2123 }

	2124

	2125 .circle-clipper {

	2126 display: inline-block;

	2127 position: relative;

	2128 width: 50%;

	2129 height: 100%;

	2130 overflow: hidden;

	2131 border-color: inherit;

	2132 }

	2133

	2134 /**

	2135 * Patch the gap that appear between the two adjacent div.circle-clipper w hile the

	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%;

	2141 border-top-style: solid;

	2142 }

	2143

	2144 .spinner-layer::after,

	2145 .circle-clipper::after {

	2146 content: '';

	2147 box-sizing: border-box;

	2148 position: absolute;

	2149 top: 0;

	2150 border-width: var(--paper-spinner-stroke-width, 3px);

	2151 border-color: inherit;

	2152 border-radius: 50%;

	2153 }

	2154

	2155 .circle-clipper::after {

	2156 bottom: 0;

	2157 width: 200%;

	2158 border-style: solid;

	2159 border-bottom-color: transparent !important;

	2160 }

	2161

	2162 .circle-clipper.left::after {

	2163 left: 0;

	2164 border-right-color: transparent !important;

	2165 -webkit-transform: rotate(129deg);

	2166 transform: rotate(129deg);

	2167 }

	2168

	2169 .circle-clipper.right::after {

	2170 left: -100%;

	2171 border-left-color: transparent !important;

	2172 -webkit-transform: rotate(-129deg);

	2173 transform: rotate(-129deg);

	2174 }

	2175

	2176 .active .gap-patch::after,

	2177 .active .circle-clipper::after {

	2178 -webkit-animation-duration: var(--paper-spinner-expand-contract-duration );

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

	2180 -webkit-animation-iteration-count: infinite;

	2181 animation-duration: var(--paper-spinner-expand-contract-duration);

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

	2183 animation-iteration-count: infinite;

	2184 }

	2185

	2186 .active .circle-clipper.left::after {

	2187 -webkit-animation-name: left-spin;

	2188 animation-name: left-spin;

	2189 }

	2190

	2191 .active .circle-clipper.right::after {

	2192 -webkit-animation-name: right-spin;

	2193 animation-name: right-spin;

	2194 }

	2195

	2196 @-webkit-keyframes left-spin {

	2197 0% { -webkit-transform: rotate(130deg) }

	2198 50% { -webkit-transform: rotate(-5deg) }

	2199 to { -webkit-transform: rotate(130deg) }

	2200 }

	2201

	2202 @keyframes left-spin {

	2203 0% { transform: rotate(130deg) }

	2204 50% { transform: rotate(-5deg) }

	2205 to { transform: rotate(130deg) }

	2206 }

	2207

	2208 @-webkit-keyframes right-spin {

	2209 0% { -webkit-transform: rotate(-130deg) }

	2210 50% { -webkit-transform: rotate(5deg) }

	2211 to { -webkit-transform: rotate(-130deg) }

	2212 }

	2213

	2214 @keyframes right-spin {

	2215 0% { transform: rotate(-130deg) }

	2216 50% { transform: rotate(5deg) }

	2217 to { transform: rotate(-130deg) }

	2218 }

	2219

	2220 #spinnerContainer.cooldown {

	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);

	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);

	2223 }

	2224

	2225 @-webkit-keyframes fade-out {

	2226 0% { opacity: 1 }

	2227 to { opacity: 0 }

	2228 }

	2229

	2230 @keyframes fade-out {

	2231 0% { opacity: 1 }

	2232 to { opacity: 0 }

	2233 }

	2234 </style>

	2235 </template>

	2236 </dom-module>

	2237

	2238

	2239 <dom-module id="paper-spinner-lite" assetpath="chrome://resources/polymer/v1_0/p aper-spinner/">

	2240 <template strip-whitespace="">

	2241 <style include="paper-spinner-styles"></style>

	2242

	2243 <div id="spinnerContainer" class-name="[[__computeContainerClasses(active, _ _coolingDown)]]">

	2244 <div class="spinner-layer">

	2245 <div class="circle-clipper left"></div>

	2246 <div class="circle-clipper right"></div>

	2247 </div>

	2248 </div>

	2249 </template>

	2250

	2251 </dom-module>

	2252 <dom-module id="cr-toolbar-search-field" assetpath="chrome://resources/cr_elemen ts/cr_toolbar/">

	2253 <template>

	2254 <style>

	2255 :host {

	2256 align-items: center;

	2257 display: flex;

	2258 height: 40px;

	2259 transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1),

	2260 width 150ms cubic-bezier(0.4, 0, 0.2, 1);

	2261 width: 44px;

	2262 }

	2263

	2264 [hidden] {

	2265 display: none !important;

	2266 }

	2267

	2268 paper-icon-button {

	2269 height: 32px;

	2270 margin: 6px;

	2271 min-width: 32px;

	2272 padding: 6px;

	2273 width: 32px;

	2274 }

	2275

	2276 #icon {

	2277 --paper-icon-button-ink-color: white;

	2278 transition: margin 150ms, opacity 200ms;

	2279 }

	2280

	2281 #prompt {

	2282 opacity: 0;

	2283 }

	2284

	2285 paper-spinner-lite {

	2286 --paper-spinner-color: white;

	2287 height: 20px;

	2288 margin: 0 6px;

	2289 opacity: 0;

	2290 padding: 6px;

	2291 position: absolute;

	2292 width: 20px;

	2293 }

	2294

	2295 paper-spinner-lite[active] {

	2296 opacity: 1;

	2297 }

	2298

	2299 #prompt,

	2300 paper-spinner-lite {

	2301 transition: opacity 200ms;

	2302 }

	2303

	2304 paper-input-container {

	2305 --paper-input-container-input-color: white;

	2306 --paper-input-container-underline: {

	2307 display: none;

	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;

	2317 flex: 1;

	2318 }

	2319

	2320 input[type='search']::-webkit-search-decoration,

	2321 input[type='search']::-webkit-search-cancel-button,

	2322 input[type='search']::-webkit-search-results-button {

	2323 -webkit-appearance: none;

	2324 }

	2325

	2326 /** Wide layout. */

	2327 :host(:not([narrow])) {

	2328 -webkit-padding-end: 0;

	2329 background: rgba(0, 0, 0, 0.22);

	2330 border-radius: 2px;

	2331 cursor: text;

	2332 width: var(--cr-toolbar-field-width);

	2333 }

	2334

	2335 :host(:not([narrow]):not([showing-search])) #icon,

	2336 :host(:not([narrow]):not([showing-search])) #prompt {

	2337 opacity: 0.6;

	2338 }

	2339

	2340 :host([narrow]:not([showing-search])) paper-input-container {

	2341 display: none;

	2342 }

	2343

	2344 /* Search open. */

	2345 :host([showing-search][spinner-active]) #icon {

	2346 opacity: 0;

	2347 }

	2348

	2349 :host([narrow][showing-search]) {

	2350 width: 100%;

	2351 }

	2352

	2353 /*

	2354 * Margin needs to be animated to prevent jumping around during

	2355 * opening/closing. -webkit-margin-start is not animatable, so we have to

	2356 * use regular margin-left/right instead.

	2357 */

	2358 :host-context([dir=ltr]):host([narrow][showing-search]) #icon {

	2359 margin-left: 18px;

	2360 }

	2361

	2362 :host-context([dir=rtl]):host([narrow][showing-search]) #icon {

	2363 margin-right: 18px;

	2364 }

	2365 </style>

	2366 <paper-spinner-lite active="[[isSpinnerShown_(spinnerActive, showingSearch)] ]">

	2367 </paper-spinner-lite>

	2368 <paper-icon-button id="icon" icon="cr:search" title="[[label]]" tabindex$="[ [computeIconTabIndex_(narrow)]]">

	2369 </paper-icon-button>

	2370 <paper-input-container id="searchTerm" on-search="onSearchTermSearch" on-key down="onSearchTermKeydown" no-label-float="">

	2371 <label id="prompt" for="searchInput">[[label]]</label>

	2372 <input is="iron-input" id="searchInput" type="search" on-blur="onInputBlur _" incremental="">

	2373 </paper-input-container>

	2374 <paper-icon-button icon="cr:cancel" id="clearSearch" title="[[clearLabel]]" hidden$="[[!hasSearchText_]]" on-tap="hideSearch_">

	2375 </paper-icon-button>

	2376 </template>

	2377 </dom-module>

	2378 <dom-module id="cr-toolbar" assetpath="chrome://resources/cr_elements/cr_toolbar /">

	2379 <template>

	2380 <style>

	2381 :host {

	2382 --cr-toolbar-field-width: 580px;

	2383 color: #fff;

	2384 display: flex;

	2385 height: 56px;

	2386 }

	2387

	2388 h1 {

	2389 @apply(--layout-flex);

	2390 -webkit-margin-start: 6px;

	2391 font-size: 123%;

	2392 font-weight: 400;

	2393 text-overflow: ellipsis;

	2394 overflow: hidden;

	2395 white-space: nowrap;

	2396 }

	2397

	2398 #leftContent {

	2399 -webkit-margin-start: 18px;

	2400 align-items: center;

	2401 display: flex;

	2402 position: absolute;

	2403 transition: opacity 100ms;

	2404 }

	2405

	2406 #menuButton {

	2407 height: 32px;

	2408 margin-bottom: 6px;

	2409 margin-top: 6px;

	2410 min-width: 32px;

	2411 padding: 6px;

	2412 width: 32px;

	2413 }

	2414

	2415 :host(:not([show-menu])) #menuButton {

	2416 display: none;

	2417 }

	2418

	2419 #centeredContent {

	2420 -webkit-margin-start: var(--cr-toolbar-field-margin, 0);

	2421 -webkit-padding-end: 12px;

	2422 display: flex;

	2423 flex: 1 1 0;

	2424 justify-content: center;

	2425 }

	2426

	2427 :host(:not([narrow_])) #leftContent {

	2428 max-width: calc((100% - var(--cr-toolbar-field-width) - 18px) / 2);

	2429 }

	2430

	2431 :host([narrow_]) #centeredContent {

	2432 justify-content: flex-end;

	2433 }

	2434

	2435 :host([narrow_][showing-search_]) #leftContent {

	2436 opacity: 0;

	2437 }

	2438 </style>

	2439 <div id="leftContent">

	2440 <paper-icon-button id="menuButton" icon="cr:menu" on-tap="onMenuTap_">

	2441 </paper-icon-button>

	2442 <h1>[[pageName]]</h1>

	2443 </div>

	2444

	2445 <div id="centeredContent">

	2446 <cr-toolbar-search-field id="search" narrow="[[narrow_]]" label="[[searchP rompt]]" clear-label="[[clearLabel]]" spinner-active="[[spinnerActive]]" showing -search="{{showingSearch_}}">

	2447 </cr-toolbar-search-field>

	2448 <iron-media-query query="(max-width: 900px)" query-matches="{{narrow_}}">

	2449 </iron-media-query>

	2450 </div>

	2451 </template>

	2452 </dom-module>

	2453 <iron-iconset-svg size="24" name="history">

	2454 <svg>

	2455 <defs>

	2456

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

	2458 <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>

	2459 </defs>

	2460 </svg>

	2461 </iron-iconset-svg>

	2462 <dom-module id="shared-style" assetpath="chrome://history/">

	2463 <template>

	2464 <style>

	2465 :root {

	2466 --card-border-color: rgba(0, 0, 0, 0.14);

	2467 --card-box-shadow: {

	2468 box-shadow: 0 2px 2px rgba(0, 0, 0, .05),

	2469 0 1px 4px rgba(0, 0, 0, .08),

	2470 0 1px 1px rgba(0, 0, 0, .2);;

	2471 };

	2472 --card-container-filter: {

	2473 filter: drop-shadow(0 2px 1px rgba(0, 0, 0, .05))

	2474 drop-shadow(0 1px 0px rgba(0, 0, 0, .08))

	2475 drop-shadow(0 1px 1px rgba(0, 0, 0, .2));

	2476 };

	2477 --card-first-last-item-padding: 8px;

	2478 --card-max-width: 960px;

	2479 --card-min-width: 550px;

	2480 --card-padding-between: 20px;

	2481 --card-padding-side: 24px;

	2482 --card-sizing: {

	2483 margin: 0 auto;

	2484 max-width: var(--card-max-width);

	2485 min-width: var(--card-min-width);

	2486 padding: 0 var(--card-padding-side);

	2487 width: calc(100% - 2 * var(--card-padding-side));

	2488 };

	2489 --first-card-padding-top: 24px;

	2490 --item-height: 44px;

	2491 --primary-text-color: #333;

	2492 --secondary-text-color: #757575;

	2493 --side-bar-width: 256px;

	2494 --toolbar-grouped-height: 101px;

	2495 --toolbar-height: 56px;

	2496 }

	2497

	2498 [hidden] {

	2499 display: none !important;

	2500 }

	2501

	2502 .card-title {

	2503 @apply(--layout-center);

	2504 @apply(--layout-horizontal);

	2505 -webkit-padding-start: 20px;

	2506 border-bottom: 1px solid var(--card-border-color);

	2507 border-radius: 2px 2px 0 0;

	2508 color: var(--primary-text-color);

	2509 font-size: 14px;

	2510 font-weight: 500;

	2511 height: 48px;

	2512 }

	2513

	2514 .centered-message {

	2515 align-items: center;

	2516 color: #b4b4b4;

	2517 display: flex;

	2518 flex: 1;

	2519 font-size: 14px;

	2520 font-weight: 500;

	2521 height: 100%;

	2522 justify-content: center;

	2523 }

	2524

	2525 .menu-item {

	2526 -webkit-user-select: none;

	2527 cursor: pointer;

	2528 font: inherit;

	2529 white-space: nowrap;

	2530 }

	2531

	2532 .website-icon {

	2533 -webkit-margin-end: 16px;

	2534 background-repeat: no-repeat;

	2535 background-size: 16px;

	2536 height: 16px;

	2537 width: 16px;

	2538 }

	2539

	2540 .website-title {

	2541 color: var(--primary-text-color);

	2542 overflow: hidden;

	2543 text-decoration: none;

	2544 text-overflow: ellipsis;

	2545 white-space: nowrap;

	2546 }

	2547

	2548 button.icon-button {

	2549 height: 36px;

	2550 width: 36px;

	2551 }

	2552

	2553 button.icon-button iron-icon {

	2554 color: var(--secondary-text-color);

	2555 height: 20px;

	2556 width: 20px;

	2557 }

	2558 </style>

	2559 </template>

	2560 </dom-module>

	2561 <dom-module id="history-toolbar" assetpath="chrome://history/">

	2562 <template>

	2563 <style include="shared-style">

	2564 :host {

	2565 color: #fff;

	2566 display: block;

	2567 transition: background-color 150ms;

	2568 width: 100%;

	2569 }

	2570

	2571 cr-toolbar,

	2572 #overlay-buttons,

	2573 #overlay-wrapper,

	2574 #toolbar-container {

	2575 @apply(--layout-center);

	2576 @apply(--layout-horizontal);

	2577 width: 100%;

	2578 }

	2579

	2580 :host([items-selected_]) {

	2581 background: rgb(68, 136, 255);

	2582 }

	2583

	2584 #toolbar-container {

	2585 height: var(--toolbar-height);

	2586 }

	2587

	2588 cr-toolbar {

	2589 --cr-toolbar-field-margin: var(--side-bar-width);

	2590 }

	2591

	2592 cr-toolbar[show-menu] {

	2593 --cr-toolbar-field-margin: 0;

	2594 }

	2595

	2596 :host(:not([has-drawer])) #overlay-wrapper {

	2597 -webkit-margin-start: var(--side-bar-width);

	2598 }

	2599

	2600 #overlay-buttons {

	2601 margin: 0 auto;

	2602 max-width: var(--card-max-width);

	2603 padding: 0 var(--card-padding-side);

	2604 }

	2605

	2606 paper-button {

	2607 font-weight: 500;

	2608 }

	2609

	2610 #number-selected {

	2611 @apply(--layout-flex);

	2612 }

	2613

	2614 #cancel-icon-button {

	2615 -webkit-margin-end: 24px;

	2616 -webkit-margin-start: 2px;

	2617 height: 36px;

	2618 min-width: 36px;

	2619 width: 36px;

	2620 }

	2621

	2622 #grouped-nav-container paper-icon-button {

	2623 --paper-icon-button-ink-color: rgba(255, 255, 255, 0.4);

	2624 -webkit-margin-start: 24px;

	2625 flex: 0 0 auto;

	2626 }

	2627

	2628 paper-tab {

	2629 --paper-tab-ink: rgba(255, 255, 255, 0.4);

	2630 font-size: 13px;

	2631 text-transform: uppercase;

	2632 }

	2633

	2634 paper-tabs {

	2635 --paper-tabs-selection-bar-color: var(--google-blue-500);

	2636 height: calc(var(--toolbar-grouped-height) - var(--toolbar-height));

	2637 min-width: 300px;

	2638 }

	2639

	2640 #grouped-buttons-container {

	2641 @apply(--layout-center);

	2642 @apply(--layout-horizontal);

	2643 }

	2644

	2645 #grouped-range-buttons {

	2646 -webkit-margin-start: 32px;

	2647 }

	2648

	2649 #grouped-nav-container {

	2650 @apply(--layout-center);

	2651 @apply(--layout-end-justified);

	2652 @apply(--layout-flex);

	2653 @apply(--layout-horizontal);

	2654 -webkit-margin-end: 24px;

	2655 overflow: hidden;

	2656 transition: opacity 150ms;

	2657 }

	2658

	2659 :host([grouped-range='0']) #grouped-nav-container {

	2660 opacity: 0;

	2661 pointer-events: none;

	2662 }

	2663

	2664 #grouped-date {

	2665 flex: 0 1 auto;

	2666 opacity: 0.7;

	2667 overflow: hidden;

	2668 text-align: right;

	2669 text-overflow: ellipsis;

	2670 white-space: nowrap;

	2671 }

	2672

	2673 :host-context([dir=rtl]) .rtl-reversible {

	2674 transform: rotate(180deg);

	2675 }

	2676 </style>

	2677 <div id="toolbar-container">

	2678 <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]]" on-search-changed="o nSearchChanged_">

	2679 </cr-toolbar>

	2680 <template is="dom-if" if="[[itemsSelected_]]">

	2681 <div id="overlay-wrapper" hidden$="[[!itemsSelected_]]">

	2682 <div id="overlay-buttons">

	2683 <paper-icon-button icon="cr:clear" id="cancel-icon-button" on-tap="o nClearSelectionTap_"></paper-icon-button>

	2684 <div id="number-selected">[[numberOfItemsSelected_(count)]]</div>

	2685 <paper-button id="cancel-button" on-tap="onClearSelectionTap_">

	2686 $i18n{cancel}

	2687 </paper-button>

	2688 <paper-button id="delete-button" on-tap="onDeleteTap_">

	2689 $i18n{delete}

	2690 </paper-button>

	2691 </div>

	2692 </div>

	2693 </template>

	2694 </div>

	2695 <template is="dom-if" if="[[isGroupedMode]]">

	2696 <div id="grouped-buttons-container">

	2697 <paper-tabs attr-for-selected="value" selected="{{groupedRange}}" id="gr ouped-range-buttons">

	2698 <paper-tab value="0">$i18n{rangeAllTime}</paper-tab>

	2699 <paper-tab value="1">$i18n{rangeWeek}</paper-tab>

	2700 <paper-tab value="2">$i18n{rangeMonth}</paper-tab>

	2701 </paper-tabs>

	2702 <div id="grouped-nav-container">

	2703 <span id="grouped-date">

	2704 {{getHistoryInterval_(queryStartTime, queryEndTime)}}

	2705 </span>

	2706 <paper-icon-button icon="history:today" alt="$i18n{rangeToday}" title= "$i18n{rangeToday}"></paper-icon-button>

	2707 <paper-icon-button icon="history:chevron-left" alt="$i18n{rangePreviou s}" title="$i18n{rangePrevious}" class="rtl-reversible"></paper-icon-button>

	2708 <paper-icon-button icon="cr:chevron-right" alt="$i18n{rangeNext}" titl e="$i18n{rangeNext}" class="rtl-reversible"></paper-icon-button>

	2709 </div>

	2710 </div>

	2711 </template>

	2712 </template>

	2713 </dom-module>

	2714 <dom-module id="cr-dialog" assetpath="chrome://resources/cr_elements/cr_dialog/" >

	2715 <template>

	2716 <style>

	2717 :host {

	2718 border: 0;

	2719 border-radius: 2px;

	2720 bottom: 0;

	2721 color: inherit;

	2722 padding: 0;

	2723 top: 0;

	2724 }

	2725

	2726 :host::backdrop {

	2727 background-color: rgba(0, 0, 0, 0.6);

	2728 bottom: 0;

	2729 left: 0;

	2730 position: fixed;

	2731 right: 0;

	2732 top: 0;

	2733 }

	2734

	2735 .title-container {

	2736 align-items: center;

	2737 /* TODO(dbeam): should this be a --settings-separator-line? */

	2738 border-bottom: 1px solid rgba(0, 0, 0, 0.14);

	2739 display: flex;

	2740 min-height: 52px;

	2741 }

	2742

	2743 :host ::content .title {

	2744 font-size: 123.07%; /* (16px / 13px) * 100 */

	2745 }

	2746

	2747 #close {

	2748 --paper-icon-button: {

	2749 height: 40px;

	2750 width: 40px;

	2751 };

	2752 -webkit-margin-end: 6px;

	2753 /* <paper-icon-button> overrides --iron-icon-{height,width}, so this

	2754 * padding essentially reduces 40x40 to 20x20. */

	2755 padding: 10px;

	2756 }

	2757

	2758 .body-container {

	2759 display: flex;

	2760 flex-direction: column;

	2761 max-width: 800px;

	2762 min-width: 512px;

	2763 /* TODO(dbeam): use <paper-dialog-scrollable> to get dividers? */

	2764 overflow: auto;

	2765 }

	2766

	2767 :host ::content .body {

	2768 margin: 12px 0;

	2769 }

	2770

	2771 :host ::content .body,

	2772 :host ::content .title {

	2773 -webkit-padding-end: 24px;

	2774 -webkit-padding-start: 24px;

	2775 flex: 1;

	2776 }

	2777

	2778 :host ::content .button-container {

	2779 -webkit-padding-end: 16px;

	2780 -webkit-padding-start: 16px;

	2781 display: flex;

	2782 justify-content: flex-end;

	2783 margin-bottom: 12px;

	2784 margin-top: 12px;

	2785 }

	2786

	2787 :host ::content .button-container .cancel-button {

	2788 -webkit-margin-end: 8px;

	2789 color: var(--paper-grey-600);

	2790 }

	2791

	2792 :host ::content .footer {

	2793 background-color: var(--paper-grey-200);

	2794 border-bottom-left-radius: inherit;

	2795 border-bottom-right-radius: inherit;

	2796 margin: 0;

	2797 padding: 12px 20px;

	2798 }

	2799 </style>

	2800 <div class="title-container">

	2801 <content select=".title"></content>

	2802 <paper-icon-button icon="cr:clear" on-tap="cancel" id="close">

	2803 </paper-icon-button>

	2804 </div>

	2805 <div class="body-container">

	2806 <content select=".body"></content>

	2807 </div>

	2808 <content select=".button-container"></content>

	2809 <content select=".footer"></content>

	2810 </template>

	2811 </dom-module>

	2812 <dom-module id="iron-overlay-backdrop" assetpath="chrome://resources/polymer/v1_ 0/iron-overlay-behavior/">

	2813

	2814 <template>

	2815 <style>

	2816 :host {

	2817 position: fixed;

	2818 top: 0;

	2819 left: 0;

	2820 width: 100%;

	2821 height: 100%;

	2822 background-color: var(--iron-overlay-backdrop-background-color, #000);

	2823 opacity: 0;

	2824 transition: opacity 0.2s;

	2825 pointer-events: none;

	2826 @apply(--iron-overlay-backdrop);

	2827 }

	2828

	2829 :host(.opened) {

	2830 opacity: var(--iron-overlay-backdrop-opacity, 0.6);

	2831 pointer-events: auto;

	2832 @apply(--iron-overlay-backdrop-opened);

	2833 }

	2834 </style>

	2835

	2836 <content></content>

	2837 </template>

	2838

	2839 </dom-module>

	2840

	2841 <script src="chrome://resources/polymer/v1_0/web-animations-js/web-animations-ne xt-lite.min.js"></script>

	2842

	2843

	2844 <dom-module id="iron-dropdown" assetpath="chrome://resources/polymer/v1_0/iron-d ropdown/">

	2845 <template>

	2846 <style>

	2847 :host {

	2848 position: fixed;

	2849 }

	2850

	2851 #contentWrapper ::content > * {

	2852 overflow: auto;

	2853 }

	2854

	2855 #contentWrapper.animating ::content > * {

	2856 overflow: hidden;

	2857 }

	2858 </style>

	2859

	2860 <div id="contentWrapper">

	2861 <content id="content" select=".dropdown-content"></content>

	2862 </div>

	2863 </template>

	2864

	2865 </dom-module>

	2866 <link rel="import" href="chrome://resources/html/util.html">

	2867 <dom-module id="cr-shared-menu" assetpath="chrome://resources/cr_elements/cr_sha red_menu/">

	2868 <template>

	2869 <style>

	2870 #menu {

	2871 @apply(--shadow-elevation-2dp);

	2872 background-color: white;

	2873 overflow: hidden;

	2874 padding: 8px 0;

	2875 position: relative;

	2876 }

	2877 </style>

	2878 <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]]">

	2879 <div id="menu" class="dropdown-content" role="menu">

	2880 <content></content>

	2881 </div>

	2882 </iron-dropdown>

	2883 </template>

	2884 </dom-module>

	2885

	2886 <style is="custom-style">

	2887 :root {

	2888 --cr-actionable: {

	2889 cursor: pointer;

	2890 };

	2891 --cr-focused-item-color: var(--google-grey-300);

	2892 --cr-separator-line: 1px solid rgba(0, 0, 0, 0.06);

	2893 }

	2894 </style>

	2895

	2896 <dom-module id="cr-shared-style" assetpath="chrome://resources/cr_elements/">

	2897 <template>

	2898 <style>

	2899 .action-button {

	2900 background: var(--google-blue-500);

	2901 color: white;

	2902 --paper-button-flat-keyboard-focus: {

	2903 background: rgb(58, 117, 215); /* 88% of --google-blue-500 */

	2904 };

	2905 }

	2906

	2907 .action-button[disabled] {

	2908 opacity: .25; /* TODO(dbeam): check this value with bettes. */

	2909 }

	2910

	2911 .cancel-button {

	2912 --paper-button-flat-keyboard-focus: {

	2913 background: rgba(0, 0, 0, .12);

	2914 };

	2915 }

	2916

	2917 .action-button,

	2918 .cancel-button {

	2919 font-weight: 500;

	2920 }

	2921

	2922 [actionable] {

	2923 @apply(--cr-actionable);

	2924 }

	2925 </style>

	2926 </template>

	2927 </dom-module>

	2928

	2929

	2930 <dom-module id="paper-item-shared-styles" assetpath="chrome://resources/polymer/ v1_0/paper-item/">

	2931 <template>

	2932 <style>

	2933 :host, .paper-item {

	2934 display: block;

	2935 position: relative;

	2936 min-height: var(--paper-item-min-height, 48px);

	2937 padding: 0px 16px;

	2938 }

	2939

	2940 .paper-item {

	2941 @apply(--paper-font-subhead);

	2942 border:none;

	2943 outline: none;

	2944 background: white;

	2945 width: 100%;

	2946 text-align: left;

	2947 }

	2948

	2949 :host([hidden]), .paper-item[hidden] {

	2950 display: none !important;

	2951 }

	2952

	2953 :host(.iron-selected), .paper-item.iron-selected {

	2954 font-weight: var(--paper-item-selected-weight, bold);

	2955

	2956 @apply(--paper-item-selected);

	2957 }

	2958

	2959 :host([disabled]), .paper-item[disabled] {

	2960 color: var(--paper-item-disabled-color, --disabled-text-color);

	2961

	2962 @apply(--paper-item-disabled);

	2963 }

	2964

	2965 :host(:focus), .paper-item:focus {

	2966 position: relative;

	2967 outline: 0;

	2968

	2969 @apply(--paper-item-focused);

	2970 }

	2971

	2972 :host(:focus):before, .paper-item:focus:before {

	2973 @apply(--layout-fit);

	2974

	2975 background: currentColor;

	2976 content: '';

	2977 opacity: var(--dark-divider-opacity);

	2978 pointer-events: none;

	2979

	2980 @apply(--paper-item-focused-before);

	2981 }

	2982 </style>

	2983 </template>

	2984 </dom-module>

	2985

	2986

	2987 <dom-module id="paper-item" assetpath="chrome://resources/polymer/v1_0/paper-ite m/">

	2988 <template>

	2989 <style include="paper-item-shared-styles"></style>

	2990 <style>

	2991 :host {

	2992 @apply(--layout-horizontal);

	2993 @apply(--layout-center);

	2994 @apply(--paper-font-subhead);

	2995

	2996 @apply(--paper-item);

	2997 }

	2998 </style>

	2999

	3000 <content></content>

	3001 </template>

	3002

	3003 </dom-module>

	3004 <dom-module id="iron-collapse" assetpath="chrome://resources/polymer/v1_0/iron-c ollapse/">

	3005

	3006 <template>

	3007

	3008 <style>

	3009 :host {

	3010 display: block;

	3011 transition-duration: var(--iron-collapse-transition-duration, 300ms);

	3012 overflow: visible;

	3013 }

	3014

	3015 :host(.iron-collapse-closed) {

	3016 display: none;

	3017 }

	3018

	3019 :host(:not(.iron-collapse-opened)) {

	3020 overflow: hidden;

	3021 }

	3022 </style>

	3023

	3024 <content></content>

	3025

	3026 </template>

	3027

	3028 </dom-module>

	3029

	3030 <dom-module id="paper-checkbox" assetpath="chrome://resources/polymer/v1_0/paper -checkbox/">

	3031 <template strip-whitespace="">

	3032 <style>

	3033 :host {

	3034 display: inline-block;

	3035 white-space: nowrap;

	3036 cursor: pointer;

	3037 --calculated-paper-checkbox-size: var(--paper-checkbox-size, 18px);

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

	3039 line-height: 0;

	3040 -webkit-tap-highlight-color: transparent;

	3041 }

	3042

	3043 :host([hidden]) {

	3044 display: none !important;

	3045 }

	3046

	3047 :host(:focus) {

	3048 outline: none;

	3049 }

	3050

	3051 .hidden {

	3052 display: none;

	3053 }

	3054

	3055 #checkboxContainer {

	3056 display: inline-block;

	3057 position: relative;

	3058 width: var(--calculated-paper-checkbox-size);

	3059 height: var(--calculated-paper-checkbox-size);

	3060 min-width: var(--calculated-paper-checkbox-size);

	3061 margin: var(--paper-checkbox-margin, initial);

	3062 vertical-align: var(--paper-checkbox-vertical-align, middle);

	3063 background-color: var(--paper-checkbox-unchecked-background-color, trans parent);

	3064 }

	3065

	3066 #ink {

	3067 position: absolute;

	3068

	3069 /* Center the ripple in the checkbox by negative offsetting it by

	3070 * (inkWidth - rippleWidth) / 2 */

	3071 top: calc(0px - (2.66 * var(--calculated-paper-checkbox-size) - var(--ca lculated-paper-checkbox-size)) / 2);

	3072 left: calc(0px - (2.66 * var(--calculated-paper-checkbox-size) - var(--c alculated-paper-checkbox-size)) / 2);

	3073 width: calc(2.66 * var(--calculated-paper-checkbox-size));

	3074 height: calc(2.66 * var(--calculated-paper-checkbox-size));

	3075 color: var(--paper-checkbox-unchecked-ink-color, --primary-text-color);

	3076 opacity: 0.6;

	3077 pointer-events: none;

	3078 }

	3079

	3080 :host-context([dir="rtl"]) #ink {

	3081 right: calc(0px - (2.66 * var(--calculated-paper-checkbox-size) - var(-- calculated-paper-checkbox-size)) / 2);

	3082 left: auto;

	3083 }

	3084

	3085 #ink[checked] {

	3086 color: var(--paper-checkbox-checked-ink-color, --primary-color);

	3087 }

	3088

	3089 #checkbox {

	3090 position: relative;

	3091 box-sizing: border-box;

	3092 height: 100%;

	3093 border: solid 2px;

	3094 border-color: var(--paper-checkbox-unchecked-color, --primary-text-color );

	3095 border-radius: 2px;

	3096 pointer-events: none;

	3097 -webkit-transition: background-color 140ms, border-color 140ms;

	3098 transition: background-color 140ms, border-color 140ms;

	3099 }

	3100

	3101 /* checkbox checked animations */

	3102 #checkbox.checked #checkmark {

	3103 -webkit-animation: checkmark-expand 140ms ease-out forwards;

	3104 animation: checkmark-expand 140ms ease-out forwards;

	3105 }

	3106

	3107 @-webkit-keyframes checkmark-expand {

	3108 0% {

	3109 -webkit-transform: scale(0, 0) rotate(45deg);

	3110 }

	3111 100% {

	3112 -webkit-transform: scale(1, 1) rotate(45deg);

	3113 }

	3114 }

	3115

	3116 @keyframes checkmark-expand {

	3117 0% {

	3118 transform: scale(0, 0) rotate(45deg);

	3119 }

	3120 100% {

	3121 transform: scale(1, 1) rotate(45deg);

	3122 }

	3123 }

	3124

	3125 #checkbox.checked {

	3126 background-color: var(--paper-checkbox-checked-color, --primary-color);

	3127 border-color: var(--paper-checkbox-checked-color, --primary-color);

	3128 }

	3129

	3130 #checkmark {

	3131 position: absolute;

	3132 width: 36%;

	3133 height: 70%;

	3134 border-style: solid;

	3135 border-top: none;

	3136 border-left: none;

	3137 border-right-width: calc(2/15 * var(--calculated-paper-checkbox-size));

	3138 border-bottom-width: calc(2/15 * var(--calculated-paper-checkbox-size));

	3139 border-color: var(--paper-checkbox-checkmark-color, white);

	3140 -webkit-transform-origin: 97% 86%;

	3141 transform-origin: 97% 86%;

	3142 box-sizing: content-box; /* protect against page-level box-sizing */

	3143 }

	3144

	3145 :host-context([dir="rtl"]) #checkmark {

	3146 -webkit-transform-origin: 50% 14%;

	3147 transform-origin: 50% 14%;

	3148 }

	3149

	3150 /* label */

	3151 #checkboxLabel {

	3152 position: relative;

	3153 display: inline-block;

	3154 vertical-align: middle;

	3155 padding-left: var(--paper-checkbox-label-spacing, 8px);

	3156 white-space: normal;

	3157 line-height: normal;

	3158 color: var(--paper-checkbox-label-color, --primary-text-color);

	3159 @apply(--paper-checkbox-label);

	3160 }

	3161

	3162 :host([checked]) #checkboxLabel {

	3163 color: var(--paper-checkbox-label-checked-color, --paper-checkbox-label- color);

	3164 @apply(--paper-checkbox-label-checked);

	3165 }

	3166

	3167 :host-context([dir="rtl"]) #checkboxLabel {

	3168 padding-right: var(--paper-checkbox-label-spacing, 8px);

	3169 padding-left: 0;

	3170 }

	3171

	3172 #checkboxLabel[hidden] {

	3173 display: none;

	3174 }

	3175

	3176 /* disabled state */

	3177

	3178 :host([disabled]) #checkbox {

	3179 opacity: 0.5;

	3180 border-color: var(--paper-checkbox-unchecked-color, --primary-text-color );

	3181 }

	3182

	3183 :host([disabled][checked]) #checkbox {

	3184 background-color: var(--paper-checkbox-unchecked-color, --primary-text-c olor);

	3185 opacity: 0.5;

	3186 }

	3187

	3188 :host([disabled]) #checkboxLabel {

	3189 opacity: 0.65;

	3190 }

	3191

	3192 /* invalid state */

	3193 #checkbox.invalid:not(.checked) {

	3194 border-color: var(--paper-checkbox-error-color, --error-color);

	3195 }

	3196 </style>

	3197

	3198 <div id="checkboxContainer">

	3199 <div id="checkbox" class$="[[_computeCheckboxClass(checked, invalid)]]">

	3200 <div id="checkmark" class$="[[_computeCheckmarkClass(checked)]]"></div>

	3201 </div>

	3202 </div>

	3203

	3204 <div id="checkboxLabel"><content></content></div>

	3205 </template>

	3206

	3207 </dom-module>

	3208 <dom-module id="paper-icon-button-light" assetpath="chrome://resources/polymer/v 1_0/paper-icon-button/">

	3209 <template strip-whitespace="">

	3210 <style>

	3211 :host {

	3212 vertical-align: middle;

	3213 color: inherit;

	3214 outline: none;

	3215 width: 24px;

	3216 height: 24px;

	3217 background: none;

	3218 margin: 0;

	3219 border: none;

	3220 padding: 0;

	3221

	3222 position: relative;

	3223 cursor: pointer;

	3224

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

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

	3227 -webkit-tap-highlight-color: transparent;

	3228 }

	3229

	3230 :host([disabled]) {

	3231 color: #9b9b9b;

	3232 pointer-events: none;

	3233 cursor: auto;

	3234 }

	3235

	3236 paper-ripple {

	3237 opacity: 0.6;

	3238 color: currentColor;

	3239 }

	3240 </style>

	3241 <content></content>

	3242 </template>

	3243 </dom-module>

	3244 <dom-module id="history-searched-label" assetpath="chrome://history/">

	3245 <template>

	3246 <span id="container"></span>

	3247 </template>

	3248 </dom-module>

	3249 <dom-module id="history-item" assetpath="chrome://history/">

	3250 <template>

	3251 <style include="shared-style">

	3252 :host {

	3253 display: block;

	3254 }

	3255

	3256 :host(:not([embedded])) #main-container {

	3257 position: relative;

	3258 }

	3259

	3260 :host(:not([embedded])) #sizing-container {

	3261 @apply(--card-sizing);

	3262 }

	3263

	3264 :host([is-first-item]) #main-container {

	3265 margin-top: var(--first-card-padding-top);

	3266 }

	3267

	3268 :host([is-card-end]) #main-container {

	3269 margin-bottom: var(--card-padding-between);

	3270 }

	3271

	3272 :host([is-card-start][is-card-end]) #main-container {

	3273 border-radius: 2px;

	3274 }

	3275

	3276 #date-accessed {

	3277 display: none;

	3278 }

	3279

	3280 :host([is-card-start]) #date-accessed {

	3281 display: flex;

	3282 }

	3283

	3284 #item-container {

	3285 @apply(--layout-center);

	3286 @apply(--layout-horizontal);

	3287 min-height: var(--item-height);

	3288 }

	3289

	3290 :host([is-card-start]) #item-container {

	3291 padding-top: var(--card-first-last-item-padding);

	3292 }

	3293

	3294 :host([is-card-end]) #item-container {

	3295 padding-bottom: var(--card-first-last-item-padding);

	3296 }

	3297

	3298 #title-and-domain {

	3299 @apply(--layout-center);

	3300 @apply(--layout-flex);

	3301 @apply(--layout-horizontal);

	3302 height: var(--item-height);

	3303 overflow: hidden;

	3304 }

	3305

	3306 paper-checkbox {

	3307 --paper-checkbox-checked-color: rgb(68, 136, 255);

	3308 --paper-checkbox-size: 16px;

	3309 --paper-checkbox-unchecked-color: var(--secondary-text-color);

	3310 height: 16px;

	3311 margin: 0 16px 0 20px;

	3312 padding: 2px;

	3313 width: 16px;

	3314 }

	3315

	3316 #time-accessed {

	3317 color: #646464;

	3318 min-width: 96px;

	3319 }

	3320

	3321 #domain {

	3322 -webkit-margin-start: 16px;

	3323 color: var(--secondary-text-color);

	3324 flex-shrink: 0;

	3325 }

	3326

	3327 #menu-button {

	3328 -webkit-margin-end: 12px;

	3329 }

	3330

	3331 #star-container {

	3332 -webkit-margin-end: 4px;

	3333 -webkit-margin-start: 12px;

	3334 width: 32px;

	3335 }

	3336

	3337 #bookmark-star {

	3338 color: rgb(68, 136, 255);

	3339 height: 32px;

	3340 width: 32px;

	3341 }

	3342

	3343 #bookmark-star iron-icon {

	3344 height: 16px;

	3345 width: 16px;

	3346 }

	3347

	3348 #time-gap-separator {

	3349 -webkit-border-start: 1px solid #888;

	3350 -webkit-margin-start: 77px;

	3351 height: 15px;

	3352 }

	3353

	3354 #background {

	3355 background: #fff;

	3356 bottom: -1px; /* Prevents shadow artifacts when zoomed */

	3357 left: 0;

	3358 position: absolute;

	3359 right: 0;

	3360 top: 0;

	3361 z-index: -1;

	3362 }

	3363

	3364 :host([embedded]) #background {

	3365 display: none;

	3366 }

	3367

	3368 :host([is-card-start]) #background {

	3369 border-radius: 2px 2px 0 0;

	3370 }

	3371

	3372 :host([is-card-end]) #background {

	3373 border-radius: 0 0 2px 2px;

	3374 bottom: 0;

	3375 }

	3376 </style>

	3377

	3378 <div id="sizing-container">

	3379 <div id="main-container">

	3380 <div id="background"></div>

	3381 <div id="date-accessed" class="card-title">

	3382 [[cardTitle_(numberOfItems, item.dateRelativeDay, searchTerm)]]

	3383 </div>

	3384 <div id="item-container">

	3385 <paper-checkbox id="checkbox" on-mousedown="onCheckboxMousedown_" on-c lick="onCheckboxSelected_" checked="{{selected}}" disabled="[[selectionNotAllowe d_()]]">

	3386 </paper-checkbox>

	3387 <span id="time-accessed">[[item.readableTimestamp]]</span>

	3388 <div class="website-icon" id="icon"></div>

	3389 <div id="title-and-domain">

	3390 <a href="[[item.url]]" id="title" class="website-title" title="[[cro pItemTitle_(item.title)]]">

	3391 <history-searched-label title="[[cropItemTitle_(item.title)]]" sea rch-term="[[searchTerm]]"></history-searched-label>

	3392 </a>

	3393 <span id="domain">[[item.domain]]</span>

	3394 </div>

	3395 <div id="star-container">

	3396 <template is="dom-if" if="[[item.starred]]">

	3397 <button is="paper-icon-button-light" id="bookmark-star" title="$i1 8n{removeBookmark}" on-tap="onRemoveBookmarkTap_">

	3398 <iron-icon icon="cr:star"></iron-icon>

	3399 </button>

	3400 </template>

	3401 </div>

	3402 <button is="paper-icon-button-light" id="menu-button" class="icon-butt on" title="$i18n{moreActionsButton}" on-tap="onMenuButtonTap_">

	3403 <iron-icon icon="cr:more-vert"></iron-icon>

	3404 </button>

	3405 </div>

	3406 <div id="time-gap-separator" hidden="[[!hasTimeGap]]"></div>

	3407 </div>

	3408 </div>

	3409 </template>

	3410 </dom-module>

	3411 <link rel="import" href="chrome://history/constants.html">

	3412 <dom-module id="history-grouped-list" assetpath="chrome://history/">

	3413 <template>

	3414 <style include="shared-style">

	3415 :host {

	3416 display: block;

	3417 overflow: auto;

	3418 position: relative;

	3419 }

	3420

	3421 #main-container {

	3422 @apply(--card-sizing);

	3423 align-items: center;

	3424 display: flex;

	3425 flex-direction: column;

	3426 padding-top: var(--first-card-padding-top);

	3427 }

	3428

	3429 .domain-heading {

	3430 align-items: center;

	3431 display: flex;

	3432 height: var(--item-height);

	3433 padding: 0 20px;

	3434 }

	3435

	3436 .domain-count {

	3437 color: rgb(151, 156, 160);

	3438 padding-left: 10px;

	3439 }

	3440

	3441 .domain-heading-text {

	3442 display: flex;

	3443 }

	3444

	3445 .group-container {

	3446 @apply(--card-box-shadow);

	3447 background: #fff;

	3448 border-radius: 2px;

	3449 margin-bottom: var(--card-padding-between);

	3450 max-width: var(--card-max-width);

	3451 min-width: var(--card-min-width);

	3452 width: 100%;

	3453 }

	3454

	3455 .card-title {

	3456 margin-bottom: var(--card-first-last-item-padding);

	3457 }

	3458

	3459 .domain-heading-text {

	3460 flex: 1 1 0;

	3461 }

	3462

	3463 .dropdown-indicator {

	3464 max-width: 16px;

	3465 }

	3466

	3467 history-item {

	3468 padding-left: 20px;

	3469 }

	3470 </style>

	3471 <div id="no-results" class="centered-message" hidden$="[[hasResults(groupedH istoryData_.length)]]">

	3472 [[noResultsMessage(searchedTerm, querying)]]

	3473 </div>

	3474 <div id="main-container" hidden$="[[!hasResults(groupedHistoryData_.length)] ]">

	3475 <template is="dom-repeat" items="[[groupedHistoryData_]]" as="group" initi al-count="1" index-as="groupIndex">

	3476 <div class="group-container">

	3477 <div class="card-title">

	3478 [[group.title]]

	3479 </div>

	3480

	3481 <template is="dom-repeat" items="[[group.domains]]" as="domain" initia l-count="10" index-as="domainIndex">

	3482 <div>

	3483 <div class="domain-heading" on-tap="toggleDomainExpanded_">

	3484 <div class="domain-heading-text">

	3485 <div class="website-icon" style="[[getWebsiteIconStyle_(domain )]]"></div>

	3486 <span>[[domain.domain]]</span>

	3487 <span class="domain-count">[[domain.visits.length]]</span>

	3488 </div>

	3489 <iron-icon icon="[[getDropdownIcon_(domain.expanded)]]" class="d ropdown-indicator"></iron-icon>

	3490 </div>

	3491 <iron-collapse opened="{{domain.expanded}}" id="collapse">

	3492 <template is="dom-if" if="[[domain.rendered]]">

	3493 <template is="dom-repeat" items="[[domain.visits]]" as="item" initial-count="5" index-as="itemIndex">

	3494 <history-item item="[[item]]" selected="{{item.selected}}" h as-time-gap="[[needsTimeGap_(

	3495 groupIndex, domainIndex, itemIndex)]]" search-term=" [[searchedTerm]]" number-of-items="[[historyData.length]]" path="[[pathForItem_(

	3496 groupIndex, domainIndex, itemIndex)]]" embedded="">

	3497 </history-item>

	3498 </template>

	3499 </template>

	3500 </iron-collapse>

	3501 </div>

	3502 </template>

	3503 </div>

	3504 </template>

	3505 </div>

	3506 </template>

	3507 </dom-module>

	3508 <dom-module id="iron-list" assetpath="chrome://resources/polymer/v1_0/iron-list/ ">

	3509 <template>

	3510 <style>

	3511 :host {

	3512 display: block;

	3513 position: relative;

	3514 }

	3515

	3516 @media only screen and (-webkit-max-device-pixel-ratio: 1) {

	3517 :host {

	3518 will-change: transform;

	3519 }

	3520 }

	3521

	3522 #items {

	3523 @apply(--iron-list-items-container);

	3524 position: relative;

	3525 }

	3526

	3527 :host(:not([grid])) #items > ::content > * {

	3528 width: 100%;

	3529 };

	3530

	3531 #items > ::content > * {

	3532 box-sizing: border-box;

	3533 margin: 0;

	3534 position: absolute;

	3535 top: 0;

	3536 will-change: transform;

	3537 }

	3538 </style>

	3539

	3540 <array-selector id="selector" items="{{items}}" selected="{{selectedItems}}" selected-item="{{selectedItem}}">

	3541 </array-selector>

	3542

	3543 <div id="items">

	3544 <content></content>

	3545 </div>

	3546

	3547 </template>

	3548 </dom-module>

	3549

	3550 <dom-module id="iron-scroll-threshold" assetpath="chrome://resources/polymer/v1_ 0/iron-scroll-threshold/">

	3551 <template>

	3552 <style>

	3553 :host {

	3554 display: block;

	3555 }

	3556 </style>

	3557

	3558 <content></content>

	3559

	3560 </template>

	3561 </dom-module>

	3562

	3563 <dom-module id="history-list" assetpath="chrome://history/">

	3564 <template>

	3565 <style include="shared-style">

	3566 :host {

	3567 display: block;

	3568 overflow: overlay;

	3569 }

	3570

	3571 #infinite-list {

	3572 @apply(--card-container-filter);

	3573 }

	3574

	3575 history-item {

	3576 --history-item-padding-side: var(--card-padding-side);

	3577 }

	3578 </style>

	3579 <div id="no-results" class="centered-message" hidden$="[[hasResults(historyD ata_.length)]]">

	3580 {{noResultsMessage(searchedTerm, querying)}}

	3581 </div>

	3582 <iron-list items="{{historyData_}}" as="item" id="infinite-list" hidden$="[[ !hasResults(historyData_.length)]]">

	3583 <template>

	3584 <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)]]">

	3585 </history-item>

	3586 </template>

	3587 </iron-list>

	3588 <iron-scroll-threshold id="scroll-threshold" scroll-target="infinite-list" l ower-threshold="500" on-lower-threshold="loadMoreData_">

	3589 </iron-scroll-threshold>

	3590 </template>

	3591 </dom-module>

	3592 <dom-module id="history-list-container" assetpath="chrome://history/">

	3593 <template>

	3594 <style include="shared-style cr-shared-style">

	3595 :host {

	3596 display: block;

	3597 height: 100%;

	3598 overflow: hidden;

	3599 }

	3600

	3601 #content,

	3602 #content > * {

	3603 height: 100%;

	3604 }

	3605

	3606 dialog .body {

	3607 white-space: pre-wrap;

	3608 }

	3609 </style>

	3610 <iron-pages id="content" attr-for-selected="id" selected="[[selectedPage_]]" >

	3611 <history-list id="infinite-list" querying="[[queryState.querying]]" search ed-term="[[queryResult.info.term]]"></history-list>

	3612 <template is="dom-if" if="[[grouped]]">

	3613 <history-grouped-list id="grouped-list" range="[[queryState.range]]" que ry-start-time="[[queryResult.info.queryStartTime]]" query-end-time="[[queryResul t.info.queryEndTime]]" searched-term="[[queryResult.info.term]]">

	3614 </history-grouped-list>

	3615 </template>

	3616 </iron-pages>

	3617

	3618 <template is="history-lazy-render" id="dialog">

	3619 <dialog is="cr-dialog">

	3620 <div class="title">$i18n{removeSelected}</div>

	3621 <div class="body">$i18n{deleteWarning}</div>

	3622 <div class="button-container">

	3623 <paper-button class="cancel-button" on-tap="onDialogCancelTap_">

	3624 $i18n{cancel}

	3625 </paper-button>

	3626 <paper-button class="action-button" on-tap="onDialogConfirmTap_" autof ocus="">

	3627 $i18n{deleteConfirm}

	3628 </paper-button>

	3629 </div>

	3630 </dialog>

	3631 </template>

	3632

	3633 <template is="history-lazy-render" id="sharedMenu">

	3634 <cr-shared-menu>

	3635 <paper-item id="menuMoreButton" class="menu-item" on-tap="onMoreFromSite Tap_">

	3636 $i18n{moreFromSite}

	3637 </paper-item>

	3638 <paper-item id="menuRemoveButton" class="menu-item" on-tap="onRemoveFrom HistoryTap_">

	3639 $i18n{removeFromHistory}

	3640 </paper-item>

	3641 </cr-shared-menu>

	3642 </template>

	3643 </template>

	3644 </dom-module>

	3645 <dom-module id="history-synced-device-card" assetpath="chrome://history/">

	3646 <template>

	3647 <style include="shared-style">

	3648 :host {

	3649 @apply(--card-sizing);

	3650 display: block;

	3651 padding-bottom: var(--card-padding-between);

	3652 }

	3653

	3654 #card-heading {

	3655 @apply(--layout-justified);

	3656 cursor: pointer;

	3657 }

	3658

	3659 #icon {

	3660 -webkit-margin-start: 20px;

	3661 }

	3662

	3663 #tab-item-list {

	3664 padding: 8px 0;

	3665 }

	3666

	3667 #last-update-time {

	3668 color: var(--secondary-text-color);

	3669 }

	3670

	3671 #right-buttons {

	3672 -webkit-margin-end: 4px;

	3673 }

	3674

	3675 #menu-button {

	3676 -webkit-margin-end: 8px;

	3677 }

	3678

	3679 #collapse {

	3680 overflow: hidden;

	3681 }

	3682

	3683 #history-item-container {

	3684 @apply(--card-box-shadow);

	3685 background: #fff;

	3686 border-radius: 2px;

	3687 }

	3688

	3689 #item-container {

	3690 @apply(--layout-center);

	3691 @apply(--layout-horizontal);

	3692 min-height: var(--item-height);

	3693 }

	3694

	3695 #window-separator {

	3696 background-color: var(--card-border-color);

	3697 height: 1px;

	3698 margin: 5px auto;

	3699 width: 80%;

	3700 }

	3701 </style>

	3702 <div id="history-item-container">

	3703 <div class="card-title" id="card-heading" aria-expanded$="[[cardOpen_]]" a ria-controls="collapse" on-tap="toggleTabCard">

	3704 <div>

	3705 [[device]]

	3706 <span id="last-update-time">[[lastUpdateTime]]</span>

	3707 </div>

	3708 <div id="right-buttons">

	3709 <button is="paper-icon-button-light" id="menu-button" class="icon-butt on" on-tap="onMenuButtonTap_" title="$i18n{moreActionsButton}">

	3710 <iron-icon icon="cr:more-vert"></iron-icon>

	3711 </button>

	3712 <button is="paper-icon-button-light" class="icon-button" title$="[[get CollapseTitle_(cardOpen_)]]">

	3713 <iron-icon icon="cr:expand-less" id="dropdown-indicator">

	3714 </iron-icon>

	3715 </button>

	3716 </div>

	3717 </div>

	3718

	3719 <iron-collapse opened="{{cardOpen_}}" id="collapse">

	3720 <div id="tab-item-list">

	3721 <template is="dom-repeat" items="[[tabs]]" as="tab" id="tab-list">

	3722 <div id="item-container">

	3723 <div id="icon" class="website-icon"></div>

	3724 <a href="[[tab.url]]" class="website-title" title="[[tab.title]]" on-click="openTab_">

	3725 <history-searched-label title="[[tab.title]]" search-term="[[sea rchTerm]]"></history-searched-label>

	3726 </a>

	3727 </div>

	3728 <div id="window-separator" hidden$="[[!isWindowSeparatorIndex_(index , separatorIndexes)]]">

	3729 </div>

	3730 </template>

	3731 </div>

	3732 </iron-collapse>

	3733 </div>

	3734 </template>

	3735 </dom-module>

	3736 <dom-module id="history-synced-device-manager" assetpath="chrome://history/">

	3737 <template>

	3738 <style include="shared-style">

	3739 :host {

	3740 display: block;

	3741 overflow: overlay;

	3742 }

	3743

	3744 #illustration {

	3745 background: -webkit-image-set(

	3746 url("chrome://history/images/100/sign_in_promo.png") 1x,

	3747 url("chrome://history/images/200/sign_in_promo.png") 2x)

	3748 no-repeat center center;

	3749 height: 222px;

	3750 margin-top: 100px;

	3751 width: 594px;

	3752 }

	3753

	3754 #no-synced-tabs {

	3755 height: 100%;

	3756 }

	3757

	3758 #sign-in-guide {

	3759 align-items: center;

	3760 display: flex;

	3761 flex-direction: column;

	3762 justify-content: center;

	3763 overflow-x: hidden;

	3764 text-align: center;

	3765 }

	3766

	3767 #sign-in-promo {

	3768 color: var(--primary-text-color);

	3769 font-size: 28px;

	3770 margin-top: 40px;

	3771 }

	3772

	3773 #sign-in-promo-desc {

	3774 color: #848484;

	3775 font-size: 16px;

	3776 margin-top: 10px;

	3777 }

	3778

	3779 #sign-in-button {

	3780 background-color: var(--google-blue-500);

	3781 color: white;

	3782 font-size: 14px;

	3783 margin-top: 24px;

	3784 }

	3785

	3786 #synced-device-list {

	3787 padding-top: var(--first-card-padding-top);

	3788 }

	3789 </style>

	3790 <div id="synced-device-list" hidden="[[!syncedDevices_.length]]">

	3791 <template is="dom-repeat" items="[[syncedDevices_]]" as="syncedDevice">

	3792 <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]]">

	3793 </history-synced-device-card>

	3794 </template>

	3795 </div>

	3796 <div id="no-synced-tabs" class="centered-message" hidden="[[!showNoSyncedMes sage(signInState_, syncedDevices_.length,

	3797 guestSession_)]]">

	3798 [[noSyncedTabsMessage(fetchingSyncedTabs_)]]

	3799 </div>

	3800 <div id="sign-in-guide" hidden="[[!showSignInGuide(signInState_, guestSessio n_)]]">

	3801 <div id="illustration"></div>

	3802 <div id="sign-in-promo">$i18n{signInPromo}</div>

	3803 <div id="sign-in-promo-desc">$i18n{signInPromoDesc}</div>

	3804 <paper-button id="sign-in-button" on-tap="onSignInTap_">

	3805 $i18n{signInButton}

	3806 </paper-button>

	3807 </div>

	3808

	3809 <template is="history-lazy-render" id="menu">

	3810 <cr-shared-menu>

	3811 <paper-item class="menu-item" on-tap="onOpenAllTap_">

	3812 $i18n{openAll}

	3813 </paper-item>

	3814 <paper-item class="menu-item" on-tap="onDeleteSessionTap_">

	3815 $i18n{deleteSession}

	3816 </paper-item>

	3817 </cr-shared-menu>

	3818 </template>

	3819 </template>

	3820 </dom-module>

	3821 <dom-module id="history-side-bar" assetpath="chrome://history/">

	3822 <template>

	3823 <style include="shared-style">

	3824 :host {

	3825 display: block;

	3826 height: 100%;

	3827 padding-top: 5px;

	3828 width: var(--side-bar-width);

	3829 }

	3830

	3831 div.separator {

	3832 background-color: rgba(0, 0, 0, 0.08);

	3833 height: 1px;

	3834 margin: 8px 0;

	3835 }

	3836

	3837 #clear-browsing-data {

	3838 text-transform: uppercase;

	3839 }

	3840

	3841 iron-selector {

	3842 -webkit-user-select: none;

	3843 background-color: transparent;

	3844 color: #5a5a5a;

	3845 }

	3846

	3847 iron-selector > a {

	3848 @apply(--paper-font-subhead);

	3849 -webkit-padding-start: 24px;

	3850 align-items: center;

	3851 box-sizing: border-box;

	3852 color: inherit;

	3853 cursor: pointer;

	3854 display: flex;

	3855 font-size: 14px;

	3856 font-weight: 500;

	3857 min-height: 48px;

	3858 position: relative;

	3859 text-decoration: none;

	3860 }

	3861

	3862 iron-selector > a.iron-selected {

	3863 color: var(--google-blue-500);

	3864 font-weight: 500;

	3865 }

	3866

	3867 #footer {

	3868 bottom: 0;

	3869 color: var(--paper-grey-600);

	3870 position: absolute;

	3871 width: var(--side-bar-width);

	3872 }

	3873

	3874 :host([drawer]) #footer {

	3875 /* This compensates the 120px by which app-drawer protrudes under

	3876 * the viewport. */

	3877 bottom: 120px;

	3878 }

	3879

	3880 #footer-text {

	3881 -webkit-padding-end: 16px;

	3882 -webkit-padding-start: 24px;

	3883 line-height: 20px;

	3884 margin: 24px 0;

	3885 }

	3886

	3887 #footer a {

	3888 color: var(--google-blue-700);

	3889 text-decoration: none;

	3890 }

	3891 </style>

	3892

	3893 <iron-selector id="menu" selected="{{selectedPage}}" selectable=".page-item" attr-for-selected="path" fallback-selection="history" on-iron-activate="onSelec torActivate_">

	3894 <a href="/[[getQueryString_(route)]]" class="page-item" path="history">

	3895 $i18n{historyMenuItem}

	3896 <paper-ripple></paper-ripple>

	3897 </a>

	3898 <a href="/syncedTabs[[getQueryString_(route)]]" class="page-item" path="sy ncedTabs">

	3899 $i18n{openTabsMenuItem}

	3900 <paper-ripple></paper-ripple>

	3901 </a>

	3902 <div class="separator"></div>

	3903 <a href="chrome://settings/clearBrowserData" on-tap="onClearBrowsingDataTa p_" id="clear-browsing-data">

	3904 $i18n{clearBrowsingData}

	3905 <paper-ripple></paper-ripple>

	3906 </a>

	3907 <div id="footer" hidden="[[!showFooter]]">

	3908 <div class="separator"></div>

	3909 <div id="footer-text">$i18nRaw{sidebarFooter}</div>

	3910 </div>

	3911 </iron-selector>

	3912 </template>

	3913 </dom-module>

	3914 </div><dom-module id="history-app">

	3915 <template>

	3916 <style no-process="">

	3917 history-toolbar {

	3918 background: var(--md-toolbar-color);

	3919 }

	3920 </style>

	3921 <style include="shared-style">

	3922 :host {

	3923 display: block;

	3924 height: 100%;

	3925 overflow: hidden;

	3926 }

	3927

	3928 /* Sizing this with flex causes slow load performance, see

	3929 crbug.com/618153. */

	3930 #main-container {

	3931 height: calc(100% - var(--toolbar-height));

	3932 }

	3933

	3934 :host([grouped_]) #main-container {

	3935 height: calc(100% - var(--toolbar-grouped-height));

	3936 }

	3937

	3938 #content-side-bar {

	3939 float: left;

	3940 }

	3941

	3942 #content,

	3943 #content > * {

	3944 height: 100%;

	3945 }

	3946

	3947 #drawer-header {

	3948 align-items: center;

	3949 border-bottom: 1px solid rgba(0, 0, 0, 0.08);

	3950 display: flex;

	3951 height: var(--toolbar-height);

	3952 margin-bottom: 5px;

	3953 }

	3954

	3955 h1 {

	3956 -webkit-padding-start: 24px;

	3957 color: rgb(66, 66, 66);

	3958 font-size: 123%;

	3959 font-weight: 400;

	3960 }

	3961 </style>

	3962 <app-location route="{{route_}}"></app-location>

	3963 <app-route route="{{route_}}" pattern="/:page" data="{{routeData_}}" query-p arams="{{queryParams_}}">

	3964 </app-route>

	3965 <history-toolbar id="toolbar" spinner-active="[[shouldShowSpinner_(queryStat e_.querying,

	3966 queryState_.incremental,

	3967 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_]]">

	3968 </history-toolbar>

	3969

	3970 <div id="main-container">

	3971 <history-side-bar id="content-side-bar" selected-page="[[selectedPage_]]" route="[[route_]]" show-footer="[[showSidebarFooter]]" hidden$="[[hasDrawer_]]">

	3972 </history-side-bar>

	3973 <iron-pages id="content" attr-for-selected="path" fallback-selection="hist ory" selected="[[getSelectedPage_(selectedPage_, items)]]" items="{{items}}">

	3974 <history-list-container id="history" query-state="{{queryState_}}" query -result="[[queryResult_]]" grouped="[[grouped_]]" path="history">

	3975 </history-list-container>

	3976 <template is="dom-if" if="[[syncedTabsSelected_(selectedPage_)]]">

	3977 <history-synced-device-manager id="synced-devices" session-list="[[que ryResult_.sessionList]]" search-term="[[queryState_.searchTerm]]" path="syncedTa bs">

	3978 </history-synced-device-manager>

	3979 </template>

	3980 </iron-pages>

	3981 </div>

	3982

	3983 <template is="dom-if" if="[[hasDrawer_]]">

	3984 <app-drawer id="drawer" swipe-open="" align="start" tabindex="0">

	3985 <div id="drawer-header">

	3986 <h1>$i18n{title}</h1>

	3987 </div>

	3988 <history-side-bar id="drawer-side-bar" selected-page="[[selectedPage_]]" route="[[route_]]" show-footer="[[showSidebarFooter]]" drawer="">

	3989 </history-side-bar>

	3990 </app-drawer>

	3991 </template>

	3992

	3993 <iron-media-query query="(max-width: 1023px)" query-matches="{{hasDrawer_}}" >

	3994 </iron-media-query>

	3995 </template>

	3996 </dom-module>

	3997 <script src="app.crisper.js"></script></body></html>

OLD	NEW

« no previous file with comments | « chrome/browser/resources/md_history/app.crisper.js ('k') | chrome/browser/resources/md_history/history.html » ('j') | no next file with comments »