Index: chrome/browser/resources/ntp4/new_tab.css |
diff --git a/chrome/browser/resources/ntp4/new_tab.css b/chrome/browser/resources/ntp4/new_tab.css |
index f687775b0b87e0db84c3970d9fbd868530c3b021..aa8f23463e794b145904a8c1f3096053e237bd99 100644 |
--- a/chrome/browser/resources/ntp4/new_tab.css |
+++ b/chrome/browser/resources/ntp4/new_tab.css |
@@ -240,36 +240,90 @@ html[dir='rtl'] .login-status-icon { |
/* Trash. *********************************************************************/ |
#trash { |
+ -webkit-transition: top 200ms, opacity 0; |
+ -webkit-transition-delay: 0, 200ms; |
color: #7F7F7F; |
height: 100%; |
position: absolute; |
opacity: 0; |
right: 0; |
top: 50px; |
- -webkit-transition: top 200ms, opacity 0; |
- -webkit-transition-delay: 0, 200ms; |
+} |
+ |
+html[dir='rtl'] #trash { |
+ left: 0; |
+ right: auto; |
} |
#footer.showing-trash-mode #trash { |
- opacity: 1; |
- top: 0; |
-webkit-transition-delay: 0, 0; |
+ -webkit-transition-duration: 0, 200ms; |
+ opacity: 0.75; |
+ top: 0; |
+} |
+ |
+#footer.showing-trash-mode #trash.drag-target { |
+ opacity: 1; |
} |
#trash > span { |
- background-image: url('images/trash.png'); |
- background-position: 7px; |
- background-repeat: no-repeat; |
+ display: inline-block; |
+} |
+ |
+#trash > span:not([class]) { |
+ -webkit-padding-end: 7px; |
+ -webkit-padding-start: 30px; |
border: 1px dashed #7f7f7f; |
border-radius: 4px; |
- display: inline-block; |
font-size: 84%; |
padding-bottom: 9px; |
padding-top: 10px; |
position: relative; |
top: 7px; |
- -webkit-padding-end: 7px; |
- -webkit-padding-start: 30px; |
+} |
+ |
+#trash > .can, |
+#trash > .lid { |
+ background: url('images/trash.png') 0 0 no-repeat; |
+ position: absolute; |
+} |
+ |
+#trash > .lid { |
+ -webkit-transition: -webkit-transform 200ms; |
+ -webkit-transform-origin: -7% 100%; |
+ height: 6px; |
+ left: 10px; |
+ top: 18px; |
+ width: 14px; |
+} |
+ |
+html[dir='rtl'] #trash > .lid { |
+ -webkit-transform-origin: 107% 100%; |
+ left: auto; |
+ /* NOTE: Intentionally different than LTR value. */ |
+ right: 9px; |
+} |
+ |
+#trash > .can { |
+ background-position: -1px -4px; |
+ border-radius: 0 0 2px 2px; |
+ height: 12px; |
+ left: 11px; |
+ top: 22px; |
+ width: 11px; |
+} |
+ |
+html[dir='rtl'] #trash > .can { |
+ left: auto; |
+ right: 11px; |
+} |
+ |
+#footer.showing-trash-mode #trash.drag-target .lid { |
+ -webkit-transform: rotate(-45deg); |
+} |
+ |
+html[dir='rtl'] #footer.showing-trash-mode #trash.drag-target .lid { |
+ -webkit-transform: rotate(45deg); |
} |
/* Page switcher buttons. *****************************************************/ |