Bug 1421853 - subviewbutton in sidebarMenu-popup does not have checkmark. r=Gijs draft
authorPaolo Amadini <paolo.mozmail@amadzone.org>
Wed, 06 Dec 2017 14:52:44 +0000
changeset 708313 6ff608c31c311688ea7caf37976bb38d977b7875
parent 707503 b4cef8d1dff06a1ec2b9bb17211c0c3c7f5b76fa
child 743163 df36e210dd519d33de4a1fec6012917464c435fe
push id92354
push userpaolo.mozmail@amadzone.org
push dateWed, 06 Dec 2017 14:53:47 +0000
reviewersGijs
bugs1421853
milestone59.0a1
Bug 1421853 - subviewbutton in sidebarMenu-popup does not have checkmark. r=Gijs Since the sidebar menu is the only element using the small checkbox style, this is re-implemented placing the styles closer to the existing ones that are required for the checkbox to work. Some descendant selectors can be removed in the process. MozReview-Commit-ID: vcVvvkvNeA
browser/base/content/browser.xul
browser/themes/osx/customizableui/panelUI.css
browser/themes/shared/sidebar.inc.css
--- a/browser/base/content/browser.xul
+++ b/browser/base/content/browser.xul
@@ -273,33 +273,33 @@
            flip="slide"
            orient="vertical"
            position="bottomcenter topleft">
       <toolbarbutton id="sidebar-switcher-bookmarks"
                      class="subviewbutton subviewbutton-iconic"
                      key="viewBookmarksSidebarKb"
                      observes="viewBookmarksSidebar"
                      oncommand="SidebarUI.show('viewBookmarksSidebar');">
-         <observes element="viewBookmarksSidebar" attribute="checked"/>
-       </toolbarbutton>
+        <observes element="viewBookmarksSidebar" attribute="checked"/>
+      </toolbarbutton>
       <toolbarbutton id="sidebar-switcher-history"
                      label="&historyButton.label;"
                      class="subviewbutton subviewbutton-iconic"
                      key="key_gotoHistory"
                      observes="viewHistorySidebar"
                      oncommand="SidebarUI.show('viewHistorySidebar');">
-         <observes element="viewHistorySidebar" attribute="checked"/>
-       </toolbarbutton>
+        <observes element="viewHistorySidebar" attribute="checked"/>
+      </toolbarbutton>
       <toolbarbutton id="sidebar-switcher-tabs"
                      label="&syncedTabs.sidebar.label;"
                      class="subviewbutton subviewbutton-iconic"
                      observes="viewTabsSidebar"
                      oncommand="SidebarUI.show('viewTabsSidebar');">
-         <observes element="viewTabsSidebar" attribute="checked"/>
-       </toolbarbutton>
+        <observes element="viewTabsSidebar" attribute="checked"/>
+      </toolbarbutton>
       <toolbarseparator/>
       <vbox id="sidebar-extensions"></vbox>
       <toolbarseparator/>
       <toolbarbutton id="sidebar-reverse-position"
                      class="subviewbutton"
                      oncommand="SidebarUI.reversePosition()"/>
       <toolbarseparator/>
       <toolbarbutton label="&sidebarMenuClose.label;"
--- a/browser/themes/osx/customizableui/panelUI.css
+++ b/browser/themes/osx/customizableui/panelUI.css
@@ -30,24 +30,16 @@ panelmultiview .toolbaritem-combined-but
   padding-inline-start: 34px;
   margin-inline-start: -34px;
 }
 
 #appMenu-fxa-container[fxastatus="signedin"] > #appMenu-fxa-status > #appMenu-fxa-avatar {
   margin-inline-start: 18px;
 }
 
-.subviewbutton[checked="true"] {
-  background-position: top 7px left 4px;
-}
-
-.subviewbutton[checked="true"]:-moz-locale-dir(rtl) {
-  background-position: top 7px right 4px;
-}
-
 .subviewbutton:not(:-moz-any([image],[targetURI],.cui-withicon, .bookmark-item)) > .menu-iconic-left {
   display: none;
 }
 
 /* Override OSX-specific toolkit styles for the bookmarks panel */
 menu.subviewbutton > .menu-right {
   margin-inline-end: 0;
   -moz-appearance: none;
--- a/browser/themes/shared/sidebar.inc.css
+++ b/browser/themes/shared/sidebar.inc.css
@@ -95,25 +95,51 @@
 #sidebarMenu-popup .subviewbutton {
   min-width: 190px;
 }
 
 #sidebar-extensions:empty + toolbarseparator {
   display: none;
 }
 
-%ifndef XP_MACOSX
+#sidebarMenu-popup > .subviewbutton[checked="true"] {
+  list-style-image: none;
+  background: url(chrome://browser/skin/check.svg) no-repeat transparent;
+  background-size: 11px 11px;
+}
+
+%ifdef XP_MACOSX
+
+#sidebarMenu-popup > .subviewbutton[checked="true"] {
+  background-position: top 7px left 4px;
+}
+
+#sidebarMenu-popup > .subviewbutton[checked="true"]:-moz-locale-dir(rtl) {
+  background-position: top 7px right 4px;
+}
+
+%else
+
+#sidebarMenu-popup > .subviewbutton[checked="true"] {
+  background-position: center left 7px;
+}
+
+#sidebarMenu-popup > .subviewbutton[checked="true"]:-moz-locale-dir(rtl) {
+  background-position: center right 7px;
+}
+
 /* Allow room for the checkbox drawn as a background image at the start of the toolbarbutton */
-#sidebarMenu-popup .subviewbutton-iconic > .toolbarbutton-icon {
+#sidebarMenu-popup > .subviewbutton-iconic > .toolbarbutton-icon {
   margin-inline-start: 16px;
 }
 /* Align items without icons to the start of the icons: */
-#sidebarMenu-popup .subviewbutton:not(.subviewbutton-iconic) > .toolbarbutton-text {
+#sidebarMenu-popup > .subviewbutton:not(.subviewbutton-iconic) > .toolbarbutton-text {
   padding-inline-start: 16px;
 }
+
 %endif
 
 
 #sidebar-box[sidebarcommand="viewWebPanelsSidebar"] > #sidebar-header > #sidebar-switcher-target > #sidebar-icon {
   list-style-image: url(chrome://mozapps/skin/places/defaultFavicon.svg);
 }
 
 #sidebar-switcher-bookmarks > .toolbarbutton-icon,