Bug 1351255 - Align add-on install notification r?nhnt11 draft
authorMark Striemer <mstriemer@mozilla.com>
Thu, 27 Apr 2017 15:05:05 -0500
changeset 574968 d777e5c8db56faebf032e659a7f8f29646773d91
parent 568347 e11280c16e551105055f82cb40f7325663e11fac
child 627749 cf73a85760d48a4bc4e829a9a5622ae6b03a9299
push id57870
push userbmo:mstriemer@mozilla.com
push dateTue, 09 May 2017 16:37:13 +0000
reviewersnhnt11
bugs1351255
milestone55.0a1
Bug 1351255 - Align add-on install notification r?nhnt11 MozReview-Commit-ID: GbXjSOv5K6Q
browser/base/content/popup-notifications.inc
browser/themes/linux/browser.css
browser/themes/osx/browser.css
browser/themes/windows/browser.css
--- a/browser/base/content/popup-notifications.inc
+++ b/browser/base/content/popup-notifications.inc
@@ -76,13 +76,13 @@
       <popupnotificationcontent orient="vertical">
         <description id="addon-webext-perm-text" class="addon-webext-perm-text"/>
         <label id="addon-webext-perm-intro" class="addon-webext-perm-text"/>
         <html:ul id="addon-webext-perm-list" class="addon-webext-perm-list"/>
       </popupnotificationcontent>
     </popupnotification>
 
     <popupnotification id="addon-installed-notification" hidden="true">
-      <popupnotificationcontent orient="vertical">
+      <popupnotificationcontent class="addon-installed-notification-content" orient="vertical">
         <description id="addon-installed-notification-header"/>
         <description id="addon-installed-notification-message"/>
       </popupnotificationcontent>
     </popupnotification>
--- a/browser/themes/linux/browser.css
+++ b/browser/themes/linux/browser.css
@@ -802,34 +802,58 @@ html|*.addon-webext-perm-list {
   margin-inline-start: 0;
 }
 
 .popup-notification-description[popupid="addon-webext-permissions"] {
   margin: 0;
   padding: 0;
 }
 
+.popup-notification-description[popupid="addon-installed"] {
+  display: none;
+}
+
+.addon-installed-notification-content,
+#addon-installed-notification-header {
+  margin-top: 0;
+}
+
+#addon-installed-notification-message {
+  margin-top: 0.5em;
+}
+
 .addon-webext-name {
   display: inline;
   font-weight: bold;
   margin: 0;
 }
 
 .addon-addon-icon {
   width: 14px;
   height: 14px;
   list-style-image: url("chrome://browser/skin/menuPanel.svg");
   -moz-image-region: rect(0px, 288px, 32px, 256px);
+  vertical-align: bottom;
+  margin-bottom: 2px;
 }
 
 .addon-toolbar-icon {
   width: 14px;
   height: 14px;
   list-style-image: url("chrome://browser/skin/Toolbar.png");
   -moz-image-region: rect(0, 486px, 18px, 468px);
+  vertical-align: bottom;
+  margin-bottom: 2px;
+}
+
+@media (min-resolution: 1.1dppx) {
+  .addon-toolbar-icon {
+    list-style-image: url("chrome://browser/skin/Toolbar@2x.png");
+    -moz-image-region: rect(0, 972px, 36px, 936px);
+  }
 }
 
 /* Notification icon box */
 
 .notification-anchor-icon:-moz-focusring {
   outline: 1px dotted -moz-DialogText;
 }
 
--- a/browser/themes/osx/browser.css
+++ b/browser/themes/osx/browser.css
@@ -3050,34 +3050,55 @@ html|*.addon-webext-perm-list {
   margin-inline-start: 0;
 }
 
 .popup-notification-description[popupid="addon-webext-permissions"] {
   margin: 0;
   padding: 0;
 }
 
+.popup-notification-description[popupid="addon-installed"] {
+  display: none;
+}
+
+.addon-installed-notification-content,
+#addon-installed-notification-header {
+  margin-top: 0;
+}
+
 .addon-webext-name {
   display: inline;
   font-weight: bold;
   margin: 0;
 }
 
 .addon-addon-icon {
-  width: 14px;
-  height: 14px;
+  /* The add-on icon goes right to the edge of its bounds. Make it smaller and
+   * move it up with bottom margin to match the menu icon more closely. */
+  width: 13px;
+  height: 13px;
   list-style-image: url("chrome://browser/skin/menuPanel.svg");
   -moz-image-region: rect(0px, 288px, 32px, 256px);
+  vertical-align: bottom;
+  margin-bottom: 2px;
 }
 
 .addon-toolbar-icon {
   width: 14px;
   height: 14px;
   list-style-image: url("chrome://browser/skin/Toolbar.png");
   -moz-image-region: rect(0, 486px, 18px, 468px);
+  vertical-align: bottom;
+}
+
+@media (min-resolution: 1.1dppx) {
+  .addon-toolbar-icon {
+    list-style-image: url("chrome://browser/skin/Toolbar@2x.png");
+    -moz-image-region: rect(0, 972px, 36px, 936px);
+  }
 }
 
 /* Status panel */
 
 .statuspanel-label {
   margin: 0;
   padding: 2px 4px;
   background: linear-gradient(#fff, #ddd);
--- a/browser/themes/windows/browser.css
+++ b/browser/themes/windows/browser.css
@@ -2093,34 +2093,55 @@ html|*.addon-webext-perm-list {
   margin-inline-start: 0;
 }
 
 .popup-notification-description[popupid="addon-webext-permissions"] {
   margin: 0;
   padding: 0;
 }
 
+.popup-notification-description[popupid="addon-installed"] {
+  display: none;
+}
+
+.addon-installed-notification-content,
+#addon-installed-notification-header {
+  margin-top: 0;
+}
+
 .addon-webext-name {
   display: inline;
   font-weight: bold;
   margin: 0;
 }
 
 .addon-addon-icon {
+  /* The add-on icon goes right to the edge of its bounds. Make it smaller and
+   * move it up with bottom margin to match the menu icon more closely. */
   width: 14px;
   height: 14px;
   list-style-image: url("chrome://browser/skin/menuPanel.svg");
   -moz-image-region: rect(0px, 288px, 32px, 256px);
+  vertical-align: bottom;
+  margin-bottom: 2px;
 }
 
 .addon-toolbar-icon {
   width: 14px;
   height: 14px;
   list-style-image: url("chrome://browser/skin/Toolbar.png");
   -moz-image-region: rect(0, 486px, 18px, 468px);
+  vertical-align: bottom;
+}
+
+@media (min-resolution: 1.1dppx) {
+  .addon-toolbar-icon {
+    list-style-image: url("chrome://browser/skin/Toolbar@2x.png");
+    -moz-image-region: rect(0, 972px, 36px, 936px);
+  }
 }
 
 /* Notification icon box */
 
 .notification-anchor-icon:-moz-focusring {
   outline: 1px dotted -moz-DialogText;
 }