Bug 449832 - Color mismatch between unified toolbar and selected tab after bug 439354, r=mconnor

browser/themes/pinstripe/browser/browser.css

@@ -60,7 +60,7 @@
 }
 
 #main-window:not([active="true"]) > #navigator-toolbox > #PersonalToolbar {
-  background-image: url("chrome://browser/skin/bookmark_toolbar_background-inactive.png");
+  background-color: -moz-mac-chrome-inactive;
 }
 
 #main-window:not([active="true"]) > #navigator-toolbox > toolbar > toolbaritem,
@@ -82,20 +82,8 @@
   color: #575757;
 }
 
-#main-window:not([active="true"]) .tabbrowser-tab[selected="true"] > .tab-image-middle,
-#main-window:not([active="true"]) .tabbrowser-tab[selected="true"] > .tab-closebutton,
-#main-window:not([active="true"]) .tabbrowser-tab[selected="true"] > .tab-close-button {
-  background-image: url("chrome://browser/skin/tabbrowser/tab-middle-inactive.png");
-}
-
-#main-window:not([active="true"]) .tabbrowser-tab[selected="true"] > .tab-image-left,
-#main-window:not([active="true"]) .tabbrowser-tab[selected="true"][chromedir="rtl"] > .tab-image-right {
-  background: url("chrome://browser/skin/tabbrowser/tab-left-inactive.png") no-repeat;
-}
-
-#main-window:not([active="true"]) .tabbrowser-tab[selected="true"] > .tab-image-right,
-#main-window:not([active="true"]) .tabbrowser-tab[selected="true"][chromedir="rtl"] > .tab-image-left {
-  background: url("chrome://browser/skin/tabbrowser/tab-right-inactive.png") no-repeat;
+#main-window:not([active="true"]) .tabbrowser-tab[selected="true"] {
+  background-color: -moz-mac-chrome-inactive;
 }
 
 /* ----- SEARCH FIELD ----- */
@@ -107,7 +95,7 @@
 /* ----- BOOKMARK TOOLBAR ----- */
 
 #PersonalToolbar {
-  background: url("chrome://browser/skin/bookmark_toolbar_background.gif") repeat-x center center;
+  background: url("chrome://browser/skin/bookmark_toolbar_background.png") repeat-x center center -moz-mac-chrome-active;
   border-top: 1px solid rgba(255,255,255,0.25);
   border-bottom: 2px solid;
   -moz-border-bottom-colors: rgba(0,0,0,0.35) transparent;
@@ -1615,7 +1603,7 @@ toolbarbutton.chevron > .toolbarbutton-menu-dropmarker {
 }
 
 .tab-icon {
-  margin: 0 0 4px 0;
+  margin: 0 0 3px 0;
   opacity: 0.6;
 }
 
@@ -1642,17 +1630,20 @@ toolbarbutton.chevron > .toolbarbutton-menu-dropmarker {
 .tabbrowser-tab {
   -moz-binding: url("chrome://browser/skin/browser.xml#tabbrowser-tab") !important;
   -moz-appearance: none;
+  -moz-border-radius: 0 0 3px 3px;
   color: #222;
   -moz-box-pack: center;
+  margin: 0 3px 3px 2px;
   padding: 0px;
   border: none !important;
   min-width: 1px !important;
   text-align: center;
-  height: 27px;
+  height: 22px;
 }
 
 .tabbrowser-tab[selected="true"] {
   -moz-user-focus: normal;
+  background-color: -moz-mac-chrome-active;
 }
 
 .tabbrowser-tab[selected="true"]:focus > .tab-image-middle > .tab-text-stack > .tab-text {
@@ -1673,8 +1664,17 @@ toolbarbutton.chevron > .toolbarbutton-menu-dropmarker {
   padding: 0px;
 }
 
+.tab-image-left,
+.tab-image-right,
+.tabbrowser-tab > .tab-image-middle,
+.tabbrowser-tab > .tab-close-button {
+  margin-bottom: -3px;
+  padding-top: 1px;
+}
+
 .tabbrowser-tab > .tab-image-right,
 .tabbrowser-tab[chromedir="rtl"] > .tab-image-left {
+  margin-right: -3px;
   background: url("chrome://browser/skin/tabbrowser/tab-right.png") no-repeat;
 }
 
@@ -1685,6 +1685,7 @@ toolbarbutton.chevron > .toolbarbutton-menu-dropmarker {
 
 .tabbrowser-tab > .tab-image-left,
 .tabbrowser-tab[chromedir="rtl"] > .tab-image-right {
+  margin-left: -2px;
   background: url("chrome://browser/skin/tabbrowser/tab-left.png") no-repeat;
 }
 
@@ -1694,7 +1695,7 @@ toolbarbutton.chevron > .toolbarbutton-menu-dropmarker {
 }
 
 .tabbrowser-tab > .tab-image-middle,
-.tabbrowser-tab > .tab-closebutton {
+.tabbrowser-tab > .tab-close-button {
   background: url("chrome://browser/skin/tabbrowser/tab-middle.png") repeat-x;
   -moz-box-pack: center;
 }
@@ -1708,16 +1709,6 @@ toolbarbutton.chevron > .toolbarbutton-menu-dropmarker {
   list-style-image: url("chrome://global/skin/tree/item-grayscale.png");
 }
 
-.tabs-closebutton {
-  margin: 0;
-  list-style-image: url("chrome://global/skin/icons/closetab.png") !important;
-}
-
-.tabs-closebutton:hover:active {
-  list-style-image: url("chrome://global/skin/icons/closetab-active.png") !important;
-  border: none !important;
-}
-
 .tabbrowser-strip {
   margin-top: -1px;
   border-bottom: 1px solid #404040;
@@ -1729,7 +1720,8 @@ toolbarbutton.chevron > .toolbarbutton-menu-dropmarker {
   -moz-box-pack: center;
   -moz-box-align: center;
   background: url("chrome://browser/skin/tabbrowser/tabbrowser-tabs-bkgnd.png") repeat-x;
-  height: 27px;
+  height: 25px;
+  margin-bottom: 0;
 }
 
 .tabs-left {
@@ -1778,7 +1770,7 @@ tabbrowser > tabbox > tabpanels {
   list-style-image: url("chrome://global/skin/icons/closetab.png");
   -moz-appearance: none;
   border: none !important;
-  padding: 0 0 4px 0;
+  padding: 0 0 3px 0;
   margin: 0;
   background: inherit;
   cursor: default;
@@ -1794,21 +1786,12 @@ tabbrowser > tabbox > tabpanels {
   list-style-image: url("chrome://global/skin/icons/closetab-active.png");
 }
 
-.tabbrowser-tab > .tab-close-button {
-  background-image: url("chrome://browser/skin/tabbrowser/tab-middle.png");
-  background-repeat: repeat-x;
-}
-
 .tabbrowser-tab[selected="true"] > .tab-close-button {
   /* Make this button focusable so clicking on it will not focus the tab while
      it's getting closed */
   -moz-user-focus: normal;
 }
 
-.tabbrowser-tab:not([selected="true"]) > .tab-close-button {
-  background-image: url("chrome://browser/skin/tabbrowser/tab-middle-bkgnd.png");
-}
-
 .tabbrowser-arrowscrollbox > .scrollbutton-up,
 .tabbrowser-arrowscrollbox > .scrollbutton-down-stack > .scrollbutton-down[chromedir="rtl"] {
   border: 0;
@@ -1885,8 +1868,7 @@ tabbrowser > tabbox > tabpanels {
   -moz-border-left-colors: rgba(0,0,0,0.25) rgba(255,255,255,0.15);
   -moz-border-right-colors: rgba(0,0,0,0.25) rgba(255,255,255,0.15);
   margin: 0;
-  padding-left: 0;
-  padding-right: 0;
+  padding: 2px 0 0 0;
 }
 .tabs-alltabs-button:hover {
   background-color: rgba(0,0,0,0.10);

browser/themes/pinstripe/browser/jar.mn

@@ -1,7 +1,6 @@
 classic.jar:
 % skin browser classic/1.0 %skin/classic/browser/
-  skin/classic/browser/bookmark_toolbar_background.gif
-  skin/classic/browser/bookmark_toolbar_background-inactive.png
+  skin/classic/browser/bookmark_toolbar_background.png
   skin/classic/browser/bookmark-open-left.png
   skin/classic/browser/bookmark-open-mid.png
   skin/classic/browser/bookmark-open-right.png
@@ -129,16 +128,10 @@ classic.jar:
   skin/classic/browser/tabbrowser/tabDragIndicator.png                   (tabbrowser/tabDragIndicator.png)
   skin/classic/browser/tabbrowser/tab-left.png                           (tabbrowser/tab-left.png)
   skin/classic/browser/tabbrowser/tab-left-bkgnd.png                     (tabbrowser/tab-left-bkgnd.png)
-  skin/classic/browser/tabbrowser/tab-left-hover.png                     (tabbrowser/tab-left-hover.png)
-  skin/classic/browser/tabbrowser/tab-left-inactive.png                  (tabbrowser/tab-left-inactive.png)
   skin/classic/browser/tabbrowser/tab-middle.png                         (tabbrowser/tab-middle.png)
   skin/classic/browser/tabbrowser/tab-middle-bkgnd.png                   (tabbrowser/tab-middle-bkgnd.png)
-  skin/classic/browser/tabbrowser/tab-middle-hover.png                   (tabbrowser/tab-middle-hover.png)
-  skin/classic/browser/tabbrowser/tab-middle-inactive.png                (tabbrowser/tab-middle-inactive.png)
   skin/classic/browser/tabbrowser/tab-right.png                          (tabbrowser/tab-right.png)
   skin/classic/browser/tabbrowser/tab-right-bkgnd.png                    (tabbrowser/tab-right-bkgnd.png)
-  skin/classic/browser/tabbrowser/tab-right-hover.png                    (tabbrowser/tab-right-hover.png)
-  skin/classic/browser/tabbrowser/tab-right-inactive.png                 (tabbrowser/tab-right-inactive.png)
   skin/classic/browser/tabbrowser/tabs-bottom-bg.png                     (tabbrowser/tabs-bottom-bg.png)
   skin/classic/browser/urlbar/endcap.png                                 (urlbar/endcap.png)
   skin/classic/browser/urlbar/endcap-rtl.png                             (urlbar/endcap-rtl.png)