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