forked from ZenBrowserMirrors/zen-desktop
154 lines
5.3 KiB
C++
154 lines
5.3 KiB
C++
diff --git a/browser/themes/shared/tabbrowser/tabs.css b/browser/themes/shared/tabbrowser/tabs.css
|
|
index 5b9ad123d819c6ef068acd427416957a1d0939fe..311caa27ee268c95215d459be02a93d20e129f8b 100644
|
|
--- a/browser/themes/shared/tabbrowser/tabs.css
|
|
+++ b/browser/themes/shared/tabbrowser/tabs.css
|
|
@@ -33,7 +33,7 @@
|
|
--tab-block-margin: 4px;
|
|
--tab-icon-end-margin: 5.5px;
|
|
--tab-label-line-height: 1.7;
|
|
- --tab-loading-fill: #0A84FF;
|
|
+ --tab-loading-fill: var(--zen-primary-color);
|
|
--tab-hover-background-color: color-mix(in srgb, currentColor 11%, transparent);
|
|
--tab-selected-textcolor: var(--toolbar-color);
|
|
--tab-selected-bgcolor: var(--toolbar-bgcolor);
|
|
@@ -211,8 +211,7 @@
|
|
}
|
|
|
|
#tabbrowser-tabs[positionpinnedtabs] > #tabbrowser-arrowscrollbox > &[pinned] {
|
|
- position: absolute !important;
|
|
- display: block;
|
|
+
|
|
}
|
|
|
|
#tabbrowser-tabs[movingtab] &:is(:active, [multiselected]) {
|
|
@@ -258,7 +257,6 @@
|
|
}
|
|
|
|
:root:not([uidensity=compact], [sidebar-expand-on-hover]) &[pinned] {
|
|
- padding: 0 10px;
|
|
}
|
|
|
|
&:is([selected], [multiselected]) {
|
|
@@ -272,6 +270,7 @@
|
|
border-radius: inherit;
|
|
position: relative;
|
|
overflow: hidden;
|
|
+ display: none;
|
|
|
|
&::before {
|
|
position: absolute;
|
|
@@ -459,14 +458,11 @@
|
|
.tab-icon-image {
|
|
-moz-context-properties: fill, stroke;
|
|
fill: currentColor;
|
|
+ border-radius: 4px;
|
|
|
|
/* stylelint-disable-next-line media-query-no-invalid */
|
|
@media -moz-pref("browser.tabs.fadeOutUnloadedTabs") {
|
|
&[pending] {
|
|
- filter: grayscale(100%);
|
|
- @media (prefers-color-scheme: dark) {
|
|
- filter: grayscale(100%) invert();
|
|
- }
|
|
opacity: 0.5;
|
|
/* Fade the favicon out */
|
|
transition-property: filter, opacity;
|
|
@@ -483,10 +479,6 @@
|
|
/* stylelint-disable-next-line media-query-no-invalid */
|
|
@media -moz-pref("browser.tabs.fadeOutExplicitlyUnloadedTabs") {
|
|
&[pending][discarded] {
|
|
- filter: grayscale(100%);
|
|
- @media (prefers-color-scheme: dark) {
|
|
- filter: grayscale(100%) invert();
|
|
- }
|
|
opacity: 0.5;
|
|
/* Fade the favicon out */
|
|
transition-property: filter, opacity;
|
|
@@ -559,7 +551,7 @@
|
|
z-index: 1; /* Overlay tab title */
|
|
|
|
#tabbrowser-tabs[orient=vertical] & {
|
|
- top: 7px;
|
|
+ top: -7px;
|
|
}
|
|
|
|
&[crashed] {
|
|
@@ -567,7 +559,7 @@
|
|
}
|
|
|
|
#tabbrowser-tabs[orient="vertical"]:not([expanded]) &:not([crashed]),
|
|
- &[pinned]:not([crashed]) {
|
|
+ &:not([crashed]) {
|
|
&[soundplaying] {
|
|
list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-playing-small.svg");
|
|
}
|
|
@@ -597,7 +589,7 @@
|
|
background-image: linear-gradient(var(--audio-overlay-extra-background)),
|
|
linear-gradient(var(--toolbox-bgcolor));
|
|
-moz-context-properties: fill;
|
|
- fill: var(--tab-selected-textcolor);
|
|
+ fill: var(--tab-selected-textcolor) !important;
|
|
color-scheme: var(--tab-selected-color-scheme);
|
|
border-radius: var(--border-radius-circle);
|
|
|
|
@@ -1365,7 +1357,7 @@ tab-group {
|
|
}
|
|
}
|
|
|
|
-#tabbrowser-arrowscrollbox[orient="vertical"] > #tabbrowser-arrowscrollbox-periphery > #tabs-newtab-button,
|
|
+#tabbrowser-arrowscrollbox[orient="vertical"] #tabbrowser-arrowscrollbox-periphery > #tabs-newtab-button,
|
|
#vertical-tabs-newtab-button {
|
|
appearance: none;
|
|
min-height: var(--tab-min-height);
|
|
@@ -1376,7 +1368,7 @@ tab-group {
|
|
margin-inline: var(--tab-inner-inline-margin);
|
|
|
|
#tabbrowser-tabs[orient="vertical"]:not([expanded]) & > .toolbarbutton-text {
|
|
- display: none;
|
|
+ display: flex;
|
|
}
|
|
|
|
&:hover {
|
|
@@ -1400,7 +1392,7 @@ tab-group {
|
|
* flex container. #tabs-newtab-button is a child of the arrowscrollbox where
|
|
* we don't want a gap (between tabs), so we have to add some margin.
|
|
*/
|
|
-#tabbrowser-arrowscrollbox[orient="vertical"] > #tabbrowser-arrowscrollbox-periphery > #tabs-newtab-button {
|
|
+#tabbrowser-arrowscrollbox[orient="vertical"] #tabbrowser-arrowscrollbox-periphery > #tabs-newtab-button {
|
|
margin-block: var(--tab-block-margin);
|
|
}
|
|
|
|
@@ -1474,8 +1466,6 @@ tab-group {
|
|
}
|
|
|
|
:root:not([sidebar-expand-on-hover]) & {
|
|
- --tab-inline-padding: calc((var(--tab-collapsed-background-width) + 2 *
|
|
- var(--tab-pinned-margin-inline-expanded) - var(--icon-size-default)) / 2);
|
|
/* stylelint-disable-next-line media-query-no-invalid */
|
|
@media not -moz-pref("sidebar.visibility", "expand-on-hover") {
|
|
/* We need these rules to apply at all times when the sidebar.visibility
|
|
@@ -1585,7 +1575,6 @@ tab-group {
|
|
|
|
&:not([expanded]) {
|
|
.tabbrowser-tab[pinned] {
|
|
- width: var(--tab-collapsed-width);
|
|
}
|
|
|
|
.tab-background {
|
|
@@ -1716,7 +1705,7 @@ tab-group {
|
|
toolbarbutton:not(#firefox-view-button),
|
|
toolbarpaletteitem:not(#wrapper-firefox-view-button)
|
|
) ~ #tabbrowser-tabs {
|
|
- border-inline-start: var(--tabstrip-inner-border);
|
|
+ border-inline-start: transparent;
|
|
padding-inline-start: calc(var(--tab-overflow-pinned-tabs-width) + 2px);
|
|
margin-inline-start: 2px;
|
|
}
|
|
@@ -1750,7 +1739,6 @@ toolbar:not(#TabsToolbar) #firefox-view-button {
|
|
list-style-image: url(chrome://global/skin/icons/plus.svg);
|
|
}
|
|
|
|
-#tabbrowser-tabs[hasadjacentnewtabbutton]:not([overflow]) ~ #new-tab-button,
|
|
#tabbrowser-tabs[orient="horizontal"] > #vertical-tabs-newtab-button,
|
|
#tabbrowser-tabs[orient="vertical"]:not([overflow]) > #vertical-tabs-newtab-button,
|
|
#tabbrowser-arrowscrollbox[overflowing] > #tabbrowser-arrowscrollbox-periphery > #tabs-newtab-button,
|