Bug 1384692 - Update the download doorhanger style. ui-r=amylee, r=Paolo.

MozReview-Commit-ID: 4pY9JxnLNYk

--HG--
extra : rebase_source : a6573e33298e84fca2fc8de92c932f770dcc53b2
This commit is contained in:
Blake Winton 2017-08-01 09:18:11 -04:00
Родитель 1243cb04e0
Коммит fff59923b4
5 изменённых файлов: 21 добавлений и 115 удалений

Просмотреть файл

@ -200,63 +200,3 @@ richlistitem.download button {
#downloadsPanel-mainView .download-state[state="8"] .downloadShowBlockedInfo {
display: inline;
}
/** When the main view is showing... **/
/* The subview should be off to the right and not visible at all. */
#downloadsPanel-multiView > .panel-viewcontainer > .panel-viewstack[viewtype=main] > .panel-subviews {
transform: translateX(101%);
transition: transform var(--panelui-subview-transition-duration);
}
#downloadsPanel-multiView > .panel-viewcontainer > .panel-viewstack[viewtype=main] > .panel-subviews:-moz-locale-dir(rtl) {
transform: translateX(-101%);
}
/** When the subview is showing... **/
/* Hide the buttons of all downloads except the one that triggered the
subview. */
#downloadsPanel-multiView > .panel-viewcontainer > .panel-viewstack[viewtype="subview"] .download-state:not([showingsubview]) .downloadButton {
visibility: hidden;
}
/* For the download that triggered the subview, move its button farther to the
right by removing padding so that a minimum amount of the main view's right
edge needs to be shown. */
#downloadsPanel-multiView > .panel-viewcontainer > .panel-viewstack[viewtype="subview"] .download-state[showingsubview] {
padding: 0;
}
/* The main view should slide to the left and its right edge should remain
visible. */
#downloadsPanel-multiView > .panel-viewcontainer > .panel-viewstack[viewtype=subview] > .panel-mainview {
transform: translateX(calc(-100% + 38px));
transition: transform var(--panelui-subview-transition-duration);
}
#downloadsPanel-multiView > .panel-viewcontainer > .panel-viewstack[viewtype=subview] > .panel-mainview:-moz-locale-dir(rtl) {
transform: translateX(calc(100% - 38px));
}
/* The subview should leave the right edge of the main view uncovered. */
#downloadsPanel-multiView > .panel-viewcontainer > .panel-viewstack > .panel-subviews {
/* Use a margin instead of a transform like above so that the subview's width
isn't wider than the panel. */
-moz-margin-start: 38px !important;
}
/* Prevent keyboard interaction in the main view by preventing all elements in
the main view from being focused... */
#downloadsPanel-multiView > .panel-viewcontainer > .panel-viewstack[viewtype="subview"] > .panel-mainview #downloadsListBox,
#downloadsPanel-multiView > .panel-viewcontainer > .panel-viewstack[viewtype="subview"] > .panel-mainview richlistitem,
#downloadsPanel-multiView > .panel-viewcontainer > .panel-viewstack[viewtype="subview"] > .panel-mainview .downloadButton,
#downloadsPanel-multiView > .panel-viewcontainer > .panel-viewstack[viewtype="subview"] > .panel-mainview .downloadsPanelFooterButton,
#downloadsPanel-multiView > .panel-viewcontainer > .panel-viewstack[viewtype="subview"] > .panel-mainview #downloadsSummary {
-moz-user-focus: ignore;
}
/* ... except for the downloadShowBlockedInfo button in the blocked download.
Selecting it with the keyboard should show the main view again. */
#downloadsPanel-multiView > .panel-viewcontainer > .panel-viewstack[viewtype="subview"] .download-state[showingsubview] .downloadShowBlockedInfo {
-moz-user-focus: normal;
}

Просмотреть файл

