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

Side by Side Diff: chrome/browser/resources/md_history/history.html

Issue 1932413003: [MD History] Refactor history.html into a history-app element. (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: address nit Created 4 years, 7 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
OLDNEW
1 <!doctype html> 1 <!doctype html>
2 <html dir="$i18n{textdirection}" lang="$i18n{language}"> 2 <html dir="$i18n{textdirection}" lang="$i18n{language}">
3 <head> 3 <head>
4 <meta charset="utf8"> 4 <meta charset="utf8">
5 <title>$i18n{title}</title> 5 <title>$i18n{title}</title>
6 6
7 <link rel="stylesheet" href="chrome://resources/css/text_defaults_md.css"> 7 <link rel="stylesheet" href="chrome://resources/css/text_defaults_md.css">
8 <link rel="stylesheet" href="chrome://resources/css/md_colors.css"> 8 <link rel="stylesheet" href="chrome://resources/css/md_colors.css">
9 9
10 <style> 10 <style>
11 html, 11 html,
12 body { 12 body {
13 height: 100%; 13 height: 100%;
14 margin: 0; 14 margin: 0;
15 } 15 }
16 16
17 body { 17 body {
18 background: var(--md-background-color); 18 background: var(--md-background-color);
19 display: flex; 19 display: flex;
20 flex-direction: column; 20 flex-direction: column;
21 min-width: 800px;
22 }
23
24 #toolbar {
25 flex: 0 0 56px;
26 }
27
28 #history-list,
29 #history-synced-device-manager {
30 flex: 1 0 0;
31 }
32
33 #main-container {
34 display: flex;
35 flex: 1 0 0;
36 overflow: hidden;
37 } 21 }
38 22
39 /* Minimal styling required to display app shim. */ 23 /* Minimal styling required to display app shim. */
40 .loading #main-container, 24 .loading history-app,
41 .loading history-toolbar,
42 .app-shim { 25 .app-shim {
43 display: none; 26 display: none;
44 } 27 }
45 28
29 history-app {
30 flex: 1;
31 }
32
46 .loading .app-shim { 33 .loading .app-shim {
47 display: flex; 34 display: flex;
48 font-size: 123%; 35 font-size: 123%;
49 } 36 }
50 37
51 .loading #loading-toolbar { 38 .loading #loading-toolbar {
52 -webkit-padding-start: 24px; 39 -webkit-padding-start: 24px;
53 align-items: center; 40 align-items: center;
54 color: #fff; 41 color: #fff;
55 flex-direction: row; 42 flex-direction: row;
56 font-weight: 400; 43 font-weight: 400;
57 height: 56px; 44 height: 56px;
58 } 45 }
59 46
60 history-toolbar,
61 .loading #loading-toolbar { 47 .loading #loading-toolbar {
62 background: var(--md-toolbar-color); 48 background: var(--md-toolbar-color);
63 } 49 }
64 50
65 .loading #loading-message { 51 .loading #loading-message {
66 align-items: center; 52 align-items: center;
67 color: #b4b4b4; 53 color: #b4b4b4;
68 flex: 1; 54 flex: 1;
69 font-weight: 500; 55 font-weight: 500;
70 justify-content: center; 56 justify-content: center;
71 } 57 }
72 </style> 58 </style>
73 </head> 59 </head>
74 60
75 <body class="loading"> 61 <body class="loading">
76 <history-toolbar class="paper-header" id="toolbar"></history-toolbar> 62 <history-app id="history-app"></history-app>
77
78 <div id="main-container">
79 <history-side-bar id="history-side-bar"></history-side-bar>
80 <history-list id="history-list"></history-list>
81 <history-synced-device-manager id="history-synced-device-manager" hidden>
82 </history-synced-device-manager>
83 </div>
84
85 <span class="app-shim" id="loading-toolbar">$i18n{title}</span> 63 <span class="app-shim" id="loading-toolbar">$i18n{title}</span>
86 <span class="app-shim" id="loading-message">$i18n{loading}</span> 64 <span class="app-shim" id="loading-message">$i18n{loading}</span>
87 65
88 <link rel="import" href="chrome://resources/html/cr.html"> 66 <link rel="import" href="chrome://resources/html/cr.html">
89 <link rel="import" href="chrome://resources/html/util.html"> 67 <link rel="import" href="chrome://resources/html/util.html">
90 <link rel="import" href="chrome://resources/html/load_time_data.html"> 68 <link rel="import" href="chrome://resources/html/load_time_data.html">
91 <link rel="import" href="chrome://history/constants.html"> 69 <link rel="import" href="chrome://history/constants.html">
92 <script src="strings.js"></script> 70 <script src="strings.js"></script>
93 <script src="history.js"></script> 71 <script src="history.js"></script>
94 72
95 <link rel="import" href="chrome://history/elements.html" async id="bundle"> 73 <link rel="import" href="chrome://history/app.html" async id="bundle">
96 </body> 74 </body>
97 75
98 </html> 76 </html>
OLDNEW
« no previous file with comments | « chrome/browser/resources/md_history/elements.html ('k') | chrome/browser/resources/md_history/history.js » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698