Bug 1289510 - Bookmarks toolbar buttons have weird hover styling when using a lightweight theme. r=jaws. draft
authorRakhi Sharma <Rakhish1994@gmail.com>
Mon, 01 Aug 2016 00:38:41 +0530
changeset 398428 a064f4ecd3b9a9cf2573af3676e286e30ec9e0d5
parent 392944 67ec58df938a652bc28dbbc82be4828756fb4ba4
child 527662 f2250ee4e8ccb4dd03372952554fd12e6dbe319e
push id25531
push userbmo:Rakhish1994@gmail.com
push dateTue, 09 Aug 2016 05:50:07 +0000
reviewersjaws
bugs1289510
milestone50.0a1
Bug 1289510 - Bookmarks toolbar buttons have weird hover styling when using a lightweight theme. r=jaws. MozReview-Commit-ID: 5pVJ3OGKDh4
browser/themes/linux/browser.css
browser/themes/windows/browser.css
--- a/browser/themes/linux/browser.css
+++ b/browser/themes/linux/browser.css
@@ -144,27 +144,32 @@ toolbarbutton.bookmark-item:not(.subview
   -moz-appearance: none;
   border: 1px  solid transparent;
   border-radius: 2px;
   transition-property: background-color, border-color ;
   transition-duration: 150ms;
 }
 
 toolbarbutton.bookmark-item:not(.subviewbutton):hover:not([open]) {
-  background-color: var(--toolbarbutton-hover-background);
+  background: var(--toolbarbutton-hover-background);
   border-color: var(--toolbarbutton-hover-bordercolor);
 }
 
 toolbarbutton.bookmark-item:not(.subviewbutton):hover:active,
 toolbarbutton.bookmark-item[open="true"] {
   background: var(--toolbarbutton-active-background);
   box-shadow: var(--toolbarbutton-active-boxshadow);
   border-color: var(--toolbarbutton-active-bordercolor);
 }
 
+toolbarbutton.bookmark-item:not(.subviewbutton):hover:-moz-lwtheme {
+  background: var(--toolbarbutton-hover-background);
+  border-color: var(--toolbarbutton-hover-bordercolor);
+}
+
 .bookmark-item > .toolbarbutton-icon,
 #personal-bookmarks[cui-areatype="toolbar"] > #bookmarks-toolbar-placeholder > .toolbarbutton-icon {
   width: 16px;
   height: 16px;
 }
 
 /* Force the display of the label for bookmarks */
 .bookmark-item > .toolbarbutton-text,
--- a/browser/themes/windows/browser.css
+++ b/browser/themes/windows/browser.css
@@ -461,30 +461,39 @@
 /* ::::: bookmark buttons ::::: */
 
 toolbarbutton.bookmark-item:not(.subviewbutton),
 #personal-bookmarks[cui-areatype="toolbar"]:not([overflowedItem=true]) > #bookmarks-toolbar-placeholder {
   margin: 0;
   padding: 2px 3px;
   -moz-appearance: none;
   border: 1px solid transparent;
+  border-radius: 1px;
+  transition-property: background-color, border-color, box-shadow;
+  transition-duration: 150ms;
 }
 
 toolbarbutton.bookmark-item:not(.subviewbutton):hover:not([disabled="true"]):not([open]) {
   border-color: var(--toolbarbutton-hover-bordercolor);
   background: var(--toolbarbutton-hover-background);
 }
 
 toolbarbutton.bookmark-item:not(.subviewbutton):hover:active:not([disabled="true"]),
 toolbarbutton.bookmark-item[open="true"] {
   border-color: var(--toolbarbutton-active-bordercolor);
   box-shadow: var(--toolbarbutton-active-boxshadow);
   background: var(--toolbarbutton-active-background);
 }
 
+toolbarbutton.bookmark-item:not(.subviewbutton):hover:not([disabled="true"]):-moz-lwtheme {
+  background-color: rgba(255,255,255,.25);
+  background-origin: padding-box;
+  background-clip: padding-box;
+}
+
 .bookmark-item > .toolbarbutton-icon,
 #personal-bookmarks[cui-areatype="toolbar"] > #bookmarks-toolbar-placeholder > .toolbarbutton-icon {
   width: 16px;
   height: 16px;
 }
 
 /* Force the display of the label for bookmarks */
 .bookmark-item > .toolbarbutton-text,