Bug 1354159 - Part 4 - Implement the style changes necessary to properly view the new Bookmarks view inside the Library Panel. r?Gijs,mak draft
authorMike de Boer <mdeboer@mozilla.com>
Thu, 29 Jun 2017 17:57:28 -0700
changeset 602442 ab926e47f116a19a00789b68dd6b7c6a2031dc00
parent 602441 290917305e7934e1400e05f570bf3aea27acfccf
child 635611 42a571fe1e1109342b1b4acac5d865fa4b919d0a
push id66444
push usermdeboer@mozilla.com
push dateFri, 30 Jun 2017 01:01:10 +0000
reviewersGijs, mak
bugs1354159
milestone56.0a1
Bug 1354159 - Part 4 - Implement the style changes necessary to properly view the new Bookmarks view inside the Library Panel. r?Gijs,mak MozReview-Commit-ID: 2tPH89DXbcp
browser/themes/linux/browser.css
browser/themes/linux/customizableui/panelUI.css
browser/themes/shared/customizableui/panelUI.inc.css
browser/themes/shared/menupanel.inc.css
browser/themes/shared/toolbarbuttons.inc.css
browser/themes/windows/customizableui/panelUI.css
--- a/browser/themes/linux/browser.css
+++ b/browser/themes/linux/browser.css
@@ -1283,9 +1283,9 @@ notification.pluginVulnerable > .notific
 
 .webextension-popup-browser {
   border-radius: inherit;
 }
 
 /* Prevent movement in the restore-tabs-button when it's clicked. */
 .restore-tabs-button:hover:active:not([disabled="true"]) {
   padding: 3px;
-}
\ No newline at end of file
+}
--- a/browser/themes/linux/customizableui/panelUI.css
+++ b/browser/themes/linux/customizableui/panelUI.css
@@ -104,9 +104,19 @@ photonpanelmultiview .subviewbutton > .t
 photonpanelmultiview .panel-banner-item > .toolbarbutton-multiline-text {
   margin: 0;
 }
 
 photonpanelmultiview .subviewbutton > .toolbarbutton-icon {
   padding: 0;
 }
 
+photonpanelmultiview .subviewbutton:-moz-any([image],[targetURI],.cui-withicon,
+  .restoreallitem, .bookmark-item) > .toolbarbutton-text {
+  padding-inline-start: 8px;
+}
+
+photonpanelmultiview .subviewbutton:-moz-any([image],[targetURI],.cui-withicon,
+  .restoreallitem, .bookmark-item)[checked="true"] > .toolbarbutton-icon {
+  visibility: visible;
+}
+
 /* END photon adjustments */
--- a/browser/themes/shared/customizableui/panelUI.inc.css
+++ b/browser/themes/shared/customizableui/panelUI.inc.css
@@ -347,27 +347,27 @@ panelview:not([mainview]) .toolbarbutton
 #appMenu-popup > .panel-arrowcontainer > .panel-arrowcontent,
 panel[photon] > .panel-arrowcontainer > .panel-arrowcontent {
   padding: 0;
   border-radius: 0;
 }
 
 photonpanelmultiview panelview {
   background: var(--arrowpanel-background);
-  padding: 6px 0;
+  padding: 0;
 }
 
 #appMenu-popup panelview,
 #customizationui-widget-multiview panelview:not([extension]) {
   min-width: @menuPanelWidth@;
   max-width: 30em;
 }
 
-photonpanelmultiview panelview[title] {
-  padding-top: 0;
+photonpanelmultiview .panel-subview-body {
+  margin: 4px 0;
 }
 
 /* END photonpanelview adjustments */
 
 .cui-widget-panel.cui-widget-panelWithFooter > .panel-arrowcontainer > .panel-arrowcontent {
   padding-bottom: 0;
 }
 
@@ -1255,50 +1255,47 @@ panelview:not([mainView]) .subviewbutton
 
 .cui-widget-panelview .subviewbutton:not(.panel-subview-footer) {
   margin-left: 4px;
   margin-right: 4px;
 }
 
 /* START photon adjustments */
 
-photonpanelmultiview .PanelUI-subView .subviewbutton:not(.panel-subview-footer) {
+photonpanelmultiview .PanelUI-subView .subviewbutton,
+photonpanelmultiview .cui-widget-panelview .subviewbutton:not(.panel-subview-footer),
+photonpanelmultiview .subview-subheader {
   border-radius: 0;
   border-width: 0;
-  margin-left: 0;
-  margin-right: 0;
+  margin: 0;
   padding: 4px 12px;
 }
 
 photonpanelmultiview .subviewbutton:focus {
   outline: 0;
 }
 
 photonpanelmultiview .subviewbutton > .toolbarbutton-text {
   padding: 0;
   padding-inline-start: 24px; /* This is 16px for the icon + 8px for the padding as defined above. */
 }
 
-photonpanelmultiview .subviewbutton-iconic:not(.subviewbutton-back) > .toolbarbutton-text,
+photonpanelmultiview .subviewbutton-iconic > .toolbarbutton-text,
 photonpanelmultiview .cui-withicon > .toolbarbutton-text,
 photonpanelmultiview .subviewbutton[image] > .toolbarbutton-text,
 photonpanelmultiview .subviewbutton[checked="true"] > .toolbarbutton-text {
   padding-inline-start: 8px; /* See '.subviewbutton-iconic > .toolbarbutton-text' rule above. */
 }
 
 photonpanelmultiview .panel-banner-item > .toolbarbutton-multiline-text {
   font: menu;
   padding: 0;
   padding-inline-start: 8px; /* See '.subviewbutton-iconic > .toolbarbutton-text' rule above. */
 }
 
-photonpanelmultiview .PanelUI-subView .panel-subview-footer {
-  font-size: 1.2rem;
-}
-
 photonpanelmultiview .subviewbutton {
   -moz-context-properties: fill;
   fill: currentColor;
 }
 
 photonpanelmultiview .subviewbutton[checked="true"] {
   background: none;
   list-style-image: url(chrome://browser/skin/check.svg);
@@ -1362,16 +1359,29 @@ photonpanelmultiview .toolbaritem-combin
   padding-inline-start: 0;
 }
 
 photonpanelmultiview .panel-banner-item::after {
   margin-inline-end: 14px;
   margin-inline-start: 10px;
 }
 
+photonpanelmultiview .subview-subheader {
+  color: GrayText;
+}
+
+photonpanelmultiview .subview-subheader,
+photonpanelmultiview .panel-subview-footer {
+  font: menu;
+}
+
+photonpanelmultiview panelview:not([mainView]) .subviewbutton.panel-subview-footer > .toolbarbutton-text {
+  text-align: start;
+}
+
 /* END photon adjustments */
 
 panelview .toolbarbutton-1,
 .widget-overflow-list > .toolbarbutton-1:not(:first-child),
 .widget-overflow-list > toolbaritem:not(:first-child) {
   margin-top: 6px;
 }
 
@@ -2070,17 +2080,16 @@ menuitem[checked="true"].subviewbutton >
 /* START photon adjustments */
 
 .panel-header {
   align-items: center;
   border-bottom: 1px solid var(--panel-separator-color);
   display: flex;
   flex: 1 auto;
   height: 40px; /* fixed item height to prevent flex sizing; height + 2*4px padding */
-  margin-bottom: 6px;
   padding: 4px;
 }
 
 .panel-header > label {
   flex: auto;
   font-size: 13px;
   font-weight: 500;
   margin: 0;
@@ -2116,9 +2125,13 @@ photonpanelmultiview#customizationui-wid
 }
 
 /* This is explicitly overriding the overflow properties set above. */
 photonpanelmultiview .cui-widget-panelview {
   overflow-x: visible;
   overflow-y: visible;
 }
 
+photonpanelmultiview #panelMenu_pocket {
+  display: none;
+}
+
 /* END photon adjustments */
--- a/browser/themes/shared/menupanel.inc.css
+++ b/browser/themes/shared/menupanel.inc.css
@@ -207,17 +207,18 @@ toolbarpaletteitem[place="palette"] > #z
 #appMenu-preferences-button {
   list-style-image: url(chrome://browser/skin/settings.svg);
 }
 
 #appMenu-customize-button {
   list-style-image: url(chrome://browser/skin/customize.svg);
 }
 
-#appMenu-find-button {
+#appMenu-find-button,
+#panelMenu_searchBookmarks {
   list-style-image: url(chrome://browser/skin/find.svg);
 }
 
 #appMenu-help-button {
   list-style-image: url(chrome://browser/skin/help.svg);
 }
 
 #appMenu-cut-button {
@@ -264,18 +265,28 @@ toolbarpaletteitem[place="palette"] > #z
   list-style-image: url("chrome://browser/skin/sync.svg");
 }
 
 #PanelUI-remotetabs-view-managedevices {
   list-style-image: url("chrome://browser/skin/device-mobile.svg");
 }
 
 #appMenuViewHistorySidebar,
-#PanelUI-remotetabs-view-sidebar {
+#PanelUI-remotetabs-view-sidebar,
+#panelMenu_viewBookmarksSidebar {
   list-style-image: url("chrome://browser/skin/sidebars.svg");
 }
 
+#appMenu-library-bookmarks-button,
+#panelMenuBookmarkThisPage {
+  list-style-image: url("chrome://browser/skin/bookmark-hollow.svg");
+}
+
+#panelMenuBookmarkThisPage[starred] {
+  list-style-image: url("chrome://browser/skin/bookmark.svg");
+}
+
 %ifdef MOZ_PHOTON_THEME
 #bookmarks-menu-button[cui-areatype="menu-panel"],
 toolbarpaletteitem[place="palette"] > #bookmarks-menu-button {
   list-style-image: url("chrome://browser/skin/bookmark-star-on-tray.svg");
 }
 %endif
--- a/browser/themes/shared/toolbarbuttons.inc.css
+++ b/browser/themes/shared/toolbarbuttons.inc.css
@@ -468,12 +468,11 @@ toolbarbutton.bookmark-item:not(.subview
 }
 
 /* Force the display of the label for bookmarks */
 .bookmark-item > .toolbarbutton-text,
 #personal-bookmarks[cui-areatype="toolbar"] > #bookmarks-toolbar-placeholder > .toolbarbutton-text {
   display: -moz-box !important;
 }
 
-.bookmark-item > .toolbarbutton-icon[label]:not([label=""]) {
+#PlacesToolbarItems > .bookmark-item > .toolbarbutton-icon[label]:not([label=""]) {
   margin-inline-end: 5px;
 }
-
--- a/browser/themes/windows/customizableui/panelUI.css
+++ b/browser/themes/windows/customizableui/panelUI.css
@@ -154,9 +154,19 @@ photonpanelmultiview .subviewbutton > .t
 photonpanelmultiview .panel-banner-item > .toolbarbutton-multiline-text {
   margin: 0;
 }
 
 photonpanelmultiview .subviewbutton > .toolbarbutton-icon {
   padding: 0;
 }
 
+photonpanelmultiview .subviewbutton:-moz-any([image],[targetURI],.cui-withicon,
+  .restoreallitem, .bookmark-item) > .toolbarbutton-text {
+  padding-inline-start: 8px;
+}
+
+photonpanelmultiview .subviewbutton:-moz-any([image],[targetURI],.cui-withicon,
+  .restoreallitem, .bookmark-item)[checked="true"] > .toolbarbutton-icon {
+  visibility: visible;
+}
+
 /* END photon adjustments */