Index: chrome/browser/resources/md_downloads/manager.html |
diff --git a/chrome/browser/resources/md_downloads/manager.html b/chrome/browser/resources/md_downloads/manager.html |
index f3e44eba541954884ed8181c9685cc5de4a613cd..65d9ec17331963579c4c893710099fae3e015b97 100644 |
--- a/chrome/browser/resources/md_downloads/manager.html |
+++ b/chrome/browser/resources/md_downloads/manager.html |
@@ -13,6 +13,86 @@ |
<dom-module id="downloads-manager"> |
<template> |
+ <style> |
+ :host { |
+ display: flex; |
+ flex: 1 0; |
+ flex-direction: column; |
+ height: 100%; |
+ z-index: 0; |
+ } |
+ |
+ [hidden] { |
+ display: none !important; |
+ } |
+ |
+ @media screen and (max-width: 1024px) { |
+ :host { |
+ flex-basis: calc( |
+ var(--downloads-card-width) + 2 * var(--downloads-card-margin)); |
+ } |
+ } |
+ |
+ #toolbar { |
+ position: relative; |
+ z-index: 1; |
+ } |
+ |
+ #toolbar::after { |
+ box-shadow: inset 0 5px 6px -3px rgba(0, 0, 0, 0.4); |
+ content: ''; |
+ display: block; |
+ height: 6px; |
+ opacity: 0; |
+ position: absolute; |
+ top: 100%; |
+ transition: opacity 500ms; |
+ width: 100%; |
+ } |
+ |
+ :host([has-shadow_]) #toolbar::after { |
+ opacity: 1; |
+ } |
+ |
+ #downloads-list { |
+ /* TODO(dbeam): we're not setting scrollTarget explicitly, yet |
+ * style="overflow: auto" is still being set by <iron-list>'s JS. Weird. |
+ */ |
+ overflow-y: overlay !important; |
+ } |
+ |
+ #no-downloads, |
+ #downloads-list { |
+ flex: 1; |
+ } |
+ |
+ :host([loading]) #no-downloads, |
+ :host([loading]) #downloads-list { |
+ display: none; |
+ } |
+ |
+ #no-downloads { |
+ align-items: center; |
+ color: #b4b4b4; |
+ display: flex; |
+ font-size: 123.1%; |
+ font-weight: 500; |
+ justify-content: center; |
+ /* To avoid overlapping with the header, we need this min-height |
+ * until bug 596743 is fixed. */ |
+ min-height: min-content; |
+ } |
+ |
+ #no-downloads .illustration { |
+ background: -webkit-image-set( |
+ url(chrome://downloads/1x/no_downloads.png) 1x, |
+ url(chrome://downloads/2x/no_downloads.png) 2x) |
+ no-repeat center center; |
+ height: 144px; /* Matches natural image height. */ |
+ margin-bottom: 32px; |
+ } |
+ </style> |
+ |
<downloads-toolbar id="toolbar" spinner-active="{{spinnerActive_}}"> |
</downloads-toolbar> |
<iron-list id="downloads-list" items="{{items_}}" |
@@ -29,7 +109,5 @@ |
</div> |
</div> |
</template> |
- <link rel="import" type="css" href="chrome://downloads/shared_style.css"> |
- <link rel="import" type="css" href="chrome://downloads/manager.css"> |
<script src="chrome://downloads/manager.js"></script> |
</dom-module> |