155 lines
3.7 KiB
CSS
155 lines
3.7 KiB
CSS
|
/* This Source Code Form is subject to the terms of the Mozilla Public
|
||
|
* License, v. 2.0. If a copy of the MPL was not distributed with this
|
||
|
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
|
||
|
|
||
|
%filter substitution
|
||
|
|
||
|
%define keyfocus #downloadsPanel[keyfocus]
|
||
|
%define notKeyfocus #downloadsPanel:not([keyfocus])
|
||
|
%define item richlistitem[type="download"]
|
||
|
%define itemFinished @item@[state="1"]
|
||
|
%define itemFocused #downloadsListBox:focus > @item@[selected]
|
||
|
|
||
|
/*** Panel and outer controls ***/
|
||
|
|
||
|
#downloadsPanel > .panel-arrowcontainer > .panel-arrowcontent {
|
||
|
padding: 0;
|
||
|
}
|
||
|
|
||
|
#downloadsListBox {
|
||
|
background: transparent;
|
||
|
padding: 4px;
|
||
|
color: inherit;
|
||
|
}
|
||
|
|
||
|
#downloadsPanel:not([hasdownloads]) > #downloadsListBox {
|
||
|
display: none;
|
||
|
}
|
||
|
|
||
|
#downloadsPanel[hasdownloads] > #emptyDownloads {
|
||
|
display: none;
|
||
|
}
|
||
|
|
||
|
#emptyDownloads {
|
||
|
padding: 10px 20px;
|
||
|
max-width: 40ch;
|
||
|
}
|
||
|
|
||
|
#downloadsSummary {
|
||
|
padding: 8px 38px 8px 12px;
|
||
|
cursor: pointer;
|
||
|
-moz-user-focus: normal;
|
||
|
}
|
||
|
|
||
|
#downloadsSummary > .downloadTypeIcon {
|
||
|
list-style-image: url("chrome://browser/skin/downloads/download-summary.png");
|
||
|
}
|
||
|
|
||
|
%ifdef XP_MACOSX
|
||
|
@media (min-resolution: 2dppx) {
|
||
|
#downloadsSummary > .downloadTypeIcon {
|
||
|
list-style-image: url("chrome://browser/skin/downloads/download-summary@2x.png");
|
||
|
}
|
||
|
}
|
||
|
%endif
|
||
|
|
||
|
#downloadsSummaryDescription {
|
||
|
color: -moz-nativehyperlinktext;
|
||
|
}
|
||
|
|
||
|
#downloadsHistory {
|
||
|
background: transparent;
|
||
|
cursor: pointer;
|
||
|
}
|
||
|
|
||
|
#downloadsHistory > .button-box {
|
||
|
margin: 1em;
|
||
|
}
|
||
|
|
||
|
/*** List items and similar elements in the summary ***/
|
||
|
|
||
|
#downloadsSummary,
|
||
|
richlistitem[type="download"] {
|
||
|
height: var(--downloads-item-height);
|
||
|
-moz-padding-end: 0;
|
||
|
color: inherit;
|
||
|
}
|
||
|
|
||
|
richlistitem[type="download"] {
|
||
|
margin: 0;
|
||
|
border-top: 1px solid var(--downloads-item-border-top-color);
|
||
|
border-bottom: 1px solid var(--downloads-item-border-bottom-color);
|
||
|
background: transparent;
|
||
|
padding: 8px;
|
||
|
}
|
||
|
|
||
|
richlistitem[type="download"]:first-child {
|
||
|
border-top: 1px solid transparent;
|
||
|
}
|
||
|
|
||
|
richlistitem[type="download"]:last-child {
|
||
|
border-bottom: 1px solid transparent;
|
||
|
}
|
||
|
|
||
|
.downloadTypeIcon {
|
||
|
-moz-margin-end: 8px;
|
||
|
/* Prevent flickering when changing states. */
|
||
|
height: 32px;
|
||
|
width: 32px;
|
||
|
}
|
||
|
|
||
|
.blockedIcon {
|
||
|
list-style-image: url("chrome://global/skin/icons/Error.png");
|
||
|
}
|
||
|
|
||
|
/* We hold .downloadTarget, .downloadProgress and .downloadDetails inside of
|
||
|
a vbox with class .downloadContainer. We set the font-size of the entire
|
||
|
container to --downloads-item-font-size-factor because:
|
||
|
|
||
|
1) This is the size that we want .downloadDetails to be
|
||
|
2) The container's width is set by localizers by &downloadDetails.width;,
|
||
|
which is a ch unit. Since this is the value that should control the
|
||
|
panel width, we apply it to the outer container to constrain
|
||
|
.downloadTarget and .downloadProgress.
|
||
|
|
||
|
Finally, since we want .downloadTarget's font-size to be at 100% of the
|
||
|
font-size of .downloadContainer's parent, we use calc to go from the
|
||
|
smaller font-size back to the original font-size.
|
||
|
*/
|
||
|
#downloadsSummaryDetails,
|
||
|
.downloadContainer {
|
||
|
font-size: calc(100% * var(--downloads-item-font-size-factor));
|
||
|
}
|
||
|
|
||
|
#downloadsSummaryDescription,
|
||
|
.downloadTarget {
|
||
|
margin-bottom: var(--downloads-item-target-margin-bottom);
|
||
|
cursor: inherit;
|
||
|
}
|
||
|
|
||
|
.downloadTarget {
|
||
|
font-size: calc(100% / var(--downloads-item-font-size-factor));
|
||
|
}
|
||
|
|
||
|
#downloadsSummaryDetails,
|
||
|
.downloadDetails {
|
||
|
margin-top: var(--downloads-item-details-margin-top);
|
||
|
opacity: var(--downloads-item-details-opacity);
|
||
|
cursor: inherit;
|
||
|
}
|
||
|
|
||
|
.downloadButton {
|
||
|
-moz-appearance: none;
|
||
|
min-width: 0;
|
||
|
min-height: 0;
|
||
|
margin: 3px;
|
||
|
border: none;
|
||
|
background: transparent;
|
||
|
padding: 5px;
|
||
|
list-style-image: url("chrome://browser/skin/downloads/buttons.png");
|
||
|
}
|
||
|
|
||
|
.downloadButton > .button-box {
|
||
|
padding: 0;
|
||
|
}
|