| OLD | NEW |
| 1 /* Copyright (c) 2011 The Chromium Authors. All rights reserved. | 1 /* Copyright (c) 2011 The Chromium Authors. All rights reserved. |
| 2 * Use of this source code is governed by a BSD-style license that can be | 2 * Use of this source code is governed by a BSD-style license that can be |
| 3 * found in the LICENSE file. | 3 * found in the LICENSE file. |
| 4 */ | 4 */ |
| 5 | 5 |
| 6 html { | 6 html { |
| 7 font-family: segoe ui, arial, helvetica, sans-serif; | 7 font-family: segoe ui, arial, helvetica, sans-serif; |
| 8 font-size: 14px; | 8 font-size: 14px; |
| 9 /* It's necessary to put this here instead of in body in order to get the | 9 /* It's necessary to put this here instead of in body in order to get the |
| 10 background-size of 100% to work properly */ | 10 background-size of 100% to work properly */ |
| (...skipping 222 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 233 -webkit-box-flex: 1; | 233 -webkit-box-flex: 1; |
| 234 } | 234 } |
| 235 | 235 |
| 236 #login-status-dismiss { | 236 #login-status-dismiss { |
| 237 min-width: 6em; | 237 min-width: 6em; |
| 238 } | 238 } |
| 239 | 239 |
| 240 /* Trash. *********************************************************************/ | 240 /* Trash. *********************************************************************/ |
| 241 | 241 |
| 242 #trash { | 242 #trash { |
| 243 -webkit-transition: top 200ms, opacity 0; |
| 244 -webkit-transition-delay: 0, 200ms; |
| 243 color: #7F7F7F; | 245 color: #7F7F7F; |
| 244 height: 100%; | 246 height: 100%; |
| 245 position: absolute; | 247 position: absolute; |
| 246 opacity: 0; | 248 opacity: 0; |
| 247 right: 0; | 249 right: 0; |
| 248 top: 50px; | 250 top: 50px; |
| 249 -webkit-transition: top 200ms, opacity 0; | 251 } |
| 250 -webkit-transition-delay: 0, 200ms; | 252 |
| 253 html[dir='rtl'] #trash { |
| 254 left: 0; |
| 255 right: auto; |
| 251 } | 256 } |
| 252 | 257 |
| 253 #footer.showing-trash-mode #trash { | 258 #footer.showing-trash-mode #trash { |
| 259 -webkit-transition-delay: 0, 0; |
| 260 -webkit-transition-duration: 0, 200ms; |
| 261 opacity: 0.75; |
| 262 top: 0; |
| 263 } |
| 264 |
| 265 #footer.showing-trash-mode #trash.drag-target { |
| 254 opacity: 1; | 266 opacity: 1; |
| 255 top: 0; | |
| 256 -webkit-transition-delay: 0, 0; | |
| 257 } | 267 } |
| 258 | 268 |
| 259 #trash > span { | 269 #trash > span { |
| 260 background-image: url('images/trash.png'); | 270 display: inline-block; |
| 261 background-position: 7px; | 271 } |
| 262 background-repeat: no-repeat; | 272 |
| 273 #trash > span:not([class]) { |
| 274 -webkit-padding-end: 7px; |
| 275 -webkit-padding-start: 30px; |
| 263 border: 1px dashed #7f7f7f; | 276 border: 1px dashed #7f7f7f; |
| 264 border-radius: 4px; | 277 border-radius: 4px; |
| 265 display: inline-block; | |
| 266 font-size: 84%; | 278 font-size: 84%; |
| 267 padding-bottom: 9px; | 279 padding-bottom: 9px; |
| 268 padding-top: 10px; | 280 padding-top: 10px; |
| 269 position: relative; | 281 position: relative; |
| 270 top: 7px; | 282 top: 7px; |
| 271 -webkit-padding-end: 7px; | 283 } |
| 272 -webkit-padding-start: 30px; | 284 |
| 285 #trash > .can, |
| 286 #trash > .lid { |
| 287 background: url('images/trash.png') 0 0 no-repeat; |
| 288 position: absolute; |
| 289 } |
| 290 |
| 291 #trash > .lid { |
| 292 -webkit-transition: -webkit-transform 200ms; |
| 293 -webkit-transform-origin: -7% 100%; |
| 294 height: 6px; |
| 295 left: 10px; |
| 296 top: 18px; |
| 297 width: 14px; |
| 298 } |
| 299 |
| 300 html[dir='rtl'] #trash > .lid { |
| 301 -webkit-transform-origin: 107% 100%; |
| 302 left: auto; |
| 303 /* NOTE: Intentionally different than LTR value. */ |
| 304 right: 9px; |
| 305 } |
| 306 |
| 307 #trash > .can { |
| 308 background-position: -1px -4px; |
| 309 border-radius: 0 0 2px 2px; |
| 310 height: 12px; |
| 311 left: 11px; |
| 312 top: 22px; |
| 313 width: 11px; |
| 314 } |
| 315 |
| 316 html[dir='rtl'] #trash > .can { |
| 317 left: auto; |
| 318 right: 11px; |
| 319 } |
| 320 |
| 321 #footer.showing-trash-mode #trash.drag-target .lid { |
| 322 -webkit-transform: rotate(-45deg); |
| 323 } |
| 324 |
| 325 html[dir='rtl'] #footer.showing-trash-mode #trash.drag-target .lid { |
| 326 -webkit-transform: rotate(45deg); |
| 273 } | 327 } |
| 274 | 328 |
| 275 /* Page switcher buttons. *****************************************************/ | 329 /* Page switcher buttons. *****************************************************/ |
| 276 | 330 |
| 277 .page-switcher { | 331 .page-switcher { |
| 278 background-color: transparent; | 332 background-color: transparent; |
| 279 border: none; | 333 border: none; |
| 280 bottom: 0; | 334 bottom: 0; |
| 281 font-size: 40px; | 335 font-size: 40px; |
| 282 padding: 0; | 336 padding: 0; |
| 283 position: absolute; | 337 position: absolute; |
| 284 margin: 0; | 338 margin: 0; |
| 285 max-width: 150px; | 339 max-width: 150px; |
| 286 min-width: 90px; | 340 min-width: 90px; |
| 287 outline: none; | 341 outline: none; |
| 288 top: 0; | 342 top: 0; |
| 289 z-index: 5; | 343 z-index: 5; |
| 290 -webkit-transition: width 150ms, right 150ms, background-color 150ms; | 344 -webkit-transition: width 150ms, right 150ms, background-color 150ms; |
| 291 } | 345 } |
| OLD | NEW |