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

Issues Search
    My Issues | Starred     Open | Closed | All

Unified Diff: chrome/browser/resources/md_history/history.html

Issue 2073703002: MD History: Simplify flex layout in <history-list> (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Review comments Created 4 years, 6 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 side-by-side diff with in-line comments
Download patch
« chrome/browser/resources/md_history/app.html ('K') | « chrome/browser/resources/md_history/grouped_list.html ('k') | chrome/browser/resources/md_history/history_item.html » ('j') | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
Index: chrome/browser/resources/md_history/history.html
diff --git a/chrome/browser/resources/md_history/history.html b/chrome/browser/resources/md_history/history.html
index 009049ab7fe815776d2511e4cbf1388d352e030d..f7b9dbaac223cf3819bcd2a7f035e8d19fe286e2 100644
--- a/chrome/browser/resources/md_history/history.html
+++ b/chrome/browser/resources/md_history/history.html
@@ -16,39 +16,42 @@
body {
background: var(--md-background-color);
- display: flex;
- flex-direction: column;
}
/* Minimal styling required to display app shim. */
- .loading history-app,
- .app-shim {
- display: none;
+ .loading history-app {
+ visibility: hidden;
}
- history-app {
- flex: 1;
+ #app-shim {
+ display: none;
}
- .loading .app-shim {
+ .loading #app-shim {
+ bottom: 0;
display: flex;
+ flex-direction: column;
font-size: 123%;
+ height: 100%;
+ left: 0;
+ position: absolute;
+ right: 0;
+ top: 0;
}
- .loading #loading-toolbar {
+ #app-shim span {
+ display: flex;
+ }
+
+ #loading-toolbar {
-webkit-padding-start: 24px;
align-items: center;
+ background: var(--md-toolbar-color);
color: #fff;
- flex-direction: row;
- font-weight: 400;
height: 56px;
}
- .loading #loading-toolbar {
- background: var(--md-toolbar-color);
- }
-
- .loading #loading-message {
+ #loading-message {
align-items: center;
color: #b4b4b4;
flex: 1;
@@ -60,8 +63,11 @@
<body class="loading">
<history-app id="history-app"></history-app>
- <span class="app-shim" id="loading-toolbar">$i18n{title}</span>
- <span class="app-shim" id="loading-message">$i18n{loading}</span>
+
+ <div id="app-shim">
+ <span id="loading-toolbar">$i18n{title}</span>
+ <span id="loading-message">$i18n{loading}</span>
+ </div>
<link rel="import" href="chrome://resources/html/cr.html">
<link rel="import" href="chrome://resources/html/util.html">
« chrome/browser/resources/md_history/app.html ('K') | « chrome/browser/resources/md_history/grouped_list.html ('k') | chrome/browser/resources/md_history/history_item.html » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698