@ -1571,13 +1571,6 @@ var DownloadsBlockedSubview = {
* An array of strings with information about the block.
*/
toggle(element, title, details) {
if (this.view.showingSubView) {
this.hide();
return;
}
this.element = element;
element.setAttribute("showingsubview", "true");
DownloadsView.subViewOpen = true;
DownloadsViewController.updateCommands();
@ -1598,16 +1591,19 @@ var DownloadsBlockedSubview = {
// Without this, the mainView is more narrow than the panel once all
// downloads are removed from the panel.
document.getElementById("downloadsPanel-mainView").style.minWidth =
window.getComputedStyle(this.view).width;
window.getComputedStyle(this.subview).width;
},
handleEvent(event) {
switch (event.type) {
case "ViewHiding":
this.subview.removeEventListener(event.type, this);
this.element.removeAttribute("showingsubview");
DownloadsView.subViewOpen = false;
delete this.element;
// If we're going back to the main panel, use showPanel to
// focus the proper element.
if (this.view.current !== this.subview) {
DownloadsPanel.showPanel();
}
break;
default:
DownloadsCommon.log("Unhandled DownloadsBlockedSubview event: " +
@ -1616,16 +1612,6 @@ var DownloadsBlockedSubview = {
}
},
/**
* Slides out the blocked subview and shows the main view.
*/
hide() {
this.view.showMainView();
// The point of this is to focus the proper element in the panel now that
// the main view is showing again. showPanel handles that.
DownloadsPanel.showPanel();
},
/**
* Deletes the download and hides the entire panel.
*/

Просмотреть файл

@ -106,8 +106,8 @@
accesskey="&cmd.clearList2.accesskey;"/>
</menupopup>
<panelmultiview id="downloadsPanel-multiView"
mainViewId="downloadsPanel-mainView">
<photonpanelmultiview id="downloadsPanel-multiView"
mainViewId="downloadsPanel-mainView">
<panelview id="downloadsPanel-mainView">
<vbox class="panel-view-body-unscrollable">
@ -154,7 +154,9 @@
</panelview>
<panelview id="downloadsPanel-blockedSubview"
descriptionheightworkaround="true">
descriptionheightworkaround="true"
class="PanelUI-subView"
title="&downloadDetails.label;">
<vbox class="panel-view-body-unscrollable">
<description id="downloadsPanel-blockedSubview-title"/>
<description id="downloadsPanel-blockedSubview-details1"/>
@ -176,7 +178,7 @@
</hbox>
</panelview>
</panelmultiview>
</photonpanelmultiview>
</panel>
</popupset>

Просмотреть файл

@ -134,6 +134,12 @@
<!ENTITY downloadsHistory.label "Show All Downloads">
<!ENTITY downloadsHistory.accesskey "S">
<!-- LOCALIZATION NOTE (downloadDetails.label):
This string is shown at the top of the Download Details Panel, to indicate
that we are showing the details of a single download.
-->
<!ENTITY downloadDetails.label "Download Details">
<!-- LOCALIZATION NOTE (openDownloadsFolder.label):
This command is not currently available in the user interface, but the
string was preserved by bug 1362207 to be used in a future version.

Просмотреть файл

@ -270,16 +270,8 @@ richlistitem[type="download"]:last-child {
background-color: var(--arrowpanel-dimmed-further);
}
@item@[showingsubview] {
background-color: Highlight;
color: HighlightText;
transition: background-color var(--panelui-subview-transition-duration),
color var(--panelui-subview-transition-duration);
}
@item@[verdict="Malware"]:hover,
@item@[verdict="Malware"]:hover:active,
@item@[verdict="Malware"][showingsubview] {
@item@[verdict="Malware"]:hover:active {
background-color: #aa1b08;
color: white;
}
@ -312,27 +304,7 @@ richlistitem[type="download"]:last-child {
/*** Blocked subview ***/
#downloadsPanel-multiView > .panel-viewcontainer > .panel-viewstack[viewtype=main] > .panel-subviews {
/* When the main view is showing, the shadow on the left edge of the subview is
barely visible on the right edge of the main view, so set it to none. */
box-shadow: none;
}
/* When the subview is showing, turn the download button into an arrow pointing
back to the main view. */
#downloadsPanel-multiView > .panel-viewcontainer > .panel-viewstack[viewtype="subview"] .download-state[showingsubview] .downloadButton {
color: HighlightText;
}
#downloadsPanel-multiView > .panel-viewcontainer > .panel-viewstack[viewtype="subview"] .download-state[showingsubview] .downloadButton > .button-box > .button-icon {
list-style-image: url("chrome://browser/skin/panel-icon-arrow-left.svg");
}
#downloadsPanel-multiView > .panel-viewcontainer > .panel-viewstack[viewtype="subview"] .download-state[showingsubview] .downloadButton > .button-box > .button-icon:-moz-locale-dir(rtl) {
list-style-image: url("chrome://browser/skin/panel-icon-arrow-right.svg");
}
#downloadsPanel-blockedSubview {
#downloadsPanel-blockedSubview > .panel-view-body-unscrollable {
background-image: url("chrome://browser/skin/warning.svg");
background-size: 32px 32px;
background-position: 16px 16px;
@ -343,7 +315,7 @@ richlistitem[type="download"]:last-child {
background-position: calc(100% - 16px) 16px;
}
#downloadsPanel-blockedSubview[verdict=Malware] {
#downloadsPanel-blockedSubview[verdict=Malware] > .panel-view-body-unscrollable {
background-image: url("chrome://browser/skin/downloads/download-blocked.svg");
}