Bug 1300410 - Make positioned pinned tab separators not touch the toolbar. r=gijs
authorDão Gottwald <dao@mozilla.com>
Wed, 07 Sep 2016 08:15:59 +0200
changeset 312951 038c1f5864efc441eddd5d43f8d06791e272e3e0
parent 312950 25f7b5f0dee36a87199838939d63d6acf8935abd
child 312952 d5def12cf1f8b8a2077a95cadcae3aa47c4f4faf
push id30665
push usercbook@mozilla.com
push dateWed, 07 Sep 2016 15:20:43 +0000
treeherdermozilla-central@95acb9299faf [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersgijs
bugs1300410
milestone51.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1300410 - Make positioned pinned tab separators not touch the toolbar. r=gijs
browser/themes/shared/tabs.inc.css
--- a/browser/themes/shared/tabs.inc.css
+++ b/browser/themes/shared/tabs.inc.css
@@ -435,20 +435,26 @@
 .tab-label[attention]:not([selected="true"]) {
   font-weight: bold;
 }
 
 /* Tab separators */
 
 .tabbrowser-tab::after,
 .tabbrowser-tab::before {
-  margin-top: 5px;
-  margin-bottom: 4px;
   margin-inline-start: -1px;
-  border-left: 1px solid currentColor;
+  /* Vertical margin doesn't work here for positioned pinned tabs, see
+     bug 1198236 and bug 1300410. We're using linear-gradient instead
+     to cut off the border at the top and at the bottom. */
+  border-left: 1px solid;
+  border-image: linear-gradient(transparent 6px,
+                                currentColor 6px,
+                                currentColor calc(100% - 5px),
+                                transparent calc(100% - 5px));
+  border-image-slice: 1;
   opacity: 0.2;
 }
 
 #TabsToolbar[brighttext] > #tabbrowser-tabs > .tabbrowser-tab::before,
 #TabsToolbar[brighttext] > #tabbrowser-tabs > .tabbrowser-tab::after {
   opacity: 0.4;
 }