Bug 1403483 - Set a border on the first tab instead of at the end of the pre-tabs drag space. r=dao
MozReview-Commit-ID: 8QeKUYeW7mI
--- a/browser/themes/shared/tabs.inc.css
+++ b/browser/themes/shared/tabs.inc.css
@@ -546,21 +546,16 @@ tabbrowser {
/* Tab separators */
.titlebar-placeholder[type="pre-tabs"],
.titlebar-placeholder[type="post-tabs"] {
width: 40px;
}
-.titlebar-placeholder[type="pre-tabs"] {
- border-inline-end: 1px solid;
- opacity: 0.2;
-}
-
.tabbrowser-tab::after,
.tabbrowser-tab::before {
border-left: 1px solid;
/* 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-image: linear-gradient(transparent 6px,
currentColor 6px,
@@ -598,16 +593,17 @@ tabbrowser {
border-image: linear-gradient(transparent 1px,
var(--tabs-border) 1px,
var(--tabs-border) calc(100% - 1px - var(--tab-toolbar-navbar-overlap)),
transparent calc(100% - 1px - var(--tab-toolbar-navbar-overlap))) 1 !important;
opacity: 1;
}
.tabbrowser-tab:not([first-visible-tab])::before,
+#main-window:not([inFullscreen]) #tabbrowser-tabs:not([overflow]) .tabbrowser-tab[first-visible-tab]::before,
#tabbrowser-tabs:not([overflow]):not([movingtab]) > .tabbrowser-tab[last-visible-tab]::after,
/* Also show separators beside the selected tab when dragging it. */
#tabbrowser-tabs[movingtab] > .tabbrowser-tab[visuallyselected]::after {
content: "";
display: -moz-box;
}
/* Tab bar scroll arrows */
--- a/browser/themes/windows/browser.css
+++ b/browser/themes/windows/browser.css
@@ -777,16 +777,21 @@ html|span.ac-emphasize-text-url {
#TabsToolbar {
min-height: 0;
padding: 0;
margin-bottom: calc(-1 * var(--tab-toolbar-navbar-overlap)); /* overlap the nav-bar's top border */
}
%include ../shared/tabs.inc.css
+/* Don't show the starting border of the first tab when maximized */
+:root:not([sizemode="normal"]) .tabbrowser-tab[first-visible-tab]::before {
+ border: none;
+}
+
/* tabbrowser-tab focus ring */
.tabbrowser-tab:focus > .tab-stack > .tab-content {
outline: 1px dotted;
outline-offset: -6px;
}
/* Tab DnD indicator */
.tab-drop-indicator {