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

Issues Search
    My Issues | Starred     Open | Closed | All

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

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

Powered by Google App Engine
This is Rietveld 408576698