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

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

Issue 2346383004: MD History: Update history-toolbar to use icon-button-light (Closed)
Patch Set: A Whole New World Created 4 years ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
1 <html><head><!-- 1 <html><head><!--
2 @license 2 @license
3 Copyright (c) 2014 The Polymer Project Authors. All rights reserved. 3 Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
4 This code may only be used under the BSD style license found at http://polymer.g ithub.io/LICENSE.txt 4 This code may only be used under the BSD style license found at http://polymer.g ithub.io/LICENSE.txt
5 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt 5 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
6 The complete set of contributors may be found at http://polymer.github.io/CONTRI BUTORS.txt 6 The complete set of contributors may be found at http://polymer.github.io/CONTRI BUTORS.txt
7 Code distributed by Google as part of the polymer project is also 7 Code distributed by Google as part of the polymer project is also
8 subject to an additional IP rights grant found at http://polymer.github.io/PATEN TS.txt 8 subject to an additional IP rights grant found at http://polymer.github.io/PATEN TS.txt
9 --><!-- 9 --><!--
10 @license 10 @license
(...skipping 189 matching lines...) Expand 10 before | Expand all | Expand 10 after
200 200
201 width: var(--iron-icon-width, 24px); 201 width: var(--iron-icon-width, 24px);
202 height: var(--iron-icon-height, 24px); 202 height: var(--iron-icon-height, 24px);
203 ; 203 ;
204 } 204 }
205 205
206 </style> 206 </style>
207 </template> 207 </template>
208 208
209 </dom-module> 209 </dom-module>
210 <iron-iconset-svg name="cr" size="24">
211 <svg>
212 <defs>
213
214 <g id="add"><path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"></path></g>
215 <g id="arrow-drop-down"><path d="M7 10l5 5 5-5z"></path></g>
216 <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>
217 <if expr="chromeos">
218 <g id="check"><path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"> </path></g>
219 </if>
220 <g id="chevron-right"><path d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6 -6z"></path></g>
221 <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>
222 <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>
223 <g id="delete"><path d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h -3.5l-1-1h-5l-1 1H5v2h14V4z"></path></g>
224 <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>
225 <g id="expand-less"><path d="M12 8l-6 6 1.41 1.41L12 10.83l4.59 4.58L18 14 z"></path></g>
226 <g id="expand-more"><path d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z" ></path></g>
227 <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>
228 <g id="file-download"><path d="M19 9h-4V3H9v6H5l7 7 7-7zM5 18v2h14v-2H5z"> </path></g>
229 <g id="fullscreen"><path d="M7 14H5v5h5v-2H7v-3zm-2-4h2V7h3V5H5v5zm12 7h-3 v2h5v-5h-2v3zM14 5v2h3v3h2V5h-5z"></path></g>
230 <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>
231 <g id="menu"><path d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"></pat h></g>
232 <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>
233 <g id="open-in-new"><path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V 3h-7z"></path></g>
234 <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>
235 <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>
236 <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>
237 <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>
238 <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>
239 <g id="warning"><path d="M1 21h22L12 2 1 21zm12-3h-2v-2h2v2zm0-4h-2v-4h2v4 z"></path></g>
240 </defs>
241 </svg>
242 </iron-iconset-svg>
210 <dom-module id="paper-ripple" assetpath="chrome://resources/polymer/v1_0/paper-r ipple/" css-build="shadow"> 243 <dom-module id="paper-ripple" assetpath="chrome://resources/polymer/v1_0/paper-r ipple/" css-build="shadow">
211 244
212 <template> 245 <template>
213 <style scope="paper-ripple">:host { 246 <style scope="paper-ripple">:host {
214 display: block; 247 display: block;
215 position: absolute; 248 position: absolute;
216 border-radius: inherit; 249 border-radius: inherit;
217 overflow: hidden; 250 overflow: hidden;
218 top: 0; 251 top: 0;
219 left: 0; 252 left: 0;
(...skipping 452 matching lines...) Expand 10 before | Expand all | Expand 10 after
672 --iron-icon-width: 100%; 705 --iron-icon-width: 100%;
673 --iron-icon-height: 100%; 706 --iron-icon-height: 100%;
674 } 707 }
675 708
676 </style> 709 </style>
677 710
678 <iron-icon id="icon" src="[[src]]" icon="[[icon]]" alt$="[[alt]]"></iron-ico n> 711 <iron-icon id="icon" src="[[src]]" icon="[[icon]]" alt$="[[alt]]"></iron-ico n>
679 </template> 712 </template>
680 713
681 </dom-module> 714 </dom-module>
682 <iron-iconset-svg name="cr" size="24">
683 <svg>
684 <defs>
685
686 <g id="add"><path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"></path></g>
687 <g id="arrow-drop-down"><path d="M7 10l5 5 5-5z"></path></g>
688 <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>
689 <if expr="chromeos">
690 <g id="check"><path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"> </path></g>
691 </if>
692 <g id="chevron-right"><path d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6 -6z"></path></g>
693 <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>
694 <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>
695 <g id="delete"><path d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h -3.5l-1-1h-5l-1 1H5v2h14V4z"></path></g>
696 <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>
697 <g id="expand-less"><path d="M12 8l-6 6 1.41 1.41L12 10.83l4.59 4.58L18 14 z"></path></g>
698 <g id="expand-more"><path d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z" ></path></g>
699 <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>
700 <g id="file-download"><path d="M19 9h-4V3H9v6H5l7 7 7-7zM5 18v2h14v-2H5z"> </path></g>
701 <g id="fullscreen"><path d="M7 14H5v5h5v-2H7v-3zm-2-4h2V7h3V5H5v5zm12 7h-3 v2h5v-5h-2v3zM14 5v2h3v3h2V5h-5z"></path></g>
702 <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>
703 <g id="menu"><path d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"></pat h></g>
704 <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>
705 <g id="open-in-new"><path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V 3h-7z"></path></g>
706 <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>
707 <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>
708 <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>
709 <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>
710 <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>
711 <g id="warning"><path d="M1 21h22L12 2 1 21zm12-3h-2v-2h2v2zm0-4h-2v-4h2v4 z"></path></g>
712 </defs>
713 </svg>
714 </iron-iconset-svg>
715 <dom-module id="paper-spinner-styles" assetpath="chrome://resources/polymer/v1_0 /paper-spinner/" css-build="shadow"> 715 <dom-module id="paper-spinner-styles" assetpath="chrome://resources/polymer/v1_0 /paper-spinner/" css-build="shadow">
716 <template> 716 <template>
717 <style scope="paper-spinner-styles">:host { 717 <style scope="paper-spinner-styles">:host {
718 display: inline-block; 718 display: inline-block;
719 position: relative; 719 position: relative;
720 width: 28px; 720 width: 28px;
721 height: 28px; 721 height: 28px;
722 722
723 723
724 --paper-spinner-container-rotation-duration: 1568ms; 724 --paper-spinner-container-rotation-duration: 1568ms;
(...skipping 1447 matching lines...) Expand 10 before | Expand all | Expand 10 after
2172 2172
2173 button.icon-button { 2173 button.icon-button {
2174 background: none; 2174 background: none;
2175 border: none; 2175 border: none;
2176 height: 36px; 2176 height: 36px;
2177 outline: none; 2177 outline: none;
2178 width: 36px; 2178 width: 36px;
2179 } 2179 }
2180 2180
2181 button.icon-button iron-icon { 2181 button.icon-button iron-icon {
2182 color: var(--secondary-text-color); 2182 height: 20px;
2183 height: 20px;
2184 width: 20px; 2183 width: 20px;
2185 } 2184 }
2186 2185
2187 button.more-vert-button { 2186 button.more-vert-button {
2188 height: 36px; 2187 height: 36px;
2189 padding: 6px; 2188 padding: 6px;
2190 width: 36px; 2189 width: 36px;
2191 } 2190 }
2192 2191
2193 button.more-vert-button div { 2192 button.more-vert-button div {
(...skipping 67 matching lines...) Expand 10 before | Expand all | Expand 10 after
2261 2260
2262 button.icon-button { 2261 button.icon-button {
2263 background: none; 2262 background: none;
2264 border: none; 2263 border: none;
2265 height: 36px; 2264 height: 36px;
2266 outline: none; 2265 outline: none;
2267 width: 36px; 2266 width: 36px;
2268 } 2267 }
2269 2268
2270 button.icon-button iron-icon { 2269 button.icon-button iron-icon {
2271 color: var(--secondary-text-color); 2270 height: 20px;
2272 height: 20px;
2273 width: 20px; 2271 width: 20px;
2274 } 2272 }
2275 2273
2276 button.more-vert-button { 2274 button.more-vert-button {
2277 height: 36px; 2275 height: 36px;
2278 padding: 6px; 2276 padding: 6px;
2279 width: 36px; 2277 width: 36px;
2280 } 2278 }
2281 2279
2282 button.more-vert-button div { 2280 button.more-vert-button div {
(...skipping 50 matching lines...) Expand 10 before | Expand all | Expand 10 after
2333 height: 32px; 2331 height: 32px;
2334 margin: 6px; 2332 margin: 6px;
2335 outline: none; 2333 outline: none;
2336 padding: 0; 2334 padding: 0;
2337 width: 32px; 2335 width: 32px;
2338 } 2336 }
2339 2337
2340 #info-button-icon { 2338 #info-button-icon {
2341 height: 20px; 2339 height: 20px;
2342 width: 20px; 2340 width: 20px;
2341 margin: 0 4px;
2343 } 2342 }
2344 2343
2345 iron-dropdown { 2344 iron-dropdown {
2346 margin-top: 28px; 2345 margin-top: 28px;
2347 } 2346 }
2348 2347
2349 .dropdown-content { 2348 .dropdown-content {
2350 box-shadow: var(--shadow-elevation-2dp_-_box-shadow); 2349 box-shadow: var(--shadow-elevation-2dp_-_box-shadow);
2351 background-color: white; 2350 background-color: white;
2352 border-radius: 2px; 2351 border-radius: 2px;
(...skipping 16 matching lines...) Expand all
2369 font-weight: 500; 2368 font-weight: 500;
2370 } 2369 }
2371 2370
2372 #number-selected { 2371 #number-selected {
2373 flex: 1; 2372 flex: 1;
2374 } 2373 }
2375 2374
2376 #cancel-icon-button { 2375 #cancel-icon-button {
2377 -webkit-margin-end: 24px; 2376 -webkit-margin-end: 24px;
2378 -webkit-margin-start: 2px; 2377 -webkit-margin-start: 2px;
2379 height: 36px;
2380 min-width: 36px;
2381 width: 36px;
2382 } 2378 }
2383 2379
2384 #grouped-nav-container paper-icon-button { 2380 paper-tabs {
2385 --paper-icon-button-ink-color: rgba(255, 255, 255, 0.4); 2381 --paper-tabs-selection-bar-color: #fff;
2386 -webkit-margin-start: 24px; 2382 -webkit-margin-start: 32px;
2387 flex: 0 0 auto; 2383 height: calc(var(--toolbar-grouped-height) - var(--toolbar-height));
2384 min-width: 300px;
2388 } 2385 }
2389 2386
2390 paper-tab { 2387 paper-tab {
2391 --paper-tab-ink: rgba(255, 255, 255, 0.4); 2388 --paper-tab-ink: rgba(255, 255, 255, 0.4);
2392 font-size: 13px; 2389 font-size: 13px;
2393 text-transform: uppercase; 2390 text-transform: uppercase;
2394 } 2391 }
2395 2392
2396 paper-tabs {
2397 --paper-tabs-selection-bar-color: var(--google-blue-500);
2398 height: calc(var(--toolbar-grouped-height) - var(--toolbar-height));
2399 min-width: 300px;
2400 }
2401
2402 #grouped-buttons-container { 2393 #grouped-buttons-container {
2403 align-items: center; 2394 align-items: center;
2404 display: flex; 2395 display: flex;
2405 } 2396 }
2406 2397
2407 #grouped-range-buttons {
2408 -webkit-margin-start: 32px;
2409 }
2410
2411 #grouped-nav-container { 2398 #grouped-nav-container {
2412 -webkit-margin-end: 24px; 2399 -webkit-margin-end: 16px;
2413 align-items: center; 2400 align-items: center;
2414 display: flex; 2401 display: flex;
2415 flex: 1; 2402 flex: 1;
2416 justify-content: flex-end; 2403 justify-content: flex-end;
2417 overflow: hidden; 2404 overflow: hidden;
2418 transition: opacity 150ms; 2405 transition: opacity 150ms;
2419 } 2406 }
2420 2407
2421 :host([grouped-range='0']) #grouped-nav-container { 2408 :host([grouped-range='0']) #grouped-nav-container {
2422 opacity: 0; 2409 opacity: 0;
2423 pointer-events: none; 2410 pointer-events: none;
2424 } 2411 }
2425 2412
2426 #grouped-date { 2413 #grouped-date {
2427 flex: 0 1 auto; 2414 -webkit-margin-end: 8px;
2415 flex: 0 1 auto;
2428 opacity: 0.7; 2416 opacity: 0.7;
2429 overflow: hidden; 2417 overflow: hidden;
2430 text-align: right; 2418 text-align: right;
2431 text-overflow: ellipsis; 2419 text-overflow: ellipsis;
2432 white-space: nowrap; 2420 white-space: nowrap;
2433 } 2421 }
2434 2422
2423 #grouped-nav-container button {
2424 -webkit-margin-start: 8px;
2425 flex: 0 0 auto;
2426 }
2427
2428 #grouped-nav-container button[disabled] {
2429 color: rgba(255, 255, 255, 0.5);
2430 }
2431
2435 :host-context([dir=rtl]) .rtl-reversible { 2432 :host-context([dir=rtl]) .rtl-reversible {
2436 transform: rotate(180deg); 2433 transform: rotate(180deg);
2437 } 2434 }
2438 2435
2439 </style> 2436 </style>
2440 <div id="toolbar-container"> 2437 <div id="toolbar-container">
2441 <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]]" show-menu-promo="[[s howMenuPromo]]" menu-label="$i18n{historyMenuButton}" menu-promo="$i18n{menuProm o}" close-menu-promo="$i18n{closeMenuPromo}" on-search-changed="onSearchChanged_ "> 2438 <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]]" show-menu-promo="[[s howMenuPromo]]" menu-label="$i18n{historyMenuButton}" menu-promo="$i18n{menuProm o}" close-menu-promo="$i18n{closeMenuPromo}" on-search-changed="onSearchChanged_ ">
2442 <div class="more-actions"> 2439 <div class="more-actions">
2443 <template is="dom-if" if="[[showSyncNotice]]"> 2440 <template is="dom-if" if="[[showSyncNotice]]">
2444 <button is="paper-icon-button-light" id="info-button" on-click="onIn foButtonTap_" aria-label="$i18n{hasSyncedResultsDescription}"> 2441 <button is="paper-icon-button-light" id="info-button" on-click="onIn foButtonTap_" aria-label="$i18n{hasSyncedResultsDescription}">
2445 <iron-icon icon="history:info-outline" id="info-button-icon"> 2442 <iron-icon icon="history:info-outline" id="info-button-icon">
2446 </iron-icon> 2443 </iron-icon>
2447 </button> 2444 </button>
2448 </template> 2445 </template>
2449 </div> 2446 </div>
2450 </cr-toolbar> 2447 </cr-toolbar>
2451 <template is="cr-lazy-render" id="syncNotice"> 2448 <template is="cr-lazy-render" id="syncNotice">
2452 <iron-dropdown vertical-align="top" horizontal-align="right" allow-outsi de-scroll=""> 2449 <iron-dropdown vertical-align="top" horizontal-align="right" allow-outsi de-scroll="">
2453 <div class="dropdown-content"> 2450 <div class="dropdown-content">
2454 $i18nRaw{hasSyncedResults} 2451 $i18nRaw{hasSyncedResults}
2455 </div> 2452 </div>
2456 </iron-dropdown> 2453 </iron-dropdown>
2457 </template> 2454 </template>
2458 <template is="dom-if" if="[[itemsSelected_]]"> 2455 <template is="dom-if" if="[[itemsSelected_]]">
2459 <div id="overlay-wrapper" hidden$="[[!itemsSelected_]]"> 2456 <div id="overlay-wrapper" hidden$="[[!itemsSelected_]]">
2460 <div id="overlay-buttons"> 2457 <div id="overlay-buttons">
2461 <paper-icon-button icon="cr:clear" id="cancel-icon-button" on-tap="o nClearSelectionTap_" title="$i18n{cancel}"> 2458 <button is="paper-icon-button-light" id="cancel-icon-button" class=" icon-button" on-tap="onClearSelectionTap_" title="$i18n{cancel}">
2462 </paper-icon-button> 2459 <iron-icon icon="cr:clear"></iron-icon>
2460 </button>
2463 <div id="number-selected">[[numberOfItemsSelected_(count)]]</div> 2461 <div id="number-selected">[[numberOfItemsSelected_(count)]]</div>
2464 <paper-button id="cancel-button" on-tap="onClearSelectionTap_"> 2462 <paper-button id="cancel-button" on-tap="onClearSelectionTap_">
2465 $i18n{cancel} 2463 $i18n{cancel}
2466 </paper-button> 2464 </paper-button>
2467 <paper-button id="delete-button" on-tap="onDeleteTap_"> 2465 <paper-button id="delete-button" on-tap="onDeleteTap_">
2468 $i18n{delete} 2466 $i18n{delete}
2469 </paper-button> 2467 </paper-button>
2470 </div> 2468 </div>
2471 </div> 2469 </div>
2472 </template> 2470 </template>
2473 </div> 2471 </div>
2474 <template is="dom-if" if="[[isGroupedMode]]"> 2472 <template is="dom-if" if="[[isGroupedMode]]">
2475 <div id="grouped-buttons-container"> 2473 <div id="grouped-buttons-container">
2476 <paper-tabs attr-for-selected="value" selected="{{groupedRange}}" id="gr ouped-range-buttons"> 2474 <paper-tabs attr-for-selected="value" selected="{{groupedRange}}">
2477 <paper-tab value="0">$i18n{rangeAllTime}</paper-tab> 2475 <paper-tab value="0">$i18n{rangeAllTime}</paper-tab>
2478 <paper-tab value="1">$i18n{rangeWeek}</paper-tab> 2476 <paper-tab value="1">$i18n{rangeWeek}</paper-tab>
2479 <paper-tab value="2">$i18n{rangeMonth}</paper-tab> 2477 <paper-tab value="2">$i18n{rangeMonth}</paper-tab>
2480 </paper-tabs> 2478 </paper-tabs>
2481 <div id="grouped-nav-container"> 2479 <div id="grouped-nav-container">
2482 <span id="grouped-date"> 2480 <span id="grouped-date">
2483 {{getHistoryInterval_(queryStartTime, queryEndTime)}} 2481 {{getHistoryInterval_(queryStartTime, queryEndTime)}}
2484 </span> 2482 </span>
2485 <paper-icon-button id="today-button" icon="history:today" alt="$i18n{r angeToday}" title="$i18n{rangeToday}" on-tap="onTodayTap_" disabled="[[isToday_( groupedOffset)]]"></paper-icon-button> 2483 <button is="paper-icon-button-light" id="today-button" class="icon-but ton" title="$i18n{rangeToday}" on-tap="onTodayTap_" disabled="[[isToday_(grouped Offset)]]">
2486 <paper-icon-button id="prev-button" icon="history:chevron-left" alt="$ i18n{rangePrevious}" title="$i18n{rangePrevious}" class="rtl-reversible" on-tap= "onPrevTap_" disabled="[[!hasMoreResults]]"></paper-icon-button> 2484 <iron-icon icon="history:today"></iron-icon>
2487 <paper-icon-button id="next-button" icon="cr:chevron-right" alt="$i18n {rangeNext}" title="$i18n{rangeNext}" class="rtl-reversible" on-tap="onNextTap_" disabled="[[isToday_(groupedOffset)]]"></paper-icon-button> 2485 </button>
2486 <button is="paper-icon-button-light" id="prev-button" title="$i18n{ran gePrevious}" class="icon-button rtl-reversible" on-tap="onPrevTap_" disabled="[[ !hasMoreResults]]">
2487 <iron-icon icon="history:chevron-left"></iron-icon>
2488 </button>
2489 <button is="paper-icon-button-light" id="next-button" title="$i18n{ran geNext}" class="icon-button rtl-reversible" on-tap="onNextTap_" disabled="[[isTo day_(groupedOffset)]]">
2490 <iron-icon icon="cr:chevron-right"></iron-icon>
2491 </button>
2488 </div> 2492 </div>
2489 </div> 2493 </div>
2490 </template> 2494 </template>
2491 </template> 2495 </template>
2492 </dom-module> 2496 </dom-module>
2493 2497
2494 <style is="custom-style" css-build="shadow">html { 2498 <style is="custom-style" css-build="shadow">html {
2495 --cr-actionable_-_cursor: pointer;; 2499 --cr-actionable_-_cursor: pointer;;
2496 --cr-focused-item-color: var(--google-grey-300); 2500 --cr-focused-item-color: var(--google-grey-300);
2501
2502 --cr-icon-padding: 8px;
2497 --cr-selectable-focus_-_background-color: var(--cr-focused-item-color); --c r-selectable-focus_-_outline: none; 2503 --cr-selectable-focus_-_background-color: var(--cr-focused-item-color); --c r-selectable-focus_-_outline: none;
2498 --cr-separator-line: 1px solid rgba(0, 0, 0, 0.06); 2504 --cr-separator-line: 1px solid rgba(0, 0, 0, 0.06);
2499 --paper-checkbox-ink-size: 40px; 2505 --paper-checkbox-ink-size: 40px;
2500 } 2506 }
2501 2507
2502 </style> 2508 </style>
2503 2509
2504 <dom-module id="cr-shared-style" assetpath="chrome://resources/cr_elements/" css -build="shadow"> 2510 <dom-module id="cr-shared-style" assetpath="chrome://resources/cr_elements/" css -build="shadow">
2505 <template> 2511 <template>
2506 <style scope="cr-shared-style">paper-spinner { 2512 <style scope="cr-shared-style">paper-spinner {
(...skipping 237 matching lines...) Expand 10 before | Expand all | Expand 10 after
2744 2750
2745 button.icon-button { 2751 button.icon-button {
2746 background: none; 2752 background: none;
2747 border: none; 2753 border: none;
2748 height: 36px; 2754 height: 36px;
2749 outline: none; 2755 outline: none;
2750 width: 36px; 2756 width: 36px;
2751 } 2757 }
2752 2758
2753 button.icon-button iron-icon { 2759 button.icon-button iron-icon {
2754 color: var(--secondary-text-color); 2760 height: 20px;
2755 height: 20px;
2756 width: 20px; 2761 width: 20px;
2757 } 2762 }
2758 2763
2759 button.more-vert-button { 2764 button.more-vert-button {
2760 height: 36px; 2765 height: 36px;
2761 padding: 6px; 2766 padding: 6px;
2762 width: 36px; 2767 width: 36px;
2763 } 2768 }
2764 2769
2765 button.more-vert-button div { 2770 button.more-vert-button div {
(...skipping 289 matching lines...) Expand 10 before | Expand all | Expand 10 after
3055 3060
3056 button.icon-button { 3061 button.icon-button {
3057 background: none; 3062 background: none;
3058 border: none; 3063 border: none;
3059 height: 36px; 3064 height: 36px;
3060 outline: none; 3065 outline: none;
3061 width: 36px; 3066 width: 36px;
3062 } 3067 }
3063 3068
3064 button.icon-button iron-icon { 3069 button.icon-button iron-icon {
3065 color: var(--secondary-text-color); 3070 height: 20px;
3066 height: 20px;
3067 width: 20px; 3071 width: 20px;
3068 } 3072 }
3069 3073
3070 button.more-vert-button { 3074 button.more-vert-button {
3071 height: 36px; 3075 height: 36px;
3072 padding: 6px; 3076 padding: 6px;
3073 width: 36px; 3077 width: 36px;
3074 } 3078 }
3075 3079
3076 button.more-vert-button div { 3080 button.more-vert-button div {
(...skipping 89 matching lines...) Expand 10 before | Expand all | Expand 10 after
3166 3170
3167 button.icon-button { 3171 button.icon-button {
3168 background: none; 3172 background: none;
3169 border: none; 3173 border: none;
3170 height: 36px; 3174 height: 36px;
3171 outline: none; 3175 outline: none;
3172 width: 36px; 3176 width: 36px;
3173 } 3177 }
3174 3178
3175 button.icon-button iron-icon { 3179 button.icon-button iron-icon {
3176 color: var(--secondary-text-color); 3180 height: 20px;
3177 height: 20px;
3178 width: 20px; 3181 width: 20px;
3179 } 3182 }
3180 3183
3181 button.more-vert-button { 3184 button.more-vert-button {
3182 height: 36px; 3185 height: 36px;
3183 padding: 6px; 3186 padding: 6px;
3184 width: 36px; 3187 width: 36px;
3185 } 3188 }
3186 3189
3187 button.more-vert-button div { 3190 button.more-vert-button div {
(...skipping 261 matching lines...) Expand 10 before | Expand all | Expand 10 after
3449 3452
3450 button.icon-button { 3453 button.icon-button {
3451 background: none; 3454 background: none;
3452 border: none; 3455 border: none;
3453 height: 36px; 3456 height: 36px;
3454 outline: none; 3457 outline: none;
3455 width: 36px; 3458 width: 36px;
3456 } 3459 }
3457 3460
3458 button.icon-button iron-icon { 3461 button.icon-button iron-icon {
3459 color: var(--secondary-text-color); 3462 height: 20px;
3460 height: 20px;
3461 width: 20px; 3463 width: 20px;
3462 } 3464 }
3463 3465
3464 button.more-vert-button { 3466 button.more-vert-button {
3465 height: 36px; 3467 height: 36px;
3466 padding: 6px; 3468 padding: 6px;
3467 width: 36px; 3469 width: 36px;
3468 } 3470 }
3469 3471
3470 button.more-vert-button div { 3472 button.more-vert-button div {
(...skipping 171 matching lines...) Expand 10 before | Expand all | Expand 10 after
3642 3644
3643 button.icon-button { 3645 button.icon-button {
3644 background: none; 3646 background: none;
3645 border: none; 3647 border: none;
3646 height: 36px; 3648 height: 36px;
3647 outline: none; 3649 outline: none;
3648 width: 36px; 3650 width: 36px;
3649 } 3651 }
3650 3652
3651 button.icon-button iron-icon { 3653 button.icon-button iron-icon {
3652 color: var(--secondary-text-color); 3654 height: 20px;
3653 height: 20px;
3654 width: 20px; 3655 width: 20px;
3655 } 3656 }
3656 3657
3657 button.more-vert-button { 3658 button.more-vert-button {
3658 height: 36px; 3659 height: 36px;
3659 padding: 6px; 3660 padding: 6px;
3660 width: 36px; 3661 width: 36px;
3661 } 3662 }
3662 3663
3663 button.more-vert-button div { 3664 button.more-vert-button div {
(...skipping 107 matching lines...) Expand 10 before | Expand all | Expand 10 after
3771 <history-side-bar id="drawer-side-bar" selected-page="{{selectedPage_}}" show-footer="[[showSidebarFooter]]" drawer=""> 3772 <history-side-bar id="drawer-side-bar" selected-page="{{selectedPage_}}" show-footer="[[showSidebarFooter]]" drawer="">
3772 </history-side-bar> 3773 </history-side-bar>
3773 </app-drawer> 3774 </app-drawer>
3774 </template> 3775 </template>
3775 3776
3776 <iron-media-query query="(max-width: 1023px)" query-matches="{{hasDrawer_}}" > 3777 <iron-media-query query="(max-width: 1023px)" query-matches="{{hasDrawer_}}" >
3777 </iron-media-query> 3778 </iron-media-query>
3778 </template> 3779 </template>
3779 </dom-module> 3780 </dom-module>
3780 <script src="app.crisper.js"></script></body></html> 3781 <script src="app.crisper.js"></script></body></html>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698