browser/themes/windows/downloads/downloads.css@6474c204b198
browser/themes/windows/downloads/downloads.css
Wed, 31 Dec 2014 06:09:35 +0100
- author
- Michael Schloh von Bennewitz <michael@schloh.com>
- date
- Wed, 31 Dec 2014 06:09:35 +0100
- changeset 0
- 6474c204b198
- permissions
- -rw-r--r--
Cloned upstream origin tor-browser at tor-browser-31.3.0esr-4.5-1-build1
revision ID fc1c9ff7c1b2defdbc039f12214767608f46423f for hacking purpose.
1 /* This Source Code Form is subject to the terms of the Mozilla Public
2 * License, v. 2.0. If a copy of the MPL was not distributed with this file,
3 * You can obtain one at http://mozilla.org/MPL/2.0/. */
5 /*** Panel and outer controls ***/
7 #downloadsPanel > .panel-arrowcontainer > .panel-arrowcontent {
8 padding: 0;
9 }
11 #downloadsListBox {
12 background-color: transparent;
13 padding: 4px;
14 color: inherit;
15 }
17 #downloadsPanel:not([hasdownloads]) > #downloadsListBox {
18 display: none;
19 }
21 #downloadsPanel[hasdownloads] > #emptyDownloads {
22 display: none;
23 }
25 #emptyDownloads {
26 padding: 10px 20px;
27 max-width: 40ch;
28 }
30 #downloadsHistory {
31 background: transparent;
32 cursor: pointer;
33 }
35 %ifdef WINDOWS_AERO
36 @media (-moz-os-version: windows-vista),
37 (-moz-os-version: windows-win7) {
38 %endif
39 #downloadsHistory {
40 color: -moz-nativehyperlinktext;
41 }
42 %ifdef WINDOWS_AERO
43 }
44 %endif
46 #downloadsPanel[keyfocus] > #downloadsFooter > #downloadsHistory:focus {
47 outline: 1px -moz-dialogtext dotted;
48 outline-offset: -1px;
49 }
51 #downloadsHistory > .button-box {
52 border: none;
53 margin: 1em;
54 }
56 #downloadsFooter {
57 background-color: hsla(210,4%,10%,.04);
58 box-shadow: 0 1px 0 hsla(210,4%,10%,.08) inset;
59 transition-duration: 150ms;
60 transition-property: background-color;
61 }
63 #downloadsFooter:hover {
64 background-color: hsla(210,4%,10%,.05);
65 }
67 #downloadsFooter:hover:active {
68 background-color: hsla(210,4%,10%,.1);
69 box-shadow: 0 2px 0 0 hsla(210,4%,10%,.1) inset;
70 }
72 %ifdef WINDOWS_AERO
73 @media (-moz-os-version: windows-vista),
74 (-moz-os-version: windows-win7) {
75 %endif
76 @media (-moz-windows-default-theme) {
77 #downloadsFooter {
78 border-bottom-left-radius: 3px;
79 border-bottom-right-radius: 3px;
80 transition-duration: 0s;
81 }
83 #downloadsFooter,
84 #downloadsFooter:hover,
85 #downloadsFooter:hover:active {
86 %ifdef WINDOWS_AERO
87 background-color: #f1f5fb;
88 %else
89 background-color: hsla(216,45%,88%,.98);
90 %endif
91 box-shadow: 0px 1px 2px rgb(204,214,234) inset;
92 }
93 }
94 %ifdef WINDOWS_AERO
95 }
96 %endif
98 /*** Downloads Summary and List items ***/
100 #downloadsSummary,
101 richlistitem[type="download"] {
102 height: 7em;
103 -moz-padding-end: 0;
104 color: inherit;
105 }
107 #downloadsSummary {
108 padding: 8px 38px 8px 12px;
109 cursor: pointer;
110 -moz-user-focus: normal;
111 }
113 #downloadsPanel[keyfocus] > #downloadsFooter > #downloadsSummary:focus {
114 outline: 1px -moz-dialogtext dotted;
115 outline-offset: -5px;
116 }
118 #downloadsSummary > .downloadTypeIcon {
119 list-style-image: url("chrome://browser/skin/downloads/download-summary.png");
120 }
122 #downloadsSummaryDescription {
123 color: -moz-nativehyperlinktext;
124 }
126 richlistitem[type="download"] {
127 margin: 0;
128 border-top: 1px solid hsla(0,0%,100%,.3);
129 border-bottom: 1px solid hsla(220,18%,51%,.25);
130 background: transparent;
131 padding: 8px;
132 }
134 richlistitem[type="download"]:first-child {
135 border-top: 1px solid transparent;
136 }
138 @media (-moz-windows-default-theme) {
139 richlistitem[type="download"]:last-child {
140 border-bottom: 1px solid transparent;
141 }
142 }
144 #downloadsPanel[keyfocus] > #downloadsListBox:focus > richlistitem[type="download"][selected] {
145 outline: 1px -moz-dialogtext dotted;
146 outline-offset: -1px;
147 }
149 .downloadTypeIcon {
150 -moz-margin-end: 8px;
151 /* Prevent flickering when changing states. */
152 height: 32px;
153 width: 32px;
154 }
156 .blockedIcon {
157 list-style-image: url("chrome://global/skin/icons/Error.png");
158 }
160 /* We hold .downloadTarget, .downloadProgress and .downloadDetails inside of
161 a vbox with class .downloadContainer. We set the font-size of the entire
162 container to 90% because:
164 1) This is the size that we want .downloadDetails to be
165 2) The container's width is set by localizers by &downloadDetails.width;,
166 which is a ch unit. Since this is the value that should control the
167 panel width, we apply it to the outer container to constrain
168 .downloadTarget and .downloadProgress.
170 Finally, since we want .downloadTarget's font-size to be at 100% of the
171 font-size of .downloadContainer's parent, we use calc to go from the
172 smaller font-size back to the original font-size.
173 */
174 #downloadsSummaryDetails,
175 .downloadContainer {
176 font-size: 90%;
177 }
179 #downloadsSummaryDescription,
180 .downloadTarget {
181 margin-bottom: 6px;
182 cursor: inherit;
183 }
185 .downloadTarget {
186 font-size: calc(100%/0.9);
187 }
189 #downloadsSummaryDetails,
190 .downloadDetails {
191 opacity: 0.6;
192 cursor: inherit;
193 }
195 .downloadButton {
196 -moz-appearance: none;
197 min-width: 0;
198 min-height: 0;
199 margin: 3px;
200 border: none;
201 background: transparent;
202 padding: 5px;
203 list-style-image: url("chrome://browser/skin/downloads/buttons.png");
204 }
206 .downloadButton > .button-box {
207 border: 1px solid transparent;
208 padding: 0;
209 }
211 #downloadsPanel[keyfocus] .downloadButton:focus > .button-box {
212 border: 1px dotted ThreeDDarkShadow;
213 }
215 /*** Highlighted list items ***/
217 #downloadsPanel:not([keyfocus]) > #downloadsListBox > richlistitem[type="download"][state="1"][exists]:hover {
218 background-color: hsla(210,4%,10%,.08);
219 outline: 1px solid hsla(210,4%,10%,.1);
220 outline-offset: -1px;
221 cursor: pointer;
222 }
224 #downloadsPanel:not([keyfocus]) > #downloadsListBox > richlistitem[type="download"][state="1"][exists]:hover:active {
225 background-color: hsla(210,4%,10%,.15);
226 outline: 1px solid hsla(210,4%,10%,.15);
227 box-shadow: 0 1px 0 0 hsla(210,4%,10%,.05) inset;
228 }
230 %ifdef WINDOWS_AERO
231 @media (-moz-os-version: windows-vista),
232 (-moz-os-version: windows-win7) {
233 %endif
234 #downloadsPanel:not([keyfocus]) > #downloadsListBox > richlistitem[type="download"][state="1"][exists]:hover {
235 border-radius: 3px;
236 outline: 0;
237 border-top: 1px solid hsla(0,0%,100%,.2);
238 border-bottom: 1px solid hsla(0,0%,0%,.2);
239 background-color: Highlight;
240 color: HighlightText;
241 }
243 #downloadsPanel:not([keyfocus]) > #downloadsListBox > richlistitem[type="download"][state="1"][exists]:hover:active {
244 background-color: Highlight;
245 outline: 0;
246 box-shadow: none;
247 }
248 %ifdef WINDOWS_AERO
249 }
250 %endif
252 /*** Button icons ***/
254 .downloadButton.downloadCancel {
255 -moz-image-region: rect(0px, 16px, 16px, 0px);
256 }
257 richlistitem[type="download"]:hover > stack > .downloadButton.downloadCancel {
258 -moz-image-region: rect(0px, 32px, 16px, 16px);
259 }
260 richlistitem[type="download"]:hover > stack > .downloadButton.downloadCancel:hover {
261 -moz-image-region: rect(0px, 48px, 16px, 32px);
262 }
263 richlistitem[type="download"]:hover > stack > .downloadButton.downloadCancel:active {
264 -moz-image-region: rect(0px, 64px, 16px, 48px);
265 }
267 .downloadButton.downloadShow {
268 -moz-image-region: rect(16px, 16px, 32px, 0px);
269 }
270 richlistitem[type="download"]:hover > stack > .downloadButton.downloadShow {
271 -moz-image-region: rect(16px, 32px, 32px, 16px);
272 }
273 richlistitem[type="download"]:hover > stack > .downloadButton.downloadShow:hover {
274 -moz-image-region: rect(16px, 48px, 32px, 32px);
275 }
276 richlistitem[type="download"]:hover > stack > .downloadButton.downloadShow:active {
277 -moz-image-region: rect(16px, 64px, 32px, 48px);
278 }
279 %ifndef WINDOWS_AERO
280 #downloadsPanel[keyfocus] > #downloadsListBox > richlistitem[type="download"][state="1"]:hover > stack > .downloadButton.downloadShow {
281 -moz-image-region: rect(16px, 32px, 32px, 16px);
282 }
283 #downloadsPanel[keyfocus] > #downloadsListBox > richlistitem[type="download"][state="1"]:hover > stack > .downloadButton.downloadShow:hover {
284 -moz-image-region: rect(16px, 48px, 32px, 32px);
285 }
286 #downloadsPanel[keyfocus] > #downloadsListBox > richlistitem[type="download"][state="1"]:hover > stack > .downloadButton.downloadShow:active {
287 -moz-image-region: rect(16px, 64px, 32px, 48px);
288 }
289 #downloadsPanel:not([keyfocus]) > #downloadsListBox > richlistitem[type="download"][state="1"]:hover > stack > .downloadButton.downloadShow {
290 -moz-image-region: rect(16px, 96px, 32px, 80px);
291 }
292 #downloadsPanel:not([keyfocus]) > #downloadsListBox > richlistitem[type="download"][state="1"]:hover > stack > .downloadButton.downloadShow:hover {
293 -moz-image-region: rect(16px, 112px, 32px, 96px);
294 }
295 #downloadsPanel:not([keyfocus]) > #downloadsListBox > richlistitem[type="download"][state="1"]:hover > stack > .downloadButton.downloadShow:active {
296 -moz-image-region: rect(16px, 128px, 32px, 112px);
297 }
298 %endif
300 .downloadButton.downloadRetry {
301 -moz-image-region: rect(32px, 16px, 48px, 0px);
302 }
303 richlistitem[type="download"]:hover > stack > .downloadButton.downloadRetry {
304 -moz-image-region: rect(32px, 32px, 48px, 16px);
305 }
306 richlistitem[type="download"]:hover > stack > .downloadButton.downloadRetry:hover {
307 -moz-image-region: rect(32px, 48px, 48px, 32px);
308 }
309 richlistitem[type="download"]:hover > stack > .downloadButton.downloadRetry:active {
310 -moz-image-region: rect(32px, 64px, 48px, 48px);
311 }
