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

Issues Search
    My Issues | Starred     Open | Closed | All

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

Issue 8511055: Remove old history UI, and replace with history2. (Closed) Base URL: http://git.chromium.org/chromium/src.git@master
Patch Set: Suppress bidichecker test failure. Created 9 years, 1 month 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 | « chrome/browser/browser_resources.grd ('k') | chrome/browser/resources/history.js » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <!DOCTYPE HTML> 1 <!DOCTYPE HTML>
2 <html i18n-values="dir:textdirection;"> 2 <html i18n-values="dir:textdirection;">
3 <head> 3 <head>
4 <meta charset="utf-8"> 4 <meta charset="utf-8">
5 <title i18n-content="title"></title> 5 <title i18n-content="title"></title>
6 <link rel="icon" href="../../app/theme/history_favicon.png"> 6 <link rel="icon" href="../../app/theme/history_favicon.png">
7
8 <link rel="stylesheet" href="chrome://resources/css/menu.css">
9
10 <script src="chrome://resources/js/event_tracker.js"></script>
11 <script src="chrome://resources/js/cr.js"></script>
12 <script src="chrome://resources/js/cr/ui.js"></script>
13 <script src="chrome://resources/js/cr/ui/command.js"></script>
14 <script src="chrome://resources/js/cr/ui/menu_item.js"></script>
15 <script src="chrome://resources/js/cr/ui/menu.js"></script>
16 <script src="chrome://resources/js/cr/ui/position_util.js"></script>
17 <script src="chrome://resources/js/cr/ui/menu_button.js"></script>
18
7 <script src="chrome://resources/js/local_strings.js"></script> 19 <script src="chrome://resources/js/local_strings.js"></script>
8 <script src="chrome://resources/js/util.js"></script> 20
9 <script src="chrome://history/history.js"></script> 21 <script src="chrome://history/history.js"></script>
10 <script src="chrome://history/strings.js"></script> 22 <script src="chrome://history/strings.js"></script>
23
11 <link rel="stylesheet" href="old_webui.css"> 24 <link rel="stylesheet" href="old_webui.css">
25
12 <style> 26 <style>
13 #results-separator { 27 #results-separator {
14 margin-top:12px; 28 margin-top:12px;
15 border-top:1px solid #9cc2ef; 29 border-top:1px solid #9cc2ef;
16 background-color:#ebeff9; 30 background-color:#ebeff9;
17 font-weight:bold; 31 font-weight:bold;
18 padding:3px; 32 padding:3px;
19 margin-bottom:-8px; 33 margin-bottom:-8px;
20 } 34 }
35
21 #results-separator table { 36 #results-separator table {
22 width: 100%; 37 width: 100%;
23 } 38 }
39
24 #results-summary { 40 #results-summary {
25 overflow: hidden; 41 overflow: hidden;
26 white-space: nowrap; 42 white-space: nowrap;
27 text-overflow: ellipsis; 43 text-overflow: ellipsis;
28 width: 50%; 44 width: 50%;
29 } 45 }
30 #edit-button { 46
31 text-align: end; 47 #editing-controls button {
32 overflow: hidden; 48 margin: 18px 0 -8px 0;
33 white-space: nowrap;
34 text-overflow: ellipsis;
35 width: 50%;
36 } 49 }
37 #editing-controls button { 50
38 margin-top: 18px; 51 #results-display {
39 margin-bottom: -8px; 52 max-width: 740px;
53 margin: 16px 0 0 0;
40 } 54 }
41 #results-display { 55
42 max-width:740px; 56 .day {
57 color: #6a6a6a;
58 font-weight: bold;
59 margin: 0 0 4px 0;
60 text-transform: uppercase;
61 font-size: 13px;
43 } 62 }
44 .day { 63
45 margin-top:18px;
46 padding:0px 3px;
47 display:inline-block;
48 }
49 .edit-button { 64 .edit-button {
50 display: inline; 65 display: inline;
51 -webkit-appearance: none; 66 -webkit-appearance: none;
52 background: none; 67 background: none;
53 border: 0; 68 border: 0;
54 color: blue; /* -webkit-link makes it purple :'( */ 69 color: blue; /* -webkit-link makes it purple :'( */
55 cursor: pointer; 70 cursor: pointer;
56 text-decoration: underline; 71 text-decoration: underline;
57 padding:0px 9px; 72 padding:0px 9px;
58 display:inline-block; 73 display:inline-block;
59 font:inherit; 74 font:inherit;
60 } 75 }
76
77 .gap,
78 .entry,
79 .no-entries {
80 margin: 0;
81 padding: 0;
82 list-style: none;
83 }
61 .gap { 84 .gap {
62 margin-left:18px; 85 width: 35px;
63 width:15px; 86 -webkit-border-end: 1px solid #ddd;
64 border-right:1px solid #ddd; 87 height: 14px;
65 height:14px;
66 } 88 }
89
67 .entry { 90 .entry {
68 margin-left:18px; 91 overflow: auto; /* Make sure it's at least as large as its children. */
69 margin-top:6px;
70 overflow:auto;
71 } 92 }
72 table.results { 93
73 margin-left:4px; 94 .entry-box {
95 cursor: default;
96 line-height: 1.6em;
97
98 display: -webkit-box;
99 -webkit-box-orient: horizontal;
100 max-width: 100%; /* Don't allow it to be bigger than its parent... */
101 float: left; /* ..but make the box shrink to fit its content. */
102 overflow: hidden;
74 } 103 }
104
105 html[dir=rtl] .entry-box {
106 float: right; /* To make the box shrink to fit its content. */
107 }
108
109 .search-results, .day-results {
110 margin: 0 0 24px 0;
111 padding: 0;
112 }
113
114 .snippet {
115 font-size: 12px;
116 line-height: 1.6em;
117 margin-bottom: 12px;
118 -webkit-margin-start: 90px; /* Align it with .domain. */
119 clear: both;
120 }
121
122 .entry .domain {
123 color: #282;
124 -webkit-padding-start: 20px;
125 -webkit-padding-end: 8px;
126 background-repeat: no-repeat;
127 background-position-y: center;
128 }
129
130 .drop-down {
131 background: #fff -webkit-canvas(drop-down-arrow) no-repeat center center;
132 border: 1px solid hsl(214, 91%, 85%);
133 border-radius: 2px;
134 width: 13px;
135 height: 13px;
136 -webkit-margin-start: 8px;
137 -webkit-margin-end: 4px;
138 position: relative;
139 top: 2px;
140 }
141
142 .drop-down:hover {
143 border-color: #6A86DE;
144 background-image: -webkit-canvas(drop-down-arrow-hover);
145 }
146
147 .drop-down[menu-shown], .drop-down:focus {
148 border-color: #6A86DE;
149 background-color: #6A86DE;
150 background-image: -webkit-canvas(drop-down-arrow-active);
151 }
152
153 html[dir='rtl'] .entry .domain {
154 background-position-x: right;
155 }
156
75 .entry .time { 157 .entry .time {
76 color:#888; 158 color:#9a9a9a;
77 float:left; 159 width: 90px;
78 min-width:56px;
79 -webkit-margin-end:5px;
80 padding-top:1px;
81 white-space:nowrap;
82 } 160 }
83 html[dir='rtl'] .time { 161
84 float:right; 162 .entry input[type=checkbox] {
163 position: relative;
164 top: 1px;
165 }
166
167 /* Checkboxes are shown when checked or focused, or when the entry is hovered.
168 Fade in on focus, but not on hover, because it makes the UI feel laggy. */
169 .entry input[type=checkbox]:not(:checked) {
170 opacity: 0;
171 -webkit-transition: opacity 150ms;
172 }
173
174 .entry-box:hover input[type=checkbox],
175 .entry-box input[type=checkbox]:focus {
176 opacity: 1;
177 }
178
179 .entry-box input[type=checkbox]:focus {
180 -webkit-transition: opacity 150ms;
181 }
182
183 .entry-box {
184 background-color: none;
185 -webkit-transition: background-color 150ms;
186 }
187
188 .entry-box:hover, .entry-box.contains-focus {
189 background-color: #e4ecf7;
190 border-radius: 2px;
85 } 191 }
86 .entry .title { 192 .entry .title {
87 max-width:600px; 193 -webkit-box-flex: 1;
88 overflow: hidden; 194 overflow: hidden;
89 white-space: nowrap; 195 white-space: nowrap;
90 text-overflow: ellipsis; 196 text-overflow: ellipsis;
91 } 197 }
92 .results .time, .results .title { 198
93 margin-top:18px; 199 .entry .title > .starred {
94 }
95 .title > .starred {
96 background:url('shared/images/star_small.png'); 200 background:url('shared/images/star_small.png');
97 background-repeat:no-repeat; 201 background-repeat:no-repeat;
98 display:inline-block; 202 display:inline-block;
99 -webkit-margin-start:12px; 203 -webkit-margin-start: 4px;
100 -webkit-margin-end:0;
101 width:11px; 204 width:11px;
102 height:11px; 205 height:11px;
103 } 206 }
207
104 .entry .title > a { 208 .entry .title > a {
105 box-sizing: border-box; 209 color: #11c;
106 background-repeat:no-repeat; 210 text-decoration: none;
107 background-size:16px;
108 background-position:0px 1px;
109 padding:1px 0px 4px 22px;
110 display:inline-block;
111 overflow:hidden;
112 text-overflow:ellipsis;
113 } 211 }
114 html[dir='rtl'] .entry .title > a { 212
115 background-position-x:right; 213 .entry .title > a.to-be-removed {
116 padding-left:0px; 214 text-decoration: line-through;
117 padding-right:22px;
118 } 215 }
119 #results-pagination { 216
120 padding-top:24px; 217 .entry .title > a:hover {
121 -webkit-margin-start:18px; 218 text-decoration: underline;
219 }
220
221 /* Since all history links are visited, we can make them blue. */
222 .entry .title > a:visted {
223 color: #11c;
224 }
225
226 .fade-out {
227 opacity: 0;
228 -webkit-transition: opacity 200ms;
122 } 229 }
123 </style> 230 </style>
124 </head> 231 </head>
125 <body i18n-values=".style.fontFamily:fontfamily;.style.fontSize:fontsize"> 232 <body i18n-values=".style.fontFamily:fontfamily;.style.fontSize:fontsize">
126 <div class="header"> 233 <div class="header">
127 <a id="history-section" href=""> 234 <a id="history-section" href="">
128 <img src="shared/images/history_section.png" 235 <img src="shared/images/history_section.png"
129 width="67" height="67" class="logo" border="0"></a> 236 width="67" height="67" class="logo" border="0"></a>
130 <form id="search-form" method="post" action="" 237 <form id="search-form" method="post" action="" class="form">
131 class="form">
132 <input type="text" name="term" id="term"> 238 <input type="text" name="term" id="term">
133 <input type="submit" name="submit" i18n-values="value:searchbutton"> 239 <input type="submit" name="submit" i18n-values="value:searchbutton">
134 </form> 240 </form>
135 </div> 241 </div>
136 <div class="main"> 242 <div class="main">
137 <div id="results-separator"> 243 <div id="results-separator">
138 <table border="0" cellPadding="0" cellSpacing="0"> 244 <table border="0" cellPadding="0" cellSpacing="0">
139 <tr><td id="results-summary"></td><td id="edit-button"><p></p></td></tr> 245 <tr><td id="results-summary"></td><td id="edit-button"><p></p></td></tr>
140 </table> 246 </table>
141 </div> 247 </div>
142 <div id="editing-controls"></div> 248 <div id="editing-controls">
249 <button id="clear-browsing-data" i18n-content="clearallhistory"></button>
250 <button id="remove-selected"
251 disabled="disabled"
252 i18n-content="removeselected"></button>
253 </div>
143 <div id="results-display"></div> 254 <div id="results-display"></div>
144 <div id="results-pagination"></div> 255 <div id="results-pagination"></div>
145 </div> 256 </div>
257
258 <menu id="action-menu">
259 <button id="more-from-site" i18n-content="moreFromSite"></button>
260 <button id="remove-page" i18n-content="removeFromHistory"></button>
261 </menu>
262
146 <script src="chrome://resources/js/i18n_template.js"></script> 263 <script src="chrome://resources/js/i18n_template.js"></script>
147 <script src="chrome://resources/js/i18n_process.js"></script> 264 <script src="chrome://resources/js/i18n_process.js"></script>
148 </body> 265 </body>
149 </html> 266 </html>
OLDNEW
« no previous file with comments | « chrome/browser/browser_resources.grd ('k') | chrome/browser/resources/history.js » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698