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
--- 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 */