Bug 1369415 - Consolidate bookmark toolbar styling across platforms to the new Photon design. r=dao
MozReview-Commit-ID: IEha4s8h9ix
--- a/browser/themes/linux/browser.css
+++ b/browser/themes/linux/browser.css
@@ -79,53 +79,32 @@
}
#navigator-toolbox > toolbar:not(:-moz-lwtheme):not(#toolbar-menubar):not(#TabsToolbar) {
-moz-appearance: none;
border-style: none;
background-color: -moz-Dialog;
}
-#navigator-toolbox > toolbar:not(#toolbar-menubar):not(#TabsToolbar):not(#nav-bar):not(#addon-bar) {
- overflow: -moz-hidden-unscrollable;
- max-height: 4em;
- transition: min-height 170ms ease-out, max-height 170ms ease-out;
- padding: 1px 4px;
-}
-
-#navigator-toolbox > toolbar:not(#toolbar-menubar):not(#TabsToolbar):not(#nav-bar):not(#addon-bar)[collapsed=true] {
- min-height: 0.1px;
- max-height: 0;
- transition: min-height 170ms ease-out, max-height 170ms ease-out, visibility 170ms linear;
-}
-
#TabsToolbar:not([collapsed="true"]) + #nav-bar {
border-top: 1px solid hsla(0,0%,0%,.3) !important;
background-clip: padding-box;
/* Move up into the TabsToolbar for the inner highlight at the top of the nav-bar */
margin-top: calc(-1 * var(--navbar-tab-toolbar-highlight-overlap));
/* Position the toolbar above the bottom of background tabs */
position: relative;
z-index: 1;
}
#nav-bar {
box-shadow: 0 1px 0 @navbarInsetHighlight@ inset;
padding-top: 2px;
padding-bottom: 2px;
}
-/* This only has an effect when this element is placed on the bookmarks toolbar.
- * It's 30px to make sure buttons with 18px icons fit along with the default 16px
- * icons, without changing the size of the toolbar.
- */
-#personal-bookmarks {
- min-height: 30px;
-}
-
#browser-bottombox {
/* opaque for layers optimization */
background-color: -moz-Dialog;
}
#bookmarks-toolbar-placeholder {
list-style-image: url("chrome://browser/skin/places/bookmarksToolbar.png") !important;
}
--- a/browser/themes/osx/browser.css
+++ b/browser/themes/osx/browser.css
@@ -190,28 +190,16 @@ toolbar:-moz-lwtheme {
}
#navigator-toolbox > toolbar:-moz-window-inactive:not(#TabsToolbar):not(#nav-bar):not(:-moz-lwtheme) {
background-color: hsl(0,0%,95%);
}
}
%endif
-#navigator-toolbox > toolbar:not(#toolbar-menubar):not(#TabsToolbar):not(#nav-bar):not(#addon-bar) {
- overflow: -moz-hidden-unscrollable;
- max-height: 4em;
- transition: min-height 170ms ease-out, max-height 170ms ease-out;
-}
-
-#navigator-toolbox > toolbar:not(#toolbar-menubar):not(#TabsToolbar):not(#nav-bar):not(#addon-bar)[collapsed=true] {
- min-height: 0.1px;
- max-height: 0;
- transition: min-height 170ms ease-out, max-height 170ms ease-out, visibility 170ms linear;
-}
-
%ifndef MOZ_PHOTON_THEME
#nav-bar {
-moz-appearance: none;
background: url(chrome://browser/skin/Toolbar-background-noise.png),
linear-gradient(hsl(0,0%,93%), hsl(0,0%,83%));
background-clip: border-box;
background-origin: border-box !important;
@@ -268,43 +256,30 @@ toolbar:-moz-lwtheme {
z-index: 1;
}
#main-window[tabsintitlebar] #TabsToolbar:not([collapsed="true"]) + #nav-bar:-moz-window-inactive:not(:-moz-lwtheme) {
border-top-color: hsla(0,0%,0%,.05);
}
}
-#PersonalToolbar {
- padding: 0 4px 4px;
-}
-
-#PersonalToolbar:not([collapsed=true]) {
- /* 4px padding ^ plus 19px personal-bookmarks (see below) */
- min-height: 23px;
-}
-
%ifndef MOZ_PHOTON_THEME
#navigator-toolbox > toolbar:not(#TabsToolbar):-moz-lwtheme {
background-color: @toolbarColorLWT@;
background-image: url(chrome://browser/skin/Toolbar-background-noise.png);
}
%endif
#PersonalToolbar:not(:-moz-lwtheme):-moz-window-inactive,
#nav-bar:not(:-moz-lwtheme):-moz-window-inactive {
background-color: -moz-mac-chrome-inactive;
}
/* ----- BOOKMARK TOOLBAR ----- */
-#personal-bookmarks {
- min-height: 19px; /* 16px button height + 2px padding + 1px margin-bottom */
-}
-
#nav-bar-customization-target > #wrapper-personal-bookmarks > #personal-bookmarks {
min-height: 32px;
-moz-box-align: center;
}
toolbarbutton.chevron {
list-style-image: url("chrome://global/skin/icons/chevron.png");
margin: 1px 0 0;
--- a/browser/themes/shared/browser.inc.css
+++ b/browser/themes/shared/browser.inc.css
@@ -32,16 +32,30 @@
--toolbar-foreground-color: #0c0c0d;
}
%ifdef XP_WIN
}
%endif
%endif
%endif
+/* Bookmark toolbar */
+
+#navigator-toolbox > toolbar:not(#toolbar-menubar):not(#TabsToolbar):not(#nav-bar):not(#addon-bar) {
+ overflow: -moz-hidden-unscrollable;
+ max-height: 4em;
+ transition: min-height 170ms ease-out, max-height 170ms ease-out;
+ padding: 0 6px 2px;
+}
+
+#navigator-toolbox > toolbar:not(#toolbar-menubar):not(#TabsToolbar):not(#nav-bar):not(#addon-bar)[collapsed=true] {
+ min-height: 0.1px;
+ max-height: 0;
+ transition: min-height 170ms ease-out, max-height 170ms ease-out, visibility 170ms linear;
+}
/* Go button */
.urlbar-go-button {
padding: 0 3px;
list-style-image: url("chrome://browser/skin/reload-stop-go.png");
}
.urlbar-go-button {
--- a/browser/themes/shared/toolbarbuttons.inc.css
+++ b/browser/themes/shared/toolbarbuttons.inc.css
@@ -457,28 +457,28 @@ toolbarbutton.bookmark-item[open="true"]
#BMB_bookmarksPopup[side="right"] {
margin-top: -20px;
margin-bottom: -20px;
}
/* ::::: bookmark buttons ::::: */
toolbarbutton.bookmark-item:not(.subviewbutton) {
- margin: 0;
- padding: 2px 3px;
+ margin: 0 2px;
+ padding: 0 4px;
-moz-appearance: none;
}
.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,
#personal-bookmarks[cui-areatype="toolbar"] > #bookmarks-toolbar-placeholder > .toolbarbutton-text {
display: -moz-box !important;
}
#PlacesToolbarItems > .bookmark-item > .toolbarbutton-icon[label]:not([label=""]) {
- margin-inline-end: 5px;
+ margin-inline-end: 4px;
}
--- a/browser/themes/windows/browser.css
+++ b/browser/themes/windows/browser.css
@@ -151,29 +151,16 @@ toolbar[brighttext] {
background-image: none;
}
}
%endif
#navigator-toolbox > toolbar:not(#toolbar-menubar):not(#TabsToolbar):not(:-moz-lwtheme) {
background-color: -moz-Dialog;
}
-#navigator-toolbox > toolbar:not(#toolbar-menubar):not(#TabsToolbar):not(#nav-bar):not(#addon-bar) {
- overflow: -moz-hidden-unscrollable;
- max-height: 4em;
- transition: min-height 170ms ease-out, max-height 170ms ease-out;
- padding: 0 5px;
-}
-
-#navigator-toolbox > toolbar:not(#toolbar-menubar):not(#TabsToolbar):not(#nav-bar):not(#addon-bar)[collapsed=true] {
- min-height: 0.1px;
- max-height: 0;
- transition: min-height 170ms ease-out, max-height 170ms ease-out, visibility 170ms linear;
-}
-
#toolbar-menubar,
#TabsToolbar {
color: var(--titlebar-text-color);
}
@media (-moz-windows-compositor: 0),
(-moz-windows-default-theme: 0) {
/* Please keep the menu text colors in this media block in sync with
@@ -311,20 +298,16 @@ toolbar[brighttext] {
box-shadow: 0 1px 0 @toolbarHighlight@ inset;
}
@media (-moz-windows-compositor: 0) {
#TabsToolbar[collapsed="true"] + #nav-bar {
border-top-style: none !important;
}
}
-#personal-bookmarks {
- min-height: 24px;
-}
-
#print-preview-toolbar:not(:-moz-lwtheme) {
-moz-appearance: toolbox;
}
#browser-bottombox:not(:-moz-lwtheme) {
background-color: -moz-dialog;
}