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

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

Issue 2268073002: MD History: Remove usage of iron-flex-layout from MD History (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
« no previous file with comments | « no previous file | chrome/browser/resources/md_history/history_item.html » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
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 2490 matching lines...) Expand 10 before | Expand all | Expand 10 after
2501 } 2501 }
2502 </style> 2502 </style>
2503 <dom-module id="shared-style" assetpath="chrome://history/"> 2503 <dom-module id="shared-style" assetpath="chrome://history/">
2504 <template> 2504 <template>
2505 <style> 2505 <style>
2506 [hidden] { 2506 [hidden] {
2507 display: none !important; 2507 display: none !important;
2508 } 2508 }
2509 2509
2510 .card-title { 2510 .card-title {
2511 @apply(--layout-center);
2512 @apply(--layout-horizontal);
2513 -webkit-padding-start: 20px; 2511 -webkit-padding-start: 20px;
2512 align-items: center;
2514 border-bottom: 1px solid var(--card-border-color); 2513 border-bottom: 1px solid var(--card-border-color);
2515 border-radius: 2px 2px 0 0; 2514 border-radius: 2px 2px 0 0;
2516 color: var(--primary-text-color); 2515 color: var(--primary-text-color);
2516 display: flex;
2517 font-size: 14px; 2517 font-size: 14px;
2518 font-weight: 500; 2518 font-weight: 500;
2519 height: 48px; 2519 height: 48px;
2520 } 2520 }
2521 2521
2522 .centered-message { 2522 .centered-message {
2523 align-items: center; 2523 align-items: center;
2524 color: #b4b4b4; 2524 color: #b4b4b4;
2525 display: flex; 2525 display: flex;
2526 flex: 1; 2526 flex: 1;
(...skipping 60 matching lines...) Expand 10 before | Expand all | Expand 10 after
2587 color: #fff; 2587 color: #fff;
2588 display: block; 2588 display: block;
2589 transition: background-color 150ms; 2589 transition: background-color 150ms;
2590 width: 100%; 2590 width: 100%;
2591 } 2591 }
2592 2592
2593 cr-toolbar, 2593 cr-toolbar,
2594 #overlay-buttons, 2594 #overlay-buttons,
2595 #overlay-wrapper, 2595 #overlay-wrapper,
2596 #toolbar-container { 2596 #toolbar-container {
2597 @apply(--layout-center); 2597 align-items: center;
2598 @apply(--layout-horizontal); 2598 display: flex;
2599 width: 100%; 2599 width: 100%;
2600 } 2600 }
2601 2601
2602 :host([items-selected_]) { 2602 :host([items-selected_]) {
2603 background: rgb(68, 136, 255); 2603 background: rgb(68, 136, 255);
2604 } 2604 }
2605 2605
2606 #toolbar-container { 2606 #toolbar-container {
2607 height: var(--toolbar-height); 2607 height: var(--toolbar-height);
2608 } 2608 }
(...skipping 14 matching lines...) Expand all
2623 margin: 0 auto; 2623 margin: 0 auto;
2624 max-width: var(--card-max-width); 2624 max-width: var(--card-max-width);
2625 padding: 0 var(--card-padding-side); 2625 padding: 0 var(--card-padding-side);
2626 } 2626 }
2627 2627
2628 paper-button { 2628 paper-button {
2629 font-weight: 500; 2629 font-weight: 500;
2630 } 2630 }
2631 2631
2632 #number-selected { 2632 #number-selected {
2633 @apply(--layout-flex); 2633 flex: 1;
2634 } 2634 }
2635 2635
2636 #cancel-icon-button { 2636 #cancel-icon-button {
2637 -webkit-margin-end: 24px; 2637 -webkit-margin-end: 24px;
2638 -webkit-margin-start: 2px; 2638 -webkit-margin-start: 2px;
2639 height: 36px; 2639 height: 36px;
2640 min-width: 36px; 2640 min-width: 36px;
2641 width: 36px; 2641 width: 36px;
2642 } 2642 }
2643 2643
2644 #grouped-nav-container paper-icon-button { 2644 #grouped-nav-container paper-icon-button {
2645 --paper-icon-button-ink-color: rgba(255, 255, 255, 0.4); 2645 --paper-icon-button-ink-color: rgba(255, 255, 255, 0.4);
2646 -webkit-margin-start: 24px; 2646 -webkit-margin-start: 24px;
2647 flex: 0 0 auto; 2647 flex: 0 0 auto;
2648 } 2648 }
2649 2649
2650 paper-tab { 2650 paper-tab {
2651 --paper-tab-ink: rgba(255, 255, 255, 0.4); 2651 --paper-tab-ink: rgba(255, 255, 255, 0.4);
2652 font-size: 13px; 2652 font-size: 13px;
2653 text-transform: uppercase; 2653 text-transform: uppercase;
2654 } 2654 }
2655 2655
2656 paper-tabs { 2656 paper-tabs {
2657 --paper-tabs-selection-bar-color: var(--google-blue-500); 2657 --paper-tabs-selection-bar-color: var(--google-blue-500);
2658 height: calc(var(--toolbar-grouped-height) - var(--toolbar-height)); 2658 height: calc(var(--toolbar-grouped-height) - var(--toolbar-height));
2659 min-width: 300px; 2659 min-width: 300px;
2660 } 2660 }
2661 2661
2662 #grouped-buttons-container { 2662 #grouped-buttons-container {
2663 @apply(--layout-center); 2663 align-items: center;
2664 @apply(--layout-horizontal); 2664 display: flex;
2665 } 2665 }
2666 2666
2667 #grouped-range-buttons { 2667 #grouped-range-buttons {
2668 -webkit-margin-start: 32px; 2668 -webkit-margin-start: 32px;
2669 } 2669 }
2670 2670
2671 #grouped-nav-container { 2671 #grouped-nav-container {
2672 @apply(--layout-center);
2673 @apply(--layout-end-justified);
2674 @apply(--layout-flex);
2675 @apply(--layout-horizontal);
2676 -webkit-margin-end: 24px; 2672 -webkit-margin-end: 24px;
2673 align-items: center;
2674 display: flex;
2675 flex: 1;
2676 justify-content: flex-end;
2677 overflow: hidden; 2677 overflow: hidden;
2678 transition: opacity 150ms; 2678 transition: opacity 150ms;
2679 } 2679 }
2680 2680
2681 :host([grouped-range='0']) #grouped-nav-container { 2681 :host([grouped-range='0']) #grouped-nav-container {
2682 opacity: 0; 2682 opacity: 0;
2683 pointer-events: none; 2683 pointer-events: none;
2684 } 2684 }
2685 2685
2686 #grouped-date { 2686 #grouped-date {
(...skipping 650 matching lines...) Expand 10 before | Expand all | Expand 10 after
3337 3337
3338 #date-accessed { 3338 #date-accessed {
3339 display: none; 3339 display: none;
3340 } 3340 }
3341 3341
3342 :host([is-card-start]) #date-accessed { 3342 :host([is-card-start]) #date-accessed {
3343 display: flex; 3343 display: flex;
3344 } 3344 }
3345 3345
3346 #item-container { 3346 #item-container {
3347 @apply(--layout-center); 3347 align-items: center;
3348 @apply(--layout-horizontal); 3348 display: flex;
3349 min-height: var(--item-height); 3349 min-height: var(--item-height);
3350 } 3350 }
3351 3351
3352 :host([is-card-start]) #item-container { 3352 :host([is-card-start]) #item-container {
3353 padding-top: var(--card-first-last-item-padding); 3353 padding-top: var(--card-first-last-item-padding);
3354 } 3354 }
3355 3355
3356 :host([is-card-end]) #item-container { 3356 :host([is-card-end]) #item-container {
3357 padding-bottom: var(--card-first-last-item-padding); 3357 padding-bottom: var(--card-first-last-item-padding);
3358 } 3358 }
3359 3359
3360 #title-and-domain { 3360 #title-and-domain {
3361 @apply(--layout-center); 3361 align-items: center;
3362 @apply(--layout-flex); 3362 display: flex;
3363 @apply(--layout-horizontal); 3363 flex: 1;
3364 height: var(--item-height); 3364 height: var(--item-height);
3365 overflow: hidden; 3365 overflow: hidden;
3366 } 3366 }
3367 3367
3368 paper-checkbox { 3368 paper-checkbox {
3369 --paper-checkbox-checked-color: rgb(68, 136, 255); 3369 --paper-checkbox-checked-color: rgb(68, 136, 255);
3370 --paper-checkbox-size: 16px; 3370 --paper-checkbox-size: 16px;
3371 --paper-checkbox-unchecked-color: var(--secondary-text-color); 3371 --paper-checkbox-unchecked-color: var(--secondary-text-color);
3372 height: 16px; 3372 height: 16px;
3373 margin: 0 16px 0 20px; 3373 margin: 0 16px 0 20px;
(...skipping 334 matching lines...) Expand 10 before | Expand all | Expand 10 after
3708 <dom-module id="history-synced-device-card" assetpath="chrome://history/"> 3708 <dom-module id="history-synced-device-card" assetpath="chrome://history/">
3709 <template> 3709 <template>
3710 <style include="shared-style"> 3710 <style include="shared-style">
3711 :host { 3711 :host {
3712 @apply(--card-sizing); 3712 @apply(--card-sizing);
3713 display: block; 3713 display: block;
3714 padding-bottom: var(--card-padding-between); 3714 padding-bottom: var(--card-padding-between);
3715 } 3715 }
3716 3716
3717 #card-heading { 3717 #card-heading {
3718 @apply(--layout-justified);
3719 cursor: pointer; 3718 cursor: pointer;
3719 justify-content: space-between;
3720 } 3720 }
3721 3721
3722 #tab-item-list { 3722 #tab-item-list {
3723 padding: 8px 0; 3723 padding: 8px 0;
3724 } 3724 }
3725 3725
3726 #last-update-time { 3726 #last-update-time {
3727 color: var(--secondary-text-color); 3727 color: var(--secondary-text-color);
3728 } 3728 }
3729 3729
3730 #right-buttons { 3730 #right-buttons {
3731 -webkit-margin-end: 4px; 3731 -webkit-margin-end: 4px;
3732 } 3732 }
3733 3733
3734 #menu-button { 3734 #menu-button {
3735 -webkit-margin-end: 8px; 3735 -webkit-margin-end: 8px;
3736 } 3736 }
3737 3737
3738 #collapse { 3738 #collapse {
3739 overflow: hidden; 3739 overflow: hidden;
3740 } 3740 }
3741 3741
3742 #history-item-container { 3742 #history-item-container {
3743 @apply(--card-box-shadow); 3743 @apply(--card-box-shadow);
3744 background: #fff; 3744 background: #fff;
3745 border-radius: 2px; 3745 border-radius: 2px;
3746 } 3746 }
3747 3747
3748 #item-container { 3748 #item-container {
3749 @apply(--layout-center); 3749 align-items: center;
3750 @apply(--layout-horizontal); 3750 display: flex;
3751 margin: 0 20px; 3751 margin: 0 20px;
3752 min-height: var(--item-height); 3752 min-height: var(--item-height);
3753 } 3753 }
3754 3754
3755 #window-separator { 3755 #window-separator {
3756 background-color: var(--card-border-color); 3756 background-color: var(--card-border-color);
3757 height: 1px; 3757 height: 1px;
3758 margin: 5px auto; 3758 margin: 5px auto;
3759 width: 80%; 3759 width: 80%;
3760 } 3760 }
(...skipping 295 matching lines...) Expand 10 before | Expand all | Expand 10 after
4056 <history-side-bar id="drawer-side-bar" selected-page="[[selectedPage_]]" route="[[route_]]" show-footer="[[showSidebarFooter]]" drawer=""> 4056 <history-side-bar id="drawer-side-bar" selected-page="[[selectedPage_]]" route="[[route_]]" show-footer="[[showSidebarFooter]]" drawer="">
4057 </history-side-bar> 4057 </history-side-bar>
4058 </app-drawer> 4058 </app-drawer>
4059 </template> 4059 </template>
4060 4060
4061 <iron-media-query query="(max-width: 1023px)" query-matches="{{hasDrawer_}}" > 4061 <iron-media-query query="(max-width: 1023px)" query-matches="{{hasDrawer_}}" >
4062 </iron-media-query> 4062 </iron-media-query>
4063 </template> 4063 </template>
4064 </dom-module> 4064 </dom-module>
4065 <script src="app.crisper.js"></script></body></html> 4065 <script src="app.crisper.js"></script></body></html>
OLDNEW
« no previous file with comments | « no previous file | chrome/browser/resources/md_history/history_item.html » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698