Bug 1244473 - Part 3 - Restructure some rules for the panel and the outer controls. r=jaws draft
authorPaolo Amadini <paolo.mozmail@amadzone.org>
Wed, 03 Feb 2016 20:31:21 +0000
changeset 328910 a7f0e96e68cfa0a96265f4dcca46cf19173a7c99
parent 328909 466c67dead12cc89f3f55d1cc2bbb3d98c4f05d7
child 328911 3c6a2e2dc54ef185cb9b37517cf32036cab9c06c
push id10432
push userpaolo.mozmail@amadzone.org
push dateThu, 04 Feb 2016 15:40:22 +0000
reviewersjaws
bugs1244473
milestone47.0a1
Bug 1244473 - Part 3 - Restructure some rules for the panel and the outer controls. r=jaws
browser/themes/linux/downloads/downloads.css
browser/themes/osx/downloads/downloads.css
browser/themes/shared/downloads/downloads.inc.css
browser/themes/windows/downloads/downloads.css
--- a/browser/themes/linux/downloads/downloads.css
+++ b/browser/themes/linux/downloads/downloads.css
@@ -1,55 +1,49 @@
 /* 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/. */
 
 %include ../../shared/downloads/downloads.inc.css
 
 /*** Panel and outer controls ***/
 
-#downloadsHistory {
-  background: transparent;
-  color: -moz-nativehyperlinktext;
-  cursor: pointer;
-}
-
 #downloadsFooter {
   border-top: 1px solid ThreeDShadow;
   background-image: linear-gradient(hsla(0,0%,0%,.15), hsla(0,0%,0%,.08) 6px);
 }
 
-#downloadsHistory > .button-box {
-  margin: 1em;
+#downloadsHistory {
+  color: -moz-nativehyperlinktext;
 }
 
-#downloadsPanel[keyfocus] > #downloadsFooter > #downloadsHistory:focus > .button-box {
+@keyfocus@ #downloadsSummary:focus,
+@keyfocus@ #downloadsHistory:focus > .button-box {
   outline: 1px -moz-dialogtext dotted;
 }
 
+@keyfocus@ #downloadsSummary:focus {
+  outline-offset: -5px;
+}
+
 /*** Downloads Summary and List items ***/
 
 #downloadsSummary,
 richlistitem[type="download"] {
   height: 6em;
   -moz-padding-end: 0;
   color: inherit;
 }
 
 #downloadsSummary {
   padding: 8px 38px 8px 12px;
   cursor: pointer;
   -moz-user-focus: normal;
 }
 
-#downloadsPanel[keyfocus] > #downloadsFooter > #downloadsSummary:focus {
-  outline: 1px -moz-dialogtext dotted;
-  outline-offset: -5px;
-}
-
 #downloadsSummary > .downloadTypeIcon {
   list-style-image: url("chrome://browser/skin/downloads/download-summary.png");
 }
 
 #downloadsSummaryDescription {
   color: -moz-nativehyperlinktext;
 }
 
--- a/browser/themes/osx/downloads/downloads.css
+++ b/browser/themes/osx/downloads/downloads.css
@@ -6,39 +6,29 @@
 
 /*** Panel and outer controls ***/
 
 #downloadsPanel {
   margin-top: -1px;
 }
 
 #downloadsFooter {
+  background: #e5e5e5;
+  border-top: 1px solid hsla(0,0%,0%,.1);
+  box-shadow: 0 -1px hsla(0,0%,100%,.5) inset, 0 1px 1px hsla(0,0%,0%,.03) inset;
   border-bottom-left-radius: 4px;
   border-bottom-right-radius: 4px;
 }
 
 #downloadsHistory {
-  background: transparent;
-  color: hsl(210,100%,75%);
-  cursor: pointer;
+  color: #808080;
 }
 
-#downloadsFooter {
-  background: #e5e5e5;
-  border-top: 1px solid hsla(0,0%,0%,.1);
-  box-shadow: 0 -1px hsla(0,0%,100%,.5) inset, 0 1px 1px hsla(0,0%,0%,.03) inset;
-}
-
-#downloadsHistory > .button-box {
-  color: #808080;
-  margin: 1em;
-}
-
-#downloadsPanel[keyfocus] > #downloadsFooter > #downloadsSummary:focus,
-#downloadsPanel[keyfocus] > #downloadsFooter > #downloadsHistory:focus {
+@keyfocus@ #downloadsSummary:focus,
+@keyfocus@ #downloadsHistory:focus {
   outline: 2px -moz-mac-focusring solid;
   outline-offset: -2px;
   -moz-outline-radius-bottomleft: 4px;
   -moz-outline-radius-bottomright: 4px;
 }
 
 /*** Downloads Summary and List items ***/
 
--- a/browser/themes/shared/downloads/downloads.inc.css
+++ b/browser/themes/shared/downloads/downloads.inc.css
@@ -1,12 +1,16 @@
 /* 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]
+
 /*** Panel and outer controls ***/
 
 #downloadsPanel > .panel-arrowcontainer > .panel-arrowcontent {
   padding: 0;
 }
 
 #downloadsListBox {
   background: transparent;
@@ -21,8 +25,17 @@
 #downloadsPanel[hasdownloads] > #emptyDownloads {
   display: none;
 }
 
 #emptyDownloads {
   padding: 10px 20px;
   max-width: 40ch;
 }
+
+#downloadsHistory {
+  background: transparent;
+  cursor: pointer;
+}
+
+#downloadsHistory > .button-box {
+  margin: 1em;
+}
--- a/browser/themes/windows/downloads/downloads.css
+++ b/browser/themes/windows/downloads/downloads.css
@@ -1,39 +1,16 @@
 /* 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/. */
 
 %include ../../shared/downloads/downloads.inc.css
 
 /*** Panel and outer controls ***/
 
-#downloadsHistory {
-  background: transparent;
-  cursor: pointer;
-}
-
-@media (-moz-os-version: windows-xp),
-       (-moz-os-version: windows-vista),
-       (-moz-os-version: windows-win7) {
-  #downloadsHistory {
-    color: -moz-nativehyperlinktext;
-  }
-}
-
-#downloadsPanel[keyfocus] > #downloadsFooter > #downloadsHistory:focus {
-  outline: 1px -moz-dialogtext dotted;
-  outline-offset: -1px;
-}
-
-#downloadsHistory > .button-box {
-  border: none;
-  margin: 1em;
-}
-
 #downloadsFooter {
   background-color: hsla(210,4%,10%,.04);
   box-shadow: 0 1px 0 hsla(210,4%,10%,.08) inset;
   transition-duration: 150ms;
   transition-property: background-color;
 }
 
 #downloadsFooter:hover {
@@ -43,16 +20,20 @@
 #downloadsFooter:hover:active {
   background-color: hsla(210,4%,10%,.1);
   box-shadow: 0 2px 0 0 hsla(210,4%,10%,.1) inset;
 }
 
 @media (-moz-os-version: windows-xp),
        (-moz-os-version: windows-vista),
        (-moz-os-version: windows-win7) {
+  #downloadsHistory {
+    color: -moz-nativehyperlinktext;
+  }
+
   @media (-moz-windows-default-theme) {
     #downloadsFooter {
       border-bottom-left-radius: 3px;
       border-bottom-right-radius: 3px;
       transition-duration: 0s;
     }
 
     #downloadsFooter,
@@ -67,36 +48,46 @@
       #downloadsFooter:hover,
       #downloadsFooter:hover:active {
         background-color: hsla(216,45%,88%,.98);
       }
     }
   }
 }
 
+@keyfocus@ #downloadsSummary:focus,
+@keyfocus@ #downloadsHistory:focus {
+  outline: 1px -moz-dialogtext dotted;
+  outline-offset: -1px;
+}
+
+@keyfocus@ #downloadsSummary:focus {
+  outline-offset: -5px;
+}
+
+#downloadsHistory > .button-box {
+  /* Hide the border so we don't display an inner focus ring. */
+  border: none;
+}
+
 /*** Downloads Summary and List items ***/
 
 #downloadsSummary,
 richlistitem[type="download"] {
   height: 7em;
   -moz-padding-end: 0;
   color: inherit;
 }
 
 #downloadsSummary {
   padding: 8px 38px 8px 12px;
   cursor: pointer;
   -moz-user-focus: normal;
 }
 
-#downloadsPanel[keyfocus] > #downloadsFooter > #downloadsSummary:focus {
-  outline: 1px -moz-dialogtext dotted;
-  outline-offset: -5px;
-}
-
 #downloadsSummary > .downloadTypeIcon {
   list-style-image: url("chrome://browser/skin/downloads/download-summary.png");
 }
 
 #downloadsSummaryDescription {
   color: -moz-nativehyperlinktext;
 }