Bug 1387413 - Make pinned tabs 40px wide. r?johannh
MozReview-Commit-ID: ELrYItAvmf
--- a/browser/base/content/tabbrowser.xml
+++ b/browser/base/content/tabbrowser.xml
@@ -7340,17 +7340,17 @@
class="tab-throbber"
role="presentation"
layer="true" />
<xul:image xbl:inherits="src=image,loadingprincipal=iconLoadingPrincipal,fadein,pinned,selected=visuallyselected,busy,crashed,sharing"
anonid="tab-icon-image"
class="tab-icon-image"
validate="never"
role="presentation"/>
- <xul:image xbl:inherits="sharing,selected=visuallyselected"
+ <xul:image xbl:inherits="sharing,selected=visuallyselected,pinned"
anonid="sharing-icon"
class="tab-sharing-icon-overlay"
role="presentation"/>
<xul:image xbl:inherits="crashed,busy,soundplaying,soundplaying-scheduledremoval,pinned,muted,blocked,selected=visuallyselected,activemedia-blocked"
anonid="overlay-icon"
class="tab-icon-overlay"
role="presentation"/>
<xul:hbox class="tab-label-container"
--- a/browser/themes/shared/tabs.inc.css
+++ b/browser/themes/shared/tabs.inc.css
@@ -44,37 +44,41 @@
/* The selected tab should appear above the border between the tabs toolbar and
the navigation toolbar. */
.tabbrowser-tab[visuallyselected=true] {
position: relative;
z-index: 2;
}
.tab-content {
- padding-inline-end: 9px;
- padding-inline-start: 9px;
+ padding: 0 9px;
}
.tab-content[pinned] {
- padding-inline-end: 3px;
+ padding: 0 12px;
}
.tab-throbber,
.tab-icon-image,
.tab-sharing-icon-overlay,
.tab-icon-sound,
.tab-close-button {
margin-top: 1px;
}
.tab-throbber,
.tab-sharing-icon-overlay,
.tab-icon-image {
height: 16px;
width: 16px;
+}
+
+.tab-throbber:not([pinned]),
+.tab-sharing-icon-overlay:not([pinned]),
+.tab-icon-image:not([pinned]) {
margin-inline-end: 6px;
}
.tab-icon-image {
list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.svg");
}
.tab-icon-image[src^="chrome://"] {
@@ -104,16 +108,20 @@
.tab-sharing-icon-overlay {
/* 16px of the icon + 6px of margin-inline-end of .tab-icon-image */
margin-inline-start: -22px;
position: relative;
-moz-context-properties: fill;
fill: rgb(224, 41, 29);
}
+.tab-sharing-icon-overlay[pinned] {
+ margin-inline-start: -16px;
+}
+
.tab-sharing-icon-overlay[sharing="camera"] {
list-style-image: url("chrome://browser/skin/notification-icons.svg#camera-sharing");
}
.tab-sharing-icon-overlay[sharing="microphone"] {
list-style-image: url("chrome://browser/skin/notification-icons.svg#microphone-sharing");
}