OLD | NEW |
1 /* Copyright (c) 2012 The Chromium Authors. All rights reserved. | 1 /* Copyright (c) 2012 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 #recently-closed-menu-button { | 5 #recently-closed-menu-button { |
6 -webkit-appearance: none; | 6 -webkit-appearance: none; |
7 -webkit-padding-end: 15px; | 7 -webkit-padding-end: 15px; |
8 -webkit-padding-start: 9px; | 8 -webkit-padding-start: 9px; |
9 -webkit-transition: opacity 200ms; | 9 -webkit-transition: opacity 200ms; |
10 -webkit-transition-delay: 100ms; | 10 -webkit-transition-delay: 100ms; |
11 background: none; | 11 background: none; |
12 border: 0; | 12 border: 0; |
13 color: #7F7F7F; | 13 color: #7F7F7F; |
14 cursor: pointer; | 14 cursor: pointer; |
15 display: block; | 15 display: block; |
16 margin: 0; | |
17 font-size: 9pt; | 16 font-size: 9pt; |
18 font-weight: bold; | 17 font-weight: bold; |
19 height: 100%; | 18 height: 100%; |
| 19 margin: 0; |
20 /* The padding increases the clickable area. */ | 20 /* The padding increases the clickable area. */ |
21 padding-bottom: 0; | 21 padding-bottom: 0; |
22 padding-top: 0; | 22 padding-top: 0; |
23 } | 23 } |
24 | 24 |
25 .enable-cws-experiment #recently-closed-menu-button { | 25 .enable-cws-experiment #recently-closed-menu-button { |
26 position: relative; | |
27 -webkit-margin-end: 0; | 26 -webkit-margin-end: 0; |
28 -webkit-padding-end: 16px; | 27 -webkit-padding-end: 16px; |
| 28 position: relative; |
29 } | 29 } |
30 | 30 |
31 #recently-closed-menu-button:hover:not([menu-shown]) { | 31 #recently-closed-menu-button:hover:not([menu-shown]) { |
32 color: #666; | 32 color: #666; |
33 } | 33 } |
34 | 34 |
35 #recently-closed-menu-button:hover:not([menu-shown]) .disclosure-triangle { | 35 #recently-closed-menu-button:hover:not([menu-shown]) .disclosure-triangle { |
36 background-color: #666; | 36 background-color: #666; |
37 } | 37 } |
38 | 38 |
39 #recently-closed-menu-button[menu-shown] { | 39 #recently-closed-menu-button[menu-shown] { |
40 color: #555; | 40 color: #555; |
41 } | 41 } |
42 | 42 |
43 #recently-closed-menu-button[menu-shown] .disclosure-triangle { | 43 #recently-closed-menu-button[menu-shown] .disclosure-triangle { |
44 background-color: #555; | 44 background-color: #555; |
45 } | 45 } |
46 | 46 |
47 /* Reserve space for the menu button even when it's hidden. */ | 47 /* Reserve space for the menu button even when it's hidden. */ |
48 #recently-closed-menu-button.invisible, | 48 #recently-closed-menu-button.invisible, |
49 #footer.showing-trash-mode #recently-closed-menu-button { | 49 #footer.showing-trash-mode #recently-closed-menu-button { |
50 visibility: hidden; | 50 visibility: hidden; |
51 } | 51 } |
52 | 52 |
53 #footer.showing-trash-mode #recently-closed-menu-button { | 53 #footer.showing-trash-mode #recently-closed-menu-button { |
| 54 -webkit-transition-delay: 0; |
54 opacity: 0; | 55 opacity: 0; |
55 -webkit-transition-delay: 0; | |
56 } | 56 } |
57 | 57 |
58 #recently-closed-menu-button > * { | 58 #recently-closed-menu-button > * { |
59 vertical-align: middle; | 59 vertical-align: middle; |
60 } | 60 } |
61 | 61 |
62 .recent-menu { | 62 .recent-menu { |
63 padding: 6px 8px; | 63 padding: 6px 8px; |
64 /* Needs to be above #footer. */ | 64 /* Needs to be above #footer. */ |
65 z-index: 10; | 65 z-index: 10; |
66 } | 66 } |
67 | 67 |
68 .recent-menu-item { | 68 .recent-menu-item { |
| 69 -webkit-margin-end: 8px; |
| 70 -webkit-margin-start: 0; |
| 71 -webkit-padding-end: 0; |
| 72 -webkit-padding-start: 22px; |
69 background: no-repeat 0 50%; | 73 background: no-repeat 0 50%; |
70 background-color: transparent !important; | 74 background-color: transparent !important; |
71 background-size: 16px 16px; | 75 background-size: 16px 16px; |
72 box-sizing: border-box; | 76 box-sizing: border-box; |
73 display: block; | 77 display: block; |
74 font-size: 100%; | 78 font-size: 100%; |
75 line-height: 20px; | 79 line-height: 20px; |
76 margin: 8px; | 80 margin-bottom: 8px; |
| 81 margin-top: 8px; |
77 max-width: 450px; | 82 max-width: 450px; |
78 overflow: hidden; | 83 overflow: hidden; |
79 text-overflow: ellipsis; | 84 text-overflow: ellipsis; |
80 white-space: nowrap; | 85 white-space: nowrap; |
81 -webkit-margin-start: 0; | |
82 -webkit-padding-end: 0; | |
83 -webkit-padding-start: 22px; | |
84 } | 86 } |
85 | 87 |
86 .recent-menu-item:not(:hover) { | 88 .recent-menu-item:not(:hover) { |
87 text-decoration: none; | 89 text-decoration: none; |
88 } | 90 } |
89 | 91 |
90 .recent-menu-item:first-of-type { | 92 .recent-menu-item:first-of-type { |
91 margin-top: 4px; | 93 margin-top: 4px; |
92 } | 94 } |
93 | 95 |
(...skipping 10 matching lines...) Expand all Loading... |
104 } | 106 } |
105 | 107 |
106 /* TODO(estade): find a better color for active. */ | 108 /* TODO(estade): find a better color for active. */ |
107 .recent-menu-item:active, | 109 .recent-menu-item:active, |
108 .recent-menu-item:visited, | 110 .recent-menu-item:visited, |
109 .recent-menu-item:link { | 111 .recent-menu-item:link { |
110 color: hsl(213, 90%, 24%) !important; | 112 color: hsl(213, 90%, 24%) !important; |
111 } | 113 } |
112 | 114 |
113 .disclosure-triangle { | 115 .disclosure-triangle { |
| 116 -webkit-margin-start: 2px; |
| 117 -webkit-mask-image: url('images/disclosure_triangle_mask.png'); |
114 background-color: #7F7F7F; | 118 background-color: #7F7F7F; |
115 display: inline-block; | 119 display: inline-block; |
116 height: 9px; | 120 height: 9px; |
117 width: 9px; | 121 width: 9px; |
118 -webkit-margin-start: 2px; | |
119 -webkit-mask-image: url('images/disclosure_triangle_mask.png'); | |
120 } | 122 } |
121 | 123 |
122 #vertical-separator { | 124 #vertical-separator { |
123 background-color: #B2B2B2; | 125 background-color: #B2B2B2; |
124 display: none; | 126 display: none; |
125 height: 20px; | 127 height: 20px; |
126 left: 15px; | 128 left: 15px; |
127 position: relative; | 129 position: relative; |
128 right: 15px; | 130 right: 15px; |
129 width: 1px; | 131 width: 1px; |
130 } | 132 } |
131 | 133 |
132 .enable-cws-experiment #vertical-separator { | 134 .enable-cws-experiment #vertical-separator { |
133 display: inline-block; | 135 display: inline-block; |
134 } | 136 } |
OLD | NEW |