From fc9dbdbfc2fd2abf84a489a28d2fa68e70a9b6f6 Mon Sep 17 00:00:00 2001 From: QNetITQ <85301851+QNetITQ@users.noreply.github.com> Date: Thu, 14 Nov 2024 22:05:24 +0300 Subject: [PATCH] Update Experimental.css --- .../modules/horizontal_tabs/Experimental.css | 205 ++++++++++++++++++ 1 file changed, 205 insertions(+) diff --git a/chrome/modules/horizontal_tabs/Experimental.css b/chrome/modules/horizontal_tabs/Experimental.css index 639e049e..f2701395 100644 --- a/chrome/modules/horizontal_tabs/Experimental.css +++ b/chrome/modules/horizontal_tabs/Experimental.css @@ -148,10 +148,212 @@ /* ---------------------------------------- Attached tabs ---------------------------------------- */ +@media (-moz-bool-pref: "userChrome.Tabs.Option4.Enabled") or + (-moz-bool-pref: "userChrome.Tabs.Option5.Enabled") or + (-moz-bool-pref: "userChrome.Tabs.Option6.Enabled") or + (-moz-bool-pref: "userChrome.Tabs.Option7.Enabled") or + (-moz-bool-pref: "userChrome.Tabs.Option8.Enabled") or + (-moz-bool-pref: "userChrome.Tabs.Option9.Enabled") or + (-moz-bool-pref: "userChrome.Tabs.Option10.Enabled") or + (-moz-bool-pref: "userChrome.Tabs.Option11.Enabled") +{ + + +/* ---------------------------------------- Tabs ---------------------------------------- */ + +:root +{ + @media (-moz-bool-pref: "userChrome.Tabs.Option4.Enabled") + { + --tab-first-last-inline-margin: calc(var(--tab-min-height) / 4); + } + + @media (-moz-bool-pref: "userChrome.Tabs.Option5.Enabled") + { + --tab-first-last-inline-margin: calc(var(--tab-min-height) / 4); + } + + @media (-moz-bool-pref: "userChrome.Tabs.Option6.Enabled") + { + --tab-first-last-inline-margin: calc(var(--tab-min-height) / 4); + } + + @media (-moz-bool-pref: "userChrome.Tabs.Option7.Enabled") + { + --tab-first-last-inline-margin: calc(var(--tab-min-height) / 2 - 6px); + } + + @media (-moz-bool-pref: "userChrome.Tabs.Option8.Enabled") + { + --tab-first-last-inline-margin: calc(var(--tab-min-height) / 2); + } + + @media (-moz-bool-pref: "userChrome.Tabs.Option9.Enabled") + { + --tab-first-last-inline-margin: calc(var(--tab-min-height) / 2); + } + + @media (-moz-bool-pref: "userChrome.Tabs.Option10.Enabled") + { + --tab-first-last-inline-margin: calc(var(--tab-min-height) / 2); + } + + @media (-moz-bool-pref: "userChrome.Tabs.Option11.Enabled") + { + --tab-first-last-inline-margin: calc(var(--tab-min-height) / 2); + } + + /* -------------------- Attached Tabs -------------------- */ + + @media (-moz-bool-pref: "userChrome.Tabs.Option6.Enabled") or + (-moz-bool-pref: "userChrome.Tabs.Option7.Enabled") or + (-moz-bool-pref: "userChrome.Tabs.Option8.Enabled") or + (-moz-bool-pref: "userChrome.Tabs.Option9.Enabled") or + (-moz-bool-pref: "userChrome.Tabs.Option10.Enabled") or + (-moz-bool-pref: "userChrome.Tabs.Option11.Enabled") or + (-moz-bool-pref: "userChrome.Tabs.Option12.Enabled") or + (-moz-bool-pref: "userChrome.Tabs.Option13.Enabled") + { + --tab-scroll-animation-inline-margin: calc(-1 * var(--tab-first-last-inline-margin)); + --tab-scroll-animation-inline-padding: var(--tab-first-last-inline-margin); + --tab-bg-block-margin: 0px; + --my-tab-inline-padding: 0px; + --tab-separator-offset: 0px; + --pinned-tabs-width-offset: 2px; + } +} + +/* ---------------------------------------- Main Window ---------------------------------------- */ + +:root +{ + --tab-shadow-max-size: 0px !important; + --tab-attention-indicator-position: 50% calc(50% + 12px); + --tabstrip-min-height: auto !important; +} + +/* ---------------------------------------- Nav Bar ---------------------------------------- */ + +#nav-bar +{ + border: none !important; +} + +/* ---------------------------------------- Tabs ---------------------------------------- */ + +.tabbrowser-tab +{ + overflow-clip-margin: var(--tab-min-height) !important; + padding-inline: var(--my-tab-inline-padding) !important; + + &[visuallyselected] + { + color: var(--toolbar-color) !important; + position: relative; + z-index: 2 !important; + + .tab-background + { + background-color: var(--toolbar-bgcolor) !important; + } + } + + &:not([visuallyselected]) + { + color: inherit !important; + + #tabbrowser-tabs[movingtab] & + { + z-index: 0 !important; + } + } + + .tab-background + { + mask-image: var(--left-svg), var(--center-svg), var(--right-svg); + mask-size: auto 100%, calc(100% - var(--tab-min-height) * 2) 100%, auto 100%; + mask-position: left center, center center, right center; + mask-repeat: no-repeat, no-repeat, no-repeat; + box-shadow: none !important; + outline: none !important; + margin-block: var(--tab-bg-block-margin) !important; + margin-inline: calc(-1 * (var(--tab-min-height) / 2)) !important; + border-radius: 0px !important; + pointer-events: none !important; + } +} + +#tabbrowser-tabs[overflow] .tab-drop-indicator +{ + inset-inline-start: var(--tab-first-last-inline-margin) !important; +} + +/* -------------------- Container Indicators -------------------- */ + +.tab-context-line +{ + margin: 0px !important; +} + +/* -------------------- Tab Icon Indicators -------------------- */ + +.tabbrowser-tab:is([image], [pinned]) .tab-content[attention]:not([selected]), +.tab-content[pinned][titlechanged]:not([selected]) +{ + background-position: var(--tab-attention-indicator-position) !important; +} + +/* ---------------------------------------- Tab Bar ---------------------------------------- */ +#TabsToolbar #search-container +{ + padding-block: 0 !important; +} + +/* ---------------------------------------- Indents ---------------------------------------- */ + +#tabbrowser-tabs:not([overflow]) .tabbrowser-tab:nth-child(1 of .tabbrowser-tab:not([hidden])), +#tabbrowser-tabs[overflow] .tabbrowser-tab:nth-child(1 of .tabbrowser-tab:not([pinned], [hidden])), +#tabbrowser-tabs[overflow][haspinnedtabs] +{ + margin-inline-start: var(--tab-first-last-inline-margin) !important; +} + +.tabbrowser-tab:nth-last-child(1 of .tabbrowser-tab:not([hidden])) +{ + margin-inline-end: var(--tab-first-last-inline-margin) !important; +} + +/* ---------------------------------------- Tab Scroll Animation ---------------------------------------- */ + +#tabbrowser-tabs[overflow] .tabbrowser-tab:not([pinned]) +{ + box-sizing: content-box !important; +} +#tabbrowser-tabs[overflow]:not([movingtab]) .tabbrowser-tab:not([pinned]) +{ + pointer-events: none !important; + box-sizing: content-box !important; + padding-inline: var(--tab-scroll-animation-inline-padding) !important; + margin-inline: var(--tab-scroll-animation-inline-margin) !important; + overflow-clip-margin: 0px !important; +} +#tabbrowser-tabs[overflow]:not([movingtab]) .tabbrowser-tab:not([pinned]) .tab-stack +{ + pointer-events: auto !important; +} +#tabbrowser-tabs[overflow]:not([movingtab]) .tabbrowser-tab:nth-child(1 of .tabbrowser-tab:not([pinned], [hidden])) +{ + margin-inline-start: 0px !important; +} + +#tabbrowser-tabs[overflow]:not([movingtab]) .tabbrowser-tab:nth-last-child(1 of .tabbrowser-tab:not([hidden])) +{ + margin-inline-end: 0px !important; +} @@ -165,3 +367,6 @@ + + +}