From f2307cfc7a5889c282ccc97d9cfb2eaaca31698b Mon Sep 17 00:00:00 2001 From: QNetITQ <85301851+QNetITQ@users.noreply.github.com> Date: Wed, 16 Oct 2024 20:44:36 +0300 Subject: [PATCH 01/35] Update wavefox_tabs.css --- .../modules/horizontal_tabs/wavefox_tabs.css | 18 ++++++------------ 1 file changed, 6 insertions(+), 12 deletions(-) diff --git a/chrome/modules/horizontal_tabs/wavefox_tabs.css b/chrome/modules/horizontal_tabs/wavefox_tabs.css index e4981d16..e2ebeea0 100644 --- a/chrome/modules/horizontal_tabs/wavefox_tabs.css +++ b/chrome/modules/horizontal_tabs/wavefox_tabs.css @@ -97,22 +97,16 @@ :root[tabsintitlebar] { - #titlebar - { - will-change: auto !important; - transition: none !important; - opacity: 1 !important; - } - - .titlebar-color + .browser-titlebar { will-change: auto !important; transition: color var(--inactive-window-transition) !important; - } - &:-moz-window-inactive .titlebar-color - { - color: color-mix(in srgb, currentColor calc(var(--inactive-titlebar-opacity) * 100%), transparent) !important; + &:-moz-window-inactive + { + color: color-mix(in srgb, currentColor calc(var(--inactive-titlebar-opacity) * 100%), transparent) !important; + opacity: 1 !important; + } } } From a5fac2eceae5cbb55203a465a0f41c638830c24c Mon Sep 17 00:00:00 2001 From: QNetITQ <85301851+QNetITQ@users.noreply.github.com> Date: Wed, 16 Oct 2024 21:43:53 +0300 Subject: [PATCH 02/35] Update wavefox_tabs_on_bottom.css --- .../wavefox_tabs_on_bottom.css | 24 +++++++++++++------ 1 file changed, 17 insertions(+), 7 deletions(-) diff --git a/chrome/modules/horizontal_tabs/wavefox_tabs_on_bottom.css b/chrome/modules/horizontal_tabs/wavefox_tabs_on_bottom.css index c0e87417..62601c32 100644 --- a/chrome/modules/horizontal_tabs/wavefox_tabs_on_bottom.css +++ b/chrome/modules/horizontal_tabs/wavefox_tabs_on_bottom.css @@ -2,17 +2,15 @@ { /* -------------------- Title Bar -------------------- */ - #titlebar + #TabsToolbar { - order: 2 !important; + order: 4 !important; } #toolbar-menubar { - --toolbarbutton-icon-fill: inherit !important; - background-color: var(--toolbar-bgcolor) !important; - color: var(--toolbar-color) !important; appearance: none !important; + order: 0 !important; } #TabsToolbar::before @@ -24,14 +22,14 @@ #nav-bar { - order: 0 !important; + order: 1 !important; } /* -------------------- Personal Bar -------------------- */ #PersonalToolbar { - order: 1 !important; + order: 3 !important; } /* -------------------- Tabs -------------------- */ @@ -45,4 +43,16 @@ { transform: rotateX(180deg); } + + /* -------------------- Window Control Buttons -------------------- */ + + #toolbar-menubar[inactive] ~ #nav-bar > :is(.titlebar-buttonbox-container) + { + display: block !important; + } + + #toolbar-menubar[inactive] ~ #TabsToolbar > :is(.titlebar-buttonbox-container, .titlebar-spacer) + { + display: none !important; + } } From c5db380f10d49e30a9d6be9167b3ec94cda5419c Mon Sep 17 00:00:00 2001 From: QNetITQ <85301851+QNetITQ@users.noreply.github.com> Date: Wed, 16 Oct 2024 22:12:21 +0300 Subject: [PATCH 03/35] Update wavefox_one_line.css --- .../horizontal_tabs/wavefox_one_line.css | 20 ++++++++++++++----- 1 file changed, 15 insertions(+), 5 deletions(-) diff --git a/chrome/modules/horizontal_tabs/wavefox_one_line.css b/chrome/modules/horizontal_tabs/wavefox_one_line.css index 716ce882..5ed750cf 100644 --- a/chrome/modules/horizontal_tabs/wavefox_one_line.css +++ b/chrome/modules/horizontal_tabs/wavefox_one_line.css @@ -8,9 +8,14 @@ grid-template-columns: auto minmax(auto, 0%) !important; } - #titlebar + #TabsToolbar { - grid-area: 1 / 1 / span 1 / span 1 !important; + grid-area: 2 / 1 / span 2 / span 1 !important; + } + + #nav-bar + { + grid-area: 2 / 2 / span 2 / span 2 !important; } } @@ -20,10 +25,15 @@ { grid-template-columns: minmax(auto, 0%) auto !important; } + + #TabsToolbar + { + grid-area: 2 / 2 / span 2 / span 2 !important; + } #nav-bar { - grid-area: 1 / 1 / span 1 / span 1 !important; + grid-area: 2 / 1 / span 2 / span 1 !important; } } @@ -58,9 +68,9 @@ /* -------------------- Bookmarks Bar / Notifications -------------------- */ - #navigator-toolbox > *:not(#titlebar, #nav-bar) + #navigator-toolbox > *:not(#TabsToolbar, #nav-bar) { - grid-column: 1 / span 2 !important; + grid-column: 1 / span 3 !important; } /* -------------------- Customization -------------------- */ From 028e14e28a0058ca6621dffc8994b1e9fdfc9dd6 Mon Sep 17 00:00:00 2001 From: QNetITQ <85301851+QNetITQ@users.noreply.github.com> Date: Wed, 16 Oct 2024 22:14:03 +0300 Subject: [PATCH 04/35] Update README.md --- README.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index c87ec2d0..2e30129f 100644 --- a/README.md +++ b/README.md @@ -9,10 +9,10 @@ [Download Firefox](https://www.mozilla.org/en-US/firefox/all/#product-desktop-release) / [Download WaveFox](https://github.com/QNetITQ/WaveFox/releases) / [WaveFox Nightly](https://github.com/QNetITQ/WaveFox/tree/WaveFox-Nightly)
- WaveFox v1.7.132 + WaveFox v1.7.133 - ##### Minimum Requirements - - Firefox 132 + - Firefox 133 - Windows / MacOS / Linux - Download the `chrome` folder and put it in your user profile folder From ad53b4353cbc38142b05b534d213d75c6749f1af Mon Sep 17 00:00:00 2001 From: QNetITQ <85301851+QNetITQ@users.noreply.github.com> Date: Fri, 18 Oct 2024 12:58:36 +0300 Subject: [PATCH 05/35] Update wavefox_tabs_on_bottom.css --- .../horizontal_tabs/wavefox_tabs_on_bottom.css | 14 +++++++++----- 1 file changed, 9 insertions(+), 5 deletions(-) diff --git a/chrome/modules/horizontal_tabs/wavefox_tabs_on_bottom.css b/chrome/modules/horizontal_tabs/wavefox_tabs_on_bottom.css index 62601c32..3ab562e9 100644 --- a/chrome/modules/horizontal_tabs/wavefox_tabs_on_bottom.css +++ b/chrome/modules/horizontal_tabs/wavefox_tabs_on_bottom.css @@ -4,13 +4,17 @@ #TabsToolbar { - order: 4 !important; + order: 3 !important; } #toolbar-menubar { - appearance: none !important; order: 0 !important; + background-color: var(--toolbar-bgcolor) !important; + color: var(--toolbar-color) !important; + --toolbarbutton-icon-fill: inherit !important; + --toolbarbutton-hover-background: inherit !important; + --toolbarbutton-active-background: inherit !important; } #TabsToolbar::before @@ -29,7 +33,7 @@ #PersonalToolbar { - order: 3 !important; + order: 2 !important; } /* -------------------- Tabs -------------------- */ @@ -46,7 +50,7 @@ /* -------------------- Window Control Buttons -------------------- */ - #toolbar-menubar[inactive] ~ #nav-bar > :is(.titlebar-buttonbox-container) + /*#toolbar-menubar[inactive] ~ #nav-bar > :is(.titlebar-buttonbox-container) { display: block !important; } @@ -54,5 +58,5 @@ #toolbar-menubar[inactive] ~ #TabsToolbar > :is(.titlebar-buttonbox-container, .titlebar-spacer) { display: none !important; - } + }*/ } From 2d103d1da62502b6f2495be5eac51a82ec234ada Mon Sep 17 00:00:00 2001 From: QNetITQ <85301851+QNetITQ@users.noreply.github.com> Date: Fri, 18 Oct 2024 13:46:03 +0300 Subject: [PATCH 06/35] Update wavefox_tabs_on_bottom.css --- .../horizontal_tabs/wavefox_tabs_on_bottom.css | 13 +++++++++---- 1 file changed, 9 insertions(+), 4 deletions(-) diff --git a/chrome/modules/horizontal_tabs/wavefox_tabs_on_bottom.css b/chrome/modules/horizontal_tabs/wavefox_tabs_on_bottom.css index 3ab562e9..5b1a63de 100644 --- a/chrome/modules/horizontal_tabs/wavefox_tabs_on_bottom.css +++ b/chrome/modules/horizontal_tabs/wavefox_tabs_on_bottom.css @@ -50,13 +50,18 @@ /* -------------------- Window Control Buttons -------------------- */ - /*#toolbar-menubar[inactive] ~ #nav-bar > :is(.titlebar-buttonbox-container) + #TabsToolbar > :is(.titlebar-buttonbox-container, .titlebar-spacer) + { + display: none !important; + } + + #toolbar-menubar[inactive] ~ #nav-bar > .titlebar-buttonbox-container { display: block !important; } - #toolbar-menubar[inactive] ~ #TabsToolbar > :is(.titlebar-buttonbox-container, .titlebar-spacer) + :root[tabsintitlebar]:not([inFullscreen]) #toolbar-menubar[inactive] ~ #nav-bar > .titlebar-spacer[type="post-tabs"] { - display: none !important; - }*/ + display: block !important; + } } From fd35cf8a24d725c317982f84070a2bc902b60abd Mon Sep 17 00:00:00 2001 From: QNetITQ <85301851+QNetITQ@users.noreply.github.com> Date: Sat, 19 Oct 2024 13:01:25 +0300 Subject: [PATCH 07/35] Update wavefox_one_line.css --- .../horizontal_tabs/wavefox_one_line.css | 89 ++----------------- 1 file changed, 8 insertions(+), 81 deletions(-) diff --git a/chrome/modules/horizontal_tabs/wavefox_one_line.css b/chrome/modules/horizontal_tabs/wavefox_one_line.css index 5ed750cf..60b4ae56 100644 --- a/chrome/modules/horizontal_tabs/wavefox_one_line.css +++ b/chrome/modules/horizontal_tabs/wavefox_one_line.css @@ -10,12 +10,12 @@ #TabsToolbar { - grid-area: 2 / 1 / span 2 / span 1 !important; + grid-area: 2 / 1 / auto / auto !important; } #nav-bar { - grid-area: 2 / 2 / span 2 / span 2 !important; + grid-area: 2 / 2 / auto / auto !important; } } @@ -28,20 +28,15 @@ #TabsToolbar { - grid-area: 2 / 2 / span 2 / span 2 !important; + grid-area: 2 / 2 / auto / auto !important; } #nav-bar { - grid-area: 2 / 1 / span 2 / span 1 !important; + grid-area: 2 / 1 / auto / auto !important; } } - :root - { - --drag-space: 0px !important; - } - #navigator-toolbox { display: grid !important; @@ -53,6 +48,9 @@ #nav-bar { width: fit-content !important; + background-color: transparent !important; + margin-top: var(--drag-space) !important; + box-shadow: var(--inner-box-shadow) !important; } #urlbar-container, @@ -61,16 +59,11 @@ padding-block: 0px !important; } - #urlbar-container - { - --urlbar-container-height: var(--tab-min-height) !important; - } - /* -------------------- Bookmarks Bar / Notifications -------------------- */ #navigator-toolbox > *:not(#TabsToolbar, #nav-bar) { - grid-column: 1 / span 3 !important; + grid-column: 1 / span 2 !important; } /* -------------------- Customization -------------------- */ @@ -79,70 +72,4 @@ { --panel-arrow-offset: 0px !important; } - - /* -------------------- Floating Tabs -------------------- */ - - @media (-moz-bool-pref: "userChrome.Tabs.Option1.Enabled") or - (-moz-bool-pref: "userChrome.Tabs.Option2.Enabled") or - (-moz-bool-pref: "userChrome.Tabs.Option3.Enabled") or - (-moz-bool-pref: "userChrome.Tabs.Option4.Enabled") or - (-moz-bool-pref: "userChrome.Tabs.Option5.Enabled") - { - #TabsToolbar::before - { - display: none !important; - } - - #nav-bar - { - margin: var(--tab-block-margin) !important; - border-radius: var(--tab-border-radius) !important; - box-shadow: var(--outer-box-shadow) !important; - } - - #PersonalToolbar - { - margin-inline: var(--tab-block-margin) !important; - border-radius: var(--tab-border-radius) !important; - box-shadow: var(--outer-box-shadow) !important; - } - - #PersonalToolbar[collapsed="false"] - { - margin-bottom: var(--tab-block-margin) !important; - } - } - - /* -------------------- 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") - { - #nav-bar - { - position: relative !important; - overflow: visible !important; - - &::before - { - content: ""; - display: block; - position: absolute; - width: 100%; - height: 100%; - inset-inline-start: 0px; - inset-block-start: 0px; - pointer-events: none; - z-index: 0; - clip-path: inset(0 -4px); - box-shadow: var(--outer-box-shadow); - } - } - } } From bba61a7a368a78a958768b25d61f9135fb267364 Mon Sep 17 00:00:00 2001 From: QNetITQ <85301851+QNetITQ@users.noreply.github.com> Date: Sat, 19 Oct 2024 15:22:48 +0300 Subject: [PATCH 08/35] Update wavefox_one_line.css --- .../horizontal_tabs/wavefox_one_line.css | 65 +++++++++++++++++++ 1 file changed, 65 insertions(+) diff --git a/chrome/modules/horizontal_tabs/wavefox_one_line.css b/chrome/modules/horizontal_tabs/wavefox_one_line.css index 60b4ae56..db888e6a 100644 --- a/chrome/modules/horizontal_tabs/wavefox_one_line.css +++ b/chrome/modules/horizontal_tabs/wavefox_one_line.css @@ -72,4 +72,69 @@ { --panel-arrow-offset: 0px !important; } + + /* -------------------- Windows -------------------- */ + + @media (-moz-platform: windows) + { + @media (-moz-windows-accent-color-in-titlebar) or (-moz-windows-mica) + { + :root[tabsintitlebar]:not([lwtheme]) #nav-bar + { + color: inherit !important; + --toolbarbutton-icon-fill: currentColor !important; + --toolbarbutton-hover-background: color-mix(in srgb, currentColor 17%, transparent) !important; + --toolbarbutton-active-background: color-mix(in srgb, currentColor 30%, transparent) !important; + } + } + + :root[tabsintitlebar] #nav-bar + { + will-change: auto !important; + transition: color var(--inactive-window-transition) !important; + + &:-moz-window-inactive + { + color: color-mix(in srgb, currentColor calc(var(--inactive-titlebar-opacity) * 100%), transparent) !important; + } + } + } + + /* -------------------- Linux -------------------- */ + + @media (-moz-platform: linux) + { + :root[tabsintitlebar]:not([lwtheme]) #nav-bar + { + color: inherit !important; + --toolbarbutton-icon-fill: currentColor !important; + } + + :root[tabsintitlebar] #nav-bar + { + will-change: auto !important; + transition: color var(--inactive-window-transition) !important; + + &:-moz-window-inactive + { + color: color-mix(in srgb, currentColor calc(var(--inactive-titlebar-opacity) * 100%), transparent) !important; + } + } + } + + /* -------------------- MacOS -------------------- */ + + @media (-moz-platform: macos) + { + :root[tabsintitlebar] #nav-bar + { + will-change: auto !important; + transition: color var(--inactive-window-transition) !important; + + &:-moz-window-inactive + { + color: color-mix(in srgb, currentColor calc(var(--inactive-titlebar-opacity) * 100%), transparent) !important; + } + } + } } From e93aaadf164c497e8f5cffedc6bb7d1d0271cd28 Mon Sep 17 00:00:00 2001 From: QNetITQ <85301851+QNetITQ@users.noreply.github.com> Date: Sat, 19 Oct 2024 17:09:34 +0300 Subject: [PATCH 09/35] Update wavefox_one_line.css --- chrome/modules/horizontal_tabs/wavefox_one_line.css | 1 - 1 file changed, 1 deletion(-) diff --git a/chrome/modules/horizontal_tabs/wavefox_one_line.css b/chrome/modules/horizontal_tabs/wavefox_one_line.css index db888e6a..8fd43b86 100644 --- a/chrome/modules/horizontal_tabs/wavefox_one_line.css +++ b/chrome/modules/horizontal_tabs/wavefox_one_line.css @@ -107,7 +107,6 @@ :root[tabsintitlebar]:not([lwtheme]) #nav-bar { color: inherit !important; - --toolbarbutton-icon-fill: currentColor !important; } :root[tabsintitlebar] #nav-bar From e3cf94faabd978811e7f7a09e6edacf876a50474 Mon Sep 17 00:00:00 2001 From: QNetITQ <85301851+QNetITQ@users.noreply.github.com> Date: Sat, 19 Oct 2024 17:10:51 +0300 Subject: [PATCH 10/35] Update wavefox_toolbar_buttons.css --- chrome/modules/horizontal_tabs/wavefox_toolbar_buttons.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/chrome/modules/horizontal_tabs/wavefox_toolbar_buttons.css b/chrome/modules/horizontal_tabs/wavefox_toolbar_buttons.css index 9c7d3c33..fc88db5c 100644 --- a/chrome/modules/horizontal_tabs/wavefox_toolbar_buttons.css +++ b/chrome/modules/horizontal_tabs/wavefox_toolbar_buttons.css @@ -94,5 +94,5 @@ .toolbarbutton-1:has(+ #tabbrowser-tabs[overflow][haspinnedtabs]) { margin-inline-end: calc(-1 * var(--tab-first-last-inline-margin) / 2) !important; - z-index: 0 !important; + z-index: 1 !important; } From 0d7528b709dfa1a0f19e71448ea525b5c4651f5b Mon Sep 17 00:00:00 2001 From: QNetITQ <85301851+QNetITQ@users.noreply.github.com> Date: Sat, 19 Oct 2024 18:02:09 +0300 Subject: [PATCH 11/35] Update README.md --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 2e30129f..82cc087a 100644 --- a/README.md +++ b/README.md @@ -165,7 +165,7 @@ This is third-party code. I will update this code according to the original sour ![Снимок](https://github.com/QNetITQ/WaveFox/assets/85301851/514cf30d-a417-48cb-bfd1-0e77c9df1bf4) - `userChrome.Tabs.TabsOnBottom.Enabled` -- `browser.tabs.inTitlebar` (Required key. Set the value to 0) +- `browser.tabs.inTitlebar` (Optional key. Set the value to 0) ### One Line ![Снимок](https://github.com/QNetITQ/WaveFox/assets/85301851/05bba314-643d-46f3-a09c-b3ac31f9761d) From aa47a9653519f7a115621b927464e06e979105d3 Mon Sep 17 00:00:00 2001 From: QNetITQ <85301851+QNetITQ@users.noreply.github.com> Date: Sun, 20 Oct 2024 17:18:18 +0300 Subject: [PATCH 12/35] Create wavefox_transparency_on_windows.css --- .../wavefox_transparency_on_windows.css | 14 ++++++++++++++ 1 file changed, 14 insertions(+) create mode 100644 chrome/modules/horizontal_tabs/wavefox_transparency_on_windows.css diff --git a/chrome/modules/horizontal_tabs/wavefox_transparency_on_windows.css b/chrome/modules/horizontal_tabs/wavefox_transparency_on_windows.css new file mode 100644 index 00000000..bfde75c7 --- /dev/null +++ b/chrome/modules/horizontal_tabs/wavefox_transparency_on_windows.css @@ -0,0 +1,14 @@ +:root[tabsintitlebar]:not([lwtheme]) +{ + background-color: transparent !important; + + #navigator-toolbox + { + background-color: transparent !important; + } + + .titlebar-buttonbox-container + { + align-items: start !important; + } +} From 205818309e50902f96e1361e1d0af7f5129f5a4c Mon Sep 17 00:00:00 2001 From: QNetITQ <85301851+QNetITQ@users.noreply.github.com> Date: Sun, 20 Oct 2024 17:22:46 +0300 Subject: [PATCH 13/35] Update userChrome.css --- chrome/userChrome.css | 29 +++++++++++++++-------------- 1 file changed, 15 insertions(+), 14 deletions(-) diff --git a/chrome/userChrome.css b/chrome/userChrome.css index c163ce80..a5013477 100644 --- a/chrome/userChrome.css +++ b/chrome/userChrome.css @@ -2,19 +2,20 @@ /* ---------- Horizontal Tabs ---------- */ -@import "modules/horizontal_tabs/wavefox_tab_shapes.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); -@import "modules/horizontal_tabs/wavefox_tabs.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); -@import "modules/horizontal_tabs/wavefox_drag_space.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); -@import "modules/horizontal_tabs/wavefox_selected_tab_indicator.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); -@import "modules/horizontal_tabs/wavefox_toolbar_transparency.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); -@import "modules/horizontal_tabs/wavefox_tab_shadows.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); -@import "modules/horizontal_tabs/wavefox_tab_separators.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); -@import "modules/horizontal_tabs/wavefox_tabs_on_bottom.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); -@import "modules/horizontal_tabs/wavefox_one_line.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); -@import "modules/horizontal_tabs/wavefox_toolbar_buttons.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); -@import "modules/horizontal_tabs/wavefox_context_menu_densities.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); -@import "modules/horizontal_tabs/wavefox_rounded_web_page.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.revamp"); -@import "modules/horizontal_tabs/wavefox_transparency_on_linux.css" layer(BasicPriority) /* supports() */ (-moz-platform: linux); -@import "Lepton_Icons/icons/Lepton_Icons.css" layer(BasicPriority) /* supports() */ (-moz-bool-pref: "userChrome.Menu.Icons.LeptonIcons.Enabled"); +@import "modules/horizontal_tabs/wavefox_tab_shapes.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); +@import "modules/horizontal_tabs/wavefox_tabs.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); +@import "modules/horizontal_tabs/wavefox_drag_space.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); +@import "modules/horizontal_tabs/wavefox_selected_tab_indicator.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); +@import "modules/horizontal_tabs/wavefox_toolbar_transparency.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); +@import "modules/horizontal_tabs/wavefox_tab_shadows.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); +@import "modules/horizontal_tabs/wavefox_tab_separators.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); +@import "modules/horizontal_tabs/wavefox_tabs_on_bottom.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); +@import "modules/horizontal_tabs/wavefox_one_line.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); +@import "modules/horizontal_tabs/wavefox_toolbar_buttons.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); +@import "modules/horizontal_tabs/wavefox_context_menu_densities.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); +@import "modules/horizontal_tabs/wavefox_rounded_web_page.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.revamp"); +@import "modules/horizontal_tabs/wavefox_transparency_on_linux.css" layer(BasicPriority) /* supports() */ (-moz-platform: linux); +@import "modules/horizontal_tabs/wavefox_transparency_on_windows.css" layer(BasicPriority) /* supports() */ (-moz-platform: windows); +@import "Lepton_Icons/icons/Lepton_Icons.css" layer(BasicPriority) /* supports() */ (-moz-bool-pref: "userChrome.Menu.Icons.LeptonIcons.Enabled"); /* ---------------------------------------- Third-party styles (Maximum priority) ---------------------------------------- */ From ca2f34ea35868a19e97706514820de995881261c Mon Sep 17 00:00:00 2001 From: QNetITQ <85301851+QNetITQ@users.noreply.github.com> Date: Sun, 20 Oct 2024 17:25:11 +0300 Subject: [PATCH 14/35] Update wavefox_transparency_on_windows.css --- .../wavefox_transparency_on_windows.css | 19 +++++++++++-------- 1 file changed, 11 insertions(+), 8 deletions(-) diff --git a/chrome/modules/horizontal_tabs/wavefox_transparency_on_windows.css b/chrome/modules/horizontal_tabs/wavefox_transparency_on_windows.css index bfde75c7..4e779ffc 100644 --- a/chrome/modules/horizontal_tabs/wavefox_transparency_on_windows.css +++ b/chrome/modules/horizontal_tabs/wavefox_transparency_on_windows.css @@ -1,14 +1,17 @@ -:root[tabsintitlebar]:not([lwtheme]) +@media (-moz-bool-pref: "userChrome.Windows.Transparency.Enabled") { - background-color: transparent !important; - - #navigator-toolbox + :root[tabsintitlebar]:not([lwtheme]) { background-color: transparent !important; - } - .titlebar-buttonbox-container - { - align-items: start !important; + #navigator-toolbox + { + background-color: transparent !important; + } + + .titlebar-buttonbox-container + { + align-items: start !important; + } } } From e910819ed383d0f5f7fd951fce904a133444c71c Mon Sep 17 00:00:00 2001 From: QNetITQ <85301851+QNetITQ@users.noreply.github.com> Date: Sun, 20 Oct 2024 18:32:28 +0300 Subject: [PATCH 15/35] Update README.md --- README.md | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/README.md b/README.md index 82cc087a..80a66594 100644 --- a/README.md +++ b/README.md @@ -73,6 +73,13 @@ ## Optional +### Windows 11/10 Custom Transparency +Install [DWMBlurGlass](https://github.com/Maplespe/DWMBlurGlass). Configure to your liking and activate the keys below. Works only with the system theme. If you just want to enable MicaAlt on Windows 11, see the FAQ. +![изображение](https://github.com/user-attachments/assets/632c972f-b48a-4ca6-8c69-28859e34485b) + +- `browser.theme.windows.accent-color-in-tabs.enabled` +- `userChrome.Windows.Transparency.Enabled` + ### Linux Transparency Requires Linux with transparency support. Works only with the system theme. From d6a2769666647dda025161eab72ad875b39c26ed Mon Sep 17 00:00:00 2001 From: QNetITQ <85301851+QNetITQ@users.noreply.github.com> Date: Sun, 20 Oct 2024 18:38:29 +0300 Subject: [PATCH 16/35] Update wavefox_transparency_on_windows.css --- .../modules/horizontal_tabs/wavefox_transparency_on_windows.css | 1 + 1 file changed, 1 insertion(+) diff --git a/chrome/modules/horizontal_tabs/wavefox_transparency_on_windows.css b/chrome/modules/horizontal_tabs/wavefox_transparency_on_windows.css index 4e779ffc..78bce9ed 100644 --- a/chrome/modules/horizontal_tabs/wavefox_transparency_on_windows.css +++ b/chrome/modules/horizontal_tabs/wavefox_transparency_on_windows.css @@ -7,6 +7,7 @@ #navigator-toolbox { background-color: transparent !important; + border-top: none !important; } .titlebar-buttonbox-container From 5f0a509f0c126e94887e893684e01d68288f3233 Mon Sep 17 00:00:00 2001 From: QNetITQ <85301851+QNetITQ@users.noreply.github.com> Date: Sun, 20 Oct 2024 18:50:08 +0300 Subject: [PATCH 17/35] Update wavefox_transparency_on_windows.css --- .../modules/horizontal_tabs/wavefox_transparency_on_windows.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/chrome/modules/horizontal_tabs/wavefox_transparency_on_windows.css b/chrome/modules/horizontal_tabs/wavefox_transparency_on_windows.css index 78bce9ed..ce5f39a8 100644 --- a/chrome/modules/horizontal_tabs/wavefox_transparency_on_windows.css +++ b/chrome/modules/horizontal_tabs/wavefox_transparency_on_windows.css @@ -7,7 +7,7 @@ #navigator-toolbox { background-color: transparent !important; - border-top: none !important; + border-top-color: transparent !important; } .titlebar-buttonbox-container From 302af151c918888e090596e0a7cdfe90b7a835a7 Mon Sep 17 00:00:00 2001 From: QNetITQ <85301851+QNetITQ@users.noreply.github.com> Date: Sat, 26 Oct 2024 14:58:54 +0300 Subject: [PATCH 18/35] Update wavefox_toolbar_transparency.css --- .../modules/horizontal_tabs/wavefox_toolbar_transparency.css | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/chrome/modules/horizontal_tabs/wavefox_toolbar_transparency.css b/chrome/modules/horizontal_tabs/wavefox_toolbar_transparency.css index 22e1c48c..20e2b35a 100644 --- a/chrome/modules/horizontal_tabs/wavefox_toolbar_transparency.css +++ b/chrome/modules/horizontal_tabs/wavefox_toolbar_transparency.css @@ -4,6 +4,9 @@ { :root:not([lwtheme]) { + --outer-box-shadow: initial !important; + --inner-box-shadow: initial !important; + --outer-drop-shadow: initial !important; --toolbarbutton-hover-background: color-mix(in srgb, currentColor 17%, transparent) !important; --toolbarbutton-active-background: color-mix(in srgb, currentColor 30%, transparent) !important; --urlbar-box-hover-bgcolor: color-mix(in srgb, currentColor 17%, transparent) !important; @@ -29,6 +32,7 @@ #PersonalToolbar { background-color: color-mix(in srgb, var(--toolbar-bgcolor), transparent var(--toolbar-transparency-level)) !important; + background-image: none !important; } #urlbar:not([focused], [open]) > #urlbar-background, From 2579f522577ca6cf236d9f40c9ea0cde7fcd97e9 Mon Sep 17 00:00:00 2001 From: QNetITQ <85301851+QNetITQ@users.noreply.github.com> Date: Sat, 26 Oct 2024 15:16:36 +0300 Subject: [PATCH 19/35] Update wavefox_toolbar_transparency.css --- .../wavefox_toolbar_transparency.css | 28 +++---------------- 1 file changed, 4 insertions(+), 24 deletions(-) diff --git a/chrome/modules/horizontal_tabs/wavefox_toolbar_transparency.css b/chrome/modules/horizontal_tabs/wavefox_toolbar_transparency.css index 20e2b35a..ffb6d110 100644 --- a/chrome/modules/horizontal_tabs/wavefox_toolbar_transparency.css +++ b/chrome/modules/horizontal_tabs/wavefox_toolbar_transparency.css @@ -9,8 +9,6 @@ --outer-drop-shadow: initial !important; --toolbarbutton-hover-background: color-mix(in srgb, currentColor 17%, transparent) !important; --toolbarbutton-active-background: color-mix(in srgb, currentColor 30%, transparent) !important; - --urlbar-box-hover-bgcolor: color-mix(in srgb, currentColor 17%, transparent) !important; - --urlbar-box-active-bgcolor: color-mix(in srgb, currentColor 30%, transparent) !important; @media (-moz-bool-pref: "userChrome.Toolbar.Transparency.Low.Enabled") { @@ -34,12 +32,6 @@ background-color: color-mix(in srgb, var(--toolbar-bgcolor), transparent var(--toolbar-transparency-level)) !important; background-image: none !important; } - - #urlbar:not([focused], [open]) > #urlbar-background, - #searchbar:not(:focus-within) - { - background-color: color-mix(in srgb, var(--toolbar-field-background-color), transparent var(--toolbar-transparency-level)) !important; - } } } @@ -50,28 +42,16 @@ --toolbarbutton-hover-background: color-mix(in srgb, currentColor 17%, transparent) !important; --toolbarbutton-active-background: color-mix(in srgb, currentColor 30%, transparent) !important; - #nav-bar - { - --toolbar-field-background-color: var(--toolbar-bgcolor) !important; - --toolbar-field-color: var(--toolbar-color) !important; - --toolbar-field-border-color: transparent !important; - background-color: transparent !important; - } - - #urlbar:not([focused], [open]) > #urlbar-background, - #searchbar:not(:focus-within) - { - box-shadow: var(--outer-box-shadow) !important; - } - + #nav-bar, #PersonalToolbar { background-color: transparent !important; } - #TabsToolbar::before + #TabsToolbar::before, + #nav-bar { - display: none !important; + box-shadow: none !important; } } } From 33dcec2e2fad79327fd4a59f42c0e502da9847b7 Mon Sep 17 00:00:00 2001 From: QNetITQ <85301851+QNetITQ@users.noreply.github.com> Date: Sun, 27 Oct 2024 11:05:36 +0300 Subject: [PATCH 20/35] Update wavefox_transparency_on_windows.css --- .../modules/horizontal_tabs/wavefox_transparency_on_windows.css | 1 + 1 file changed, 1 insertion(+) diff --git a/chrome/modules/horizontal_tabs/wavefox_transparency_on_windows.css b/chrome/modules/horizontal_tabs/wavefox_transparency_on_windows.css index ce5f39a8..70e461ee 100644 --- a/chrome/modules/horizontal_tabs/wavefox_transparency_on_windows.css +++ b/chrome/modules/horizontal_tabs/wavefox_transparency_on_windows.css @@ -13,6 +13,7 @@ .titlebar-buttonbox-container { align-items: start !important; + opacity: 0 !important; } } } From 48039d8a0de0abecd787beab29f57b1cdbefc4dc Mon Sep 17 00:00:00 2001 From: QNetITQ <85301851+QNetITQ@users.noreply.github.com> Date: Sun, 27 Oct 2024 13:42:23 +0300 Subject: [PATCH 21/35] Update wavefox_transparency_on_windows.css --- .../modules/horizontal_tabs/wavefox_transparency_on_windows.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/chrome/modules/horizontal_tabs/wavefox_transparency_on_windows.css b/chrome/modules/horizontal_tabs/wavefox_transparency_on_windows.css index 70e461ee..34d7e44d 100644 --- a/chrome/modules/horizontal_tabs/wavefox_transparency_on_windows.css +++ b/chrome/modules/horizontal_tabs/wavefox_transparency_on_windows.css @@ -10,7 +10,7 @@ border-top-color: transparent !important; } - .titlebar-buttonbox-container + &:not([inFullscreen]) .browser-titlebar > .titlebar-buttonbox-container { align-items: start !important; opacity: 0 !important; From 1001a129decaf35884d398eb3cf3d74896e943ac Mon Sep 17 00:00:00 2001 From: QNetITQ <85301851+QNetITQ@users.noreply.github.com> Date: Wed, 30 Oct 2024 17:00:32 +0300 Subject: [PATCH 22/35] Update wavefox_tab_separators.css --- chrome/modules/horizontal_tabs/wavefox_tab_separators.css | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/chrome/modules/horizontal_tabs/wavefox_tab_separators.css b/chrome/modules/horizontal_tabs/wavefox_tab_separators.css index cf36ac61..78f2e705 100644 --- a/chrome/modules/horizontal_tabs/wavefox_tab_separators.css +++ b/chrome/modules/horizontal_tabs/wavefox_tab_separators.css @@ -46,9 +46,9 @@ .tabbrowser-tab:not([hidden]):is([selected], :hover, [multiselected]) .tab-stack::before, .tabbrowser-tab:not([hidden]):is([selected], :hover, [multiselected]) .tab-stack::after, - .tabbrowser-tab:not([hidden]):has(+ .tabbrowser-tab:is([selected], :hover, [multiselected]):not([hidden])) .tab-stack::after, - .tabbrowser-tab:not([hidden]):has(+ .tabbrowser-tab[hidden] + .tabbrowser-tab:is([selected], :hover, [multiselected]):not([hidden])) .tab-stack::after, - .tabbrowser-tab:not([hidden]):has(+ .tabbrowser-tab[hidden] ~ .tabbrowser-tab[hidden] + .tabbrowser-tab:is([selected], :hover, [multiselected]):not([hidden])) .tab-stack::after + #tabbrowser-tabs:not([movingtab]) .tabbrowser-tab:not([hidden]):has(+ .tabbrowser-tab:is([selected], :hover, [multiselected]):not([hidden])) .tab-stack::after, + #tabbrowser-tabs:not([movingtab]) .tabbrowser-tab:not([hidden]):has(+ .tabbrowser-tab[hidden] + .tabbrowser-tab:is([selected], :hover, [multiselected]):not([hidden])) .tab-stack::after, + #tabbrowser-tabs:not([movingtab]) .tabbrowser-tab:not([hidden]):has(+ .tabbrowser-tab[hidden] ~ .tabbrowser-tab[hidden] + .tabbrowser-tab:is([selected], :hover, [multiselected]):not([hidden])) .tab-stack::after { opacity: 0 !important; } From b461dad12b05065eadbb7ccae1cc616adbe20560 Mon Sep 17 00:00:00 2001 From: QNetITQ <85301851+QNetITQ@users.noreply.github.com> Date: Sat, 2 Nov 2024 17:44:07 +0300 Subject: [PATCH 23/35] Update wavefox_toolbar_buttons.css --- chrome/modules/horizontal_tabs/wavefox_toolbar_buttons.css | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/chrome/modules/horizontal_tabs/wavefox_toolbar_buttons.css b/chrome/modules/horizontal_tabs/wavefox_toolbar_buttons.css index fc88db5c..7082e7a4 100644 --- a/chrome/modules/horizontal_tabs/wavefox_toolbar_buttons.css +++ b/chrome/modules/horizontal_tabs/wavefox_toolbar_buttons.css @@ -59,9 +59,15 @@ counter-increment: TabCounter; } +#tabbrowser-tabs ~ #alltabs-button > .toolbarbutton-badge-stack > .toolbarbutton-icon +{ + opacity: 0 !important; +} + #tabbrowser-tabs ~ #alltabs-button::after { content: counter(TabCounter); + position: absolute; } /* ---------------------------------------- Tab Bar ---------------------------------------- */ From 3f0a04115a9aaad6eab9b37cc93f967fd36e98b4 Mon Sep 17 00:00:00 2001 From: QNetITQ <85301851+QNetITQ@users.noreply.github.com> Date: Sat, 2 Nov 2024 17:59:57 +0300 Subject: [PATCH 24/35] Update README.md --- README.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index 80a66594..787853af 100644 --- a/README.md +++ b/README.md @@ -135,12 +135,12 @@ By default context menus follow the selected interface density, but it is possib - `userChrome.Menu.Size.Touch.Enabled` ### Lepton Icons (Menu icons) -This is third-party code. I will update this code according to the original source. The first two keys are mandatory. The rest can be turned on arbitrarily or all together. +This is third-party code. I will update this code according to the original source. Unlike other options, these keys can be enabled in any order, or all together. ![изображение](https://user-images.githubusercontent.com/85301851/151192118-0cbdb5a7-a77f-4275-8841-2ac321657c86.png) -- `svg.context-properties.content.enabled` -- `userChrome.Menu.Icons.LeptonIcons.Enabled` +- `svg.context-properties.content.enabled` (Required key) +- `userChrome.Menu.Icons.LeptonIcons.Enabled` (Required key) - `userChrome.icon.panel_full` or `userChrome.icon.panel_photon` - `userChrome.icon.library` - `userChrome.icon.panel` From f9feaf994196f9054f5deee3d78601703cefe770 Mon Sep 17 00:00:00 2001 From: QNetITQ <85301851+QNetITQ@users.noreply.github.com> Date: Mon, 4 Nov 2024 16:46:06 +0300 Subject: [PATCH 25/35] Update wavefox_tabs.css --- chrome/modules/horizontal_tabs/wavefox_tabs.css | 16 +++++----------- 1 file changed, 5 insertions(+), 11 deletions(-) diff --git a/chrome/modules/horizontal_tabs/wavefox_tabs.css b/chrome/modules/horizontal_tabs/wavefox_tabs.css index e2ebeea0..84ae7dba 100644 --- a/chrome/modules/horizontal_tabs/wavefox_tabs.css +++ b/chrome/modules/horizontal_tabs/wavefox_tabs.css @@ -260,11 +260,7 @@ { background-color: transparent !important; border: none !important; - border-radius: 50% !important; - color: inherit !important; fill: currentColor !important; - fill-opacity: 1 !important; - z-index: 1 !important; } .tab-icon-overlay:not([crashed]):hover @@ -294,20 +290,16 @@ margin-inline-end: 10px !important; } -.tabbrowser-tab[busy] .tab-icon-overlay -{ - display: none !important; -} - -.tabbrowser-tab:is([pinned], [image], [sharing], [pictureinpicture]):is([soundplaying], [muted], [activemedia-blocked]):not([busy], [crashed]) .tab-icon-stack > :not(.tab-icon-overlay) +.tabbrowser-tab:is([pinned], [image], [sharing], [pictureinpicture]):is([soundplaying], [muted], [activemedia-blocked]):not([crashed]) .tab-icon-stack > :not(.tab-icon-overlay) { mask-image: url("svg_files/media/Media.svg"); mask-size: 16px 16px; } -:root:-moz-locale-dir(rtl) .tabbrowser-tab:is([pinned], [image], [sharing], [pictureinpicture]):is([soundplaying], [muted], [activemedia-blocked]):not([busy], [crashed]) .tab-icon-stack > :not(.tab-icon-overlay) +:root:-moz-locale-dir(rtl) .tabbrowser-tab:is([pinned], [image], [sharing], [pictureinpicture]):is([soundplaying], [muted], [activemedia-blocked]):not([crashed]) .tab-icon-stack > :not(.tab-icon-overlay) { mask-image: url("svg_files/media/Media_rtl.svg"); + mask-size: 16px 16px; } /* ---------- Picture-In-Picture ---------- */ @@ -356,6 +348,7 @@ .tab-label-container { height: var(--tab-min-height) !important; + font-size: 12px !important; } .tab-label @@ -379,6 +372,7 @@ width: 100% !important; height: 16px !important; line-height: 16px !important; + overflow: hidden !important; margin-block: 0px !important; order: -1 !important; } From 110208000cd08a4d83df41adee343586adb7ce75 Mon Sep 17 00:00:00 2001 From: QNetITQ <85301851+QNetITQ@users.noreply.github.com> Date: Tue, 12 Nov 2024 18:29:44 +0300 Subject: [PATCH 26/35] Create FT-Experemental --- .../modules/horizontal_tabs/FT-Experemental | 331 ++++++++++++++++++ 1 file changed, 331 insertions(+) create mode 100644 chrome/modules/horizontal_tabs/FT-Experemental diff --git a/chrome/modules/horizontal_tabs/FT-Experemental b/chrome/modules/horizontal_tabs/FT-Experemental new file mode 100644 index 00000000..5cca6624 --- /dev/null +++ b/chrome/modules/horizontal_tabs/FT-Experemental @@ -0,0 +1,331 @@ +/* ---------------------------------------- Floating tabs ---------------------------------------- */ + +@media (-moz-bool-pref: "userChrome.Tabs.Option1.Enabled") or + (-moz-bool-pref: "userChrome.Tabs.Option2.Enabled") or + (-moz-bool-pref: "userChrome.Tabs.Option3.Enabled") +{ + /* -------------------- Initial shape of tabs -------------------- */ + + @property --wavefox-ft-border-radius + { + syntax: ""; + inherits: true; + initial-value: 4px; + } + + /* -------------------- Tab shapes -------------------- */ + + @media (-moz-bool-pref: "userChrome.Tabs.Option1.Enabled") + { + :root + { + --wavefox-ft-border-radius: 8px; + } + } + + @media (-moz-bool-pref: "userChrome.Tabs.Option2.Enabled") + { + :root + { + --wavefox-ft-border-radius: 12px; + } + } + + @media (-moz-bool-pref: "userChrome.Tabs.Option3.Enabled") + { + :root + { + --wavefox-ft-border-radius: 50px; + } + } + + /* -------------------- System / Light / Dark -------------------- */ + + :root:is(:not([lwtheme]), + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26)"], + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254)"]) + { + .tabbrowser-tab[visuallyselected] + { + color: var(--toolbar-color) !important; + + .tab-background + { + background-color: var(--toolbar-bgcolor) !important; + } + } + + .tabbrowser-tab:not([visuallyselected]) + { + &:hover .tab-background + { + background-color: var(--toolbarbutton-hover-background) !important; + } + + &[multiselected] .tab-background + { + background-color: var(--toolbarbutton-active-background) !important; + } + } + + .tabbrowser-tab .tab-close-button:hover + { + background-color: var(--toolbarbutton-hover-background) !important; + } + + .tabbrowser-tab .tab-close-button:hover:active + { + background-color: var(--toolbarbutton-active-background) !important; + } + + .tab-background + { + box-shadow: none !important; + outline: none !important; + } + } + + + + + + + + + + + + + + + + + + + + + + + + + + + +/* ---------------------------------------- Main Window ---------------------------------------- */ + +:root +{ + --tab-shadow-max-size: 0px !important; +} + +/* ---------------------------------------- Titlebar ---------------------------------------- */ + +:root[tabsintitlebar] +{ + .browser-titlebar + { + will-change: auto !important; + transition: color var(--inactive-window-transition) !important; + + &:-moz-window-inactive + { + color: color-mix(in srgb, currentColor calc(var(--inactive-titlebar-opacity) * 100%), transparent) !important; + opacity: 1 !important; + } + } +} + +/* ---------------------------------------- Density ---------------------------------------- */ + +:root[uidensity="compact"] +{ + --tab-min-height: 32px !important; +} + +:root[uidensity="touch"] +{ + --tab-min-height: 40px !important; +} + +/* ---------------------------------------- Tabs ---------------------------------------- */ + +.tabbrowser-tab +{ + --tab-label-mask-size: 0px !important; + + .tab-background + { + border-radius: var(--wavefox-ft-border-radius) !important; + } + + &[pinned] .tab-content + { + padding-inline: calc((var(--tab-min-height) - 16px) / 2 + var(--pinned-tabs-width-offset, 0px)) !important; + } + + &:not([pinned]) .tab-content + { + padding-inline: 10px !important; + } +} + +.tabbrowser-tab[pending] .tab-icon-image +{ + filter: saturate(0) !important; +} + +.tab-close-button +{ + width: 16px !important; + height: 16px !important; + border-radius: 50% !important; + padding: 2px !important; + margin: 0px !important; +} + +/* -------------------- Media Icons -------------------- */ + +.tab-icon-overlay:not([crashed]) +{ + background-color: transparent !important; + border: none !important; + fill: currentColor !important; +} + +.tab-icon-overlay:not([crashed]):hover +{ + background-color: var(--toolbarbutton-hover-background) !important; +} + +.tab-icon-overlay:not([crashed]):hover:active +{ + background-color: var(--toolbarbutton-active-background) !important; +} + +.tabbrowser-tab:is([pinned], [image], [sharing], [pictureinpicture]):not([crashed]) .tab-icon-overlay +{ + top: -8px !important; + inset-inline-end: -8px !important; +} + +.tab-icon-overlay[indicator-replaces-favicon], +.tab-icon-stack[indicator-replaces-favicon] > :not(.tab-icon-overlay) +{ + opacity: 1 !important; +} + +.tabbrowser-tab:not([pinned]) .tab-icon-stack > * +{ + margin-inline-end: 10px !important; +} + +.tabbrowser-tab:is([pinned], [image], [sharing], [pictureinpicture]):is([soundplaying], [muted], [activemedia-blocked]):not([crashed]) .tab-icon-stack > :not(.tab-icon-overlay) +{ + mask-image: url("svg_files/media/Media.svg"); + mask-size: 16px 16px; +} + +:root:-moz-locale-dir(rtl) .tabbrowser-tab:is([pinned], [image], [sharing], [pictureinpicture]):is([soundplaying], [muted], [activemedia-blocked]):not([crashed]) .tab-icon-stack > :not(.tab-icon-overlay) +{ + mask-image: url("svg_files/media/Media_rtl.svg"); + mask-size: 16px 16px; +} + +/* ---------- Picture-In-Picture ---------- */ + +.tabbrowser-tab[pictureinpicture]:not([busy], [crashed]) .tab-icon-stack::before +{ + content: ""; + display: block; + position: absolute; + width: 16px; + height: 16px; + background-color: currentColor; + mask-size: 16px 16px; + mask-position: center center; + mask-repeat: no-repeat; +} + +:root:-moz-locale-dir(rtl) .tabbrowser-tab[pictureinpicture]:not([busy], [crashed]) .tab-icon-stack::before +{ + transform: rotateY(180deg); +} + +.tabbrowser-tab[pictureinpicture]:not([busy], [crashed]) .tab-icon-stack > :not(.tab-icon-overlay) +{ + position: relative !important; + padding: 2px !important; + inset-inline-start: 8px !important; + top: 8px !important; + mask-image: none !important; + box-sizing: border-box !important; + z-index: 1 !important; +} + +.tabbrowser-tab[pictureinpicture]:not([busy], [crashed]):not([soundplaying], [muted], [activemedia-blocked]) .tab-icon-stack::before +{ + mask-image: url("svg_files/media/PIP.svg"); +} + +.tabbrowser-tab[pictureinpicture]:not([busy], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) .tab-icon-stack::before +{ + mask-image: url("svg_files/media/PIP_Sound.svg"); +} + +/* -------------------- Tab Text -------------------- */ + +.tab-label-container +{ + height: var(--tab-min-height) !important; + font-size: 12px !important; +} + +.tab-label +{ + width: 100% !important; + height: 16px !important; + line-height: 16px !important; + overflow: hidden !important; + text-overflow: ellipsis !important; + margin-block: 0px !important; +} + +#tabbrowser-tabs[secondarytext-unsupported] .tab-label +{ + height: var(--tab-min-height) !important; + line-height: var(--tab-min-height) !important; +} + +.tab-secondary-label +{ + width: 100% !important; + height: 16px !important; + line-height: 16px !important; + overflow: hidden !important; + margin-block: 0px !important; + order: -1 !important; +} + +.tab-secondary-label > * +{ + width: 100% !important; + height: 16px !important; + line-height: 16px !important; + overflow: hidden !important; + text-overflow: ellipsis !important; +} + +/* ---------------------------------------- Indents ---------------------------------------- */ + +#tabbrowser-tabs:not([overflow]) .tabbrowser-tab:nth-child(1 of .tabbrowser-tab:not([pinned], [hidden])) +{ + margin-inline-start: 0px !important; +} + + + + + + + +} From 405f18b29cd722a150381d5d9bf33d5ac683fd5d Mon Sep 17 00:00:00 2001 From: QNetITQ <85301851+QNetITQ@users.noreply.github.com> Date: Wed, 13 Nov 2024 17:57:47 +0300 Subject: [PATCH 27/35] Update and rename FT-Experemental to FT-Experimental.css --- .../modules/horizontal_tabs/FT-Experemental | 331 ------------------ .../horizontal_tabs/FT-Experimental.css | 137 ++++++++ 2 files changed, 137 insertions(+), 331 deletions(-) delete mode 100644 chrome/modules/horizontal_tabs/FT-Experemental create mode 100644 chrome/modules/horizontal_tabs/FT-Experimental.css diff --git a/chrome/modules/horizontal_tabs/FT-Experemental b/chrome/modules/horizontal_tabs/FT-Experemental deleted file mode 100644 index 5cca6624..00000000 --- a/chrome/modules/horizontal_tabs/FT-Experemental +++ /dev/null @@ -1,331 +0,0 @@ -/* ---------------------------------------- Floating tabs ---------------------------------------- */ - -@media (-moz-bool-pref: "userChrome.Tabs.Option1.Enabled") or - (-moz-bool-pref: "userChrome.Tabs.Option2.Enabled") or - (-moz-bool-pref: "userChrome.Tabs.Option3.Enabled") -{ - /* -------------------- Initial shape of tabs -------------------- */ - - @property --wavefox-ft-border-radius - { - syntax: ""; - inherits: true; - initial-value: 4px; - } - - /* -------------------- Tab shapes -------------------- */ - - @media (-moz-bool-pref: "userChrome.Tabs.Option1.Enabled") - { - :root - { - --wavefox-ft-border-radius: 8px; - } - } - - @media (-moz-bool-pref: "userChrome.Tabs.Option2.Enabled") - { - :root - { - --wavefox-ft-border-radius: 12px; - } - } - - @media (-moz-bool-pref: "userChrome.Tabs.Option3.Enabled") - { - :root - { - --wavefox-ft-border-radius: 50px; - } - } - - /* -------------------- System / Light / Dark -------------------- */ - - :root:is(:not([lwtheme]), - [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26)"], - [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254)"]) - { - .tabbrowser-tab[visuallyselected] - { - color: var(--toolbar-color) !important; - - .tab-background - { - background-color: var(--toolbar-bgcolor) !important; - } - } - - .tabbrowser-tab:not([visuallyselected]) - { - &:hover .tab-background - { - background-color: var(--toolbarbutton-hover-background) !important; - } - - &[multiselected] .tab-background - { - background-color: var(--toolbarbutton-active-background) !important; - } - } - - .tabbrowser-tab .tab-close-button:hover - { - background-color: var(--toolbarbutton-hover-background) !important; - } - - .tabbrowser-tab .tab-close-button:hover:active - { - background-color: var(--toolbarbutton-active-background) !important; - } - - .tab-background - { - box-shadow: none !important; - outline: none !important; - } - } - - - - - - - - - - - - - - - - - - - - - - - - - - - -/* ---------------------------------------- Main Window ---------------------------------------- */ - -:root -{ - --tab-shadow-max-size: 0px !important; -} - -/* ---------------------------------------- Titlebar ---------------------------------------- */ - -:root[tabsintitlebar] -{ - .browser-titlebar - { - will-change: auto !important; - transition: color var(--inactive-window-transition) !important; - - &:-moz-window-inactive - { - color: color-mix(in srgb, currentColor calc(var(--inactive-titlebar-opacity) * 100%), transparent) !important; - opacity: 1 !important; - } - } -} - -/* ---------------------------------------- Density ---------------------------------------- */ - -:root[uidensity="compact"] -{ - --tab-min-height: 32px !important; -} - -:root[uidensity="touch"] -{ - --tab-min-height: 40px !important; -} - -/* ---------------------------------------- Tabs ---------------------------------------- */ - -.tabbrowser-tab -{ - --tab-label-mask-size: 0px !important; - - .tab-background - { - border-radius: var(--wavefox-ft-border-radius) !important; - } - - &[pinned] .tab-content - { - padding-inline: calc((var(--tab-min-height) - 16px) / 2 + var(--pinned-tabs-width-offset, 0px)) !important; - } - - &:not([pinned]) .tab-content - { - padding-inline: 10px !important; - } -} - -.tabbrowser-tab[pending] .tab-icon-image -{ - filter: saturate(0) !important; -} - -.tab-close-button -{ - width: 16px !important; - height: 16px !important; - border-radius: 50% !important; - padding: 2px !important; - margin: 0px !important; -} - -/* -------------------- Media Icons -------------------- */ - -.tab-icon-overlay:not([crashed]) -{ - background-color: transparent !important; - border: none !important; - fill: currentColor !important; -} - -.tab-icon-overlay:not([crashed]):hover -{ - background-color: var(--toolbarbutton-hover-background) !important; -} - -.tab-icon-overlay:not([crashed]):hover:active -{ - background-color: var(--toolbarbutton-active-background) !important; -} - -.tabbrowser-tab:is([pinned], [image], [sharing], [pictureinpicture]):not([crashed]) .tab-icon-overlay -{ - top: -8px !important; - inset-inline-end: -8px !important; -} - -.tab-icon-overlay[indicator-replaces-favicon], -.tab-icon-stack[indicator-replaces-favicon] > :not(.tab-icon-overlay) -{ - opacity: 1 !important; -} - -.tabbrowser-tab:not([pinned]) .tab-icon-stack > * -{ - margin-inline-end: 10px !important; -} - -.tabbrowser-tab:is([pinned], [image], [sharing], [pictureinpicture]):is([soundplaying], [muted], [activemedia-blocked]):not([crashed]) .tab-icon-stack > :not(.tab-icon-overlay) -{ - mask-image: url("svg_files/media/Media.svg"); - mask-size: 16px 16px; -} - -:root:-moz-locale-dir(rtl) .tabbrowser-tab:is([pinned], [image], [sharing], [pictureinpicture]):is([soundplaying], [muted], [activemedia-blocked]):not([crashed]) .tab-icon-stack > :not(.tab-icon-overlay) -{ - mask-image: url("svg_files/media/Media_rtl.svg"); - mask-size: 16px 16px; -} - -/* ---------- Picture-In-Picture ---------- */ - -.tabbrowser-tab[pictureinpicture]:not([busy], [crashed]) .tab-icon-stack::before -{ - content: ""; - display: block; - position: absolute; - width: 16px; - height: 16px; - background-color: currentColor; - mask-size: 16px 16px; - mask-position: center center; - mask-repeat: no-repeat; -} - -:root:-moz-locale-dir(rtl) .tabbrowser-tab[pictureinpicture]:not([busy], [crashed]) .tab-icon-stack::before -{ - transform: rotateY(180deg); -} - -.tabbrowser-tab[pictureinpicture]:not([busy], [crashed]) .tab-icon-stack > :not(.tab-icon-overlay) -{ - position: relative !important; - padding: 2px !important; - inset-inline-start: 8px !important; - top: 8px !important; - mask-image: none !important; - box-sizing: border-box !important; - z-index: 1 !important; -} - -.tabbrowser-tab[pictureinpicture]:not([busy], [crashed]):not([soundplaying], [muted], [activemedia-blocked]) .tab-icon-stack::before -{ - mask-image: url("svg_files/media/PIP.svg"); -} - -.tabbrowser-tab[pictureinpicture]:not([busy], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) .tab-icon-stack::before -{ - mask-image: url("svg_files/media/PIP_Sound.svg"); -} - -/* -------------------- Tab Text -------------------- */ - -.tab-label-container -{ - height: var(--tab-min-height) !important; - font-size: 12px !important; -} - -.tab-label -{ - width: 100% !important; - height: 16px !important; - line-height: 16px !important; - overflow: hidden !important; - text-overflow: ellipsis !important; - margin-block: 0px !important; -} - -#tabbrowser-tabs[secondarytext-unsupported] .tab-label -{ - height: var(--tab-min-height) !important; - line-height: var(--tab-min-height) !important; -} - -.tab-secondary-label -{ - width: 100% !important; - height: 16px !important; - line-height: 16px !important; - overflow: hidden !important; - margin-block: 0px !important; - order: -1 !important; -} - -.tab-secondary-label > * -{ - width: 100% !important; - height: 16px !important; - line-height: 16px !important; - overflow: hidden !important; - text-overflow: ellipsis !important; -} - -/* ---------------------------------------- Indents ---------------------------------------- */ - -#tabbrowser-tabs:not([overflow]) .tabbrowser-tab:nth-child(1 of .tabbrowser-tab:not([pinned], [hidden])) -{ - margin-inline-start: 0px !important; -} - - - - - - - -} diff --git a/chrome/modules/horizontal_tabs/FT-Experimental.css b/chrome/modules/horizontal_tabs/FT-Experimental.css new file mode 100644 index 00000000..1eb84a0a --- /dev/null +++ b/chrome/modules/horizontal_tabs/FT-Experimental.css @@ -0,0 +1,137 @@ +/* ---------------------------------------- Custom properties ---------------------------------------- */ + +@property --wavefox-ft-border-radius +{ + syntax: ""; + inherits: true; + initial-value: 4px; +} + +@property --wavefox-ft-shadow +{ + syntax: "*"; + inherits: true; + initial-value: none; +} + +/* ---------------------------------------- Floating tabs ---------------------------------------- */ + +@media (-moz-bool-pref: "userChrome.Tabs.Option1.Enabled") or + (-moz-bool-pref: "userChrome.Tabs.Option2.Enabled") or + (-moz-bool-pref: "userChrome.Tabs.Option3.Enabled") +{ + /* -------------------- Tab shapes -------------------- */ + + @media (-moz-bool-pref: "userChrome.Tabs.Option1.Enabled") + { + :root + { + --wavefox-ft-border-radius: 8px; + } + } + + @media (-moz-bool-pref: "userChrome.Tabs.Option2.Enabled") + { + :root + { + --wavefox-ft-border-radius: 12px; + } + } + + @media (-moz-bool-pref: "userChrome.Tabs.Option3.Enabled") + { + :root + { + --wavefox-ft-border-radius: 50px; + } + } +} + + + + + + + + + + + + + + + + + + + + + + + + + +/* ---------------------------------------- Titlebar ---------------------------------------- */ + +:root[tabsintitlebar] +{ + .browser-titlebar + { + will-change: auto !important; + transition: color var(--inactive-window-transition) !important; + + &:-moz-window-inactive + { + color: color-mix(in srgb, currentColor calc(var(--inactive-titlebar-opacity) * 100%), transparent) !important; + opacity: 1 !important; + } + } +} + +/* ---------------------------------------- Tabs ---------------------------------------- */ + +.tabbrowser-tab +{ + --tab-label-mask-size: 0px !important; + + .tab-background + { + border-radius: var(--wavefox-ft-border-radius) !important; + } + + &[pinned] .tab-content + { + padding-inline: calc((var(--tab-min-height) - 16px) / 2 + var(--pinned-tabs-width-offset, 0px)) !important; + } + + &:not([pinned]) .tab-content + { + padding-inline: 10px !important; + } +} + +.tabbrowser-tab[visuallyselected] .tab-background +{ + box-shadow: var(--wavefox-ft-shadow) !important; +} + +.tabbrowser-tab[pending] .tab-icon-image +{ + filter: saturate(0) !important; +} + +.tab-close-button +{ + width: 16px !important; + height: 16px !important; + border-radius: 50% !important; + padding: 2px !important; + margin: 0px !important; +} + +/* ---------------------------------------- Indents ---------------------------------------- */ + +#tabbrowser-tabs:not([overflow]) .tabbrowser-tab:nth-child(1 of .tabbrowser-tab:not([pinned], [hidden])) +{ + margin-inline-start: 0px !important; +} From e1bde1c930498bc3aa5f11acc2e915c643a2fbed Mon Sep 17 00:00:00 2001 From: QNetITQ <85301851+QNetITQ@users.noreply.github.com> Date: Wed, 13 Nov 2024 18:10:29 +0300 Subject: [PATCH 28/35] Update FT-Experimental.css --- .../modules/horizontal_tabs/FT-Experimental.css | 15 +++++++++++++++ 1 file changed, 15 insertions(+) diff --git a/chrome/modules/horizontal_tabs/FT-Experimental.css b/chrome/modules/horizontal_tabs/FT-Experimental.css index 1eb84a0a..d4f0175b 100644 --- a/chrome/modules/horizontal_tabs/FT-Experimental.css +++ b/chrome/modules/horizontal_tabs/FT-Experimental.css @@ -69,7 +69,22 @@ +/* ---------------------------------------- Density ---------------------------------------- */ +:root[uidensity="compact"] +{ + --tab-min-height: 32px !important; +} + +:root +{ + --tab-min-height: 36px !important; +} + +:root[uidensity="touch"] +{ + --tab-min-height: 40px !important; +} /* ---------------------------------------- Titlebar ---------------------------------------- */ From 05f9bfe52b286ecb295b5055addecf3753f913e2 Mon Sep 17 00:00:00 2001 From: QNetITQ <85301851+QNetITQ@users.noreply.github.com> Date: Wed, 13 Nov 2024 18:13:35 +0300 Subject: [PATCH 29/35] Create wavefox_tab_media_icons_and_text.css --- .../wavefox_tab_media_icons_and_text.css | 131 ++++++++++++++++++ 1 file changed, 131 insertions(+) create mode 100644 chrome/modules/horizontal_tabs/wavefox_tab_media_icons_and_text.css diff --git a/chrome/modules/horizontal_tabs/wavefox_tab_media_icons_and_text.css b/chrome/modules/horizontal_tabs/wavefox_tab_media_icons_and_text.css new file mode 100644 index 00000000..04ba519a --- /dev/null +++ b/chrome/modules/horizontal_tabs/wavefox_tab_media_icons_and_text.css @@ -0,0 +1,131 @@ +/* -------------------- Media Icons -------------------- */ + +.tab-icon-overlay:not([crashed]) +{ + background-color: transparent !important; + border: none !important; + fill: currentColor !important; +} + +.tab-icon-overlay:not([crashed]):hover +{ + background-color: var(--toolbarbutton-hover-background) !important; +} + +.tab-icon-overlay:not([crashed]):hover:active +{ + background-color: var(--toolbarbutton-active-background) !important; +} + +.tabbrowser-tab:is([pinned], [image], [sharing], [pictureinpicture]):not([crashed]) .tab-icon-overlay +{ + top: -8px !important; + inset-inline-end: -8px !important; +} + +.tab-icon-overlay[indicator-replaces-favicon], +.tab-icon-stack[indicator-replaces-favicon] > :not(.tab-icon-overlay) +{ + opacity: 1 !important; +} + +.tabbrowser-tab:not([pinned]) .tab-icon-stack > * +{ + margin-inline-end: 10px !important; +} + +.tabbrowser-tab:is([pinned], [image], [sharing], [pictureinpicture]):is([soundplaying], [muted], [activemedia-blocked]):not([crashed]) .tab-icon-stack > :not(.tab-icon-overlay) +{ + mask-image: url("svg_files/media/Media.svg"); + mask-size: 16px 16px; +} + +:root:-moz-locale-dir(rtl) .tabbrowser-tab:is([pinned], [image], [sharing], [pictureinpicture]):is([soundplaying], [muted], [activemedia-blocked]):not([crashed]) .tab-icon-stack > :not(.tab-icon-overlay) +{ + mask-image: url("svg_files/media/Media_rtl.svg"); + mask-size: 16px 16px; +} + +/* ---------- Picture-In-Picture ---------- */ + +.tabbrowser-tab[pictureinpicture]:not([busy], [crashed]) .tab-icon-stack::before +{ + content: ""; + display: block; + position: absolute; + width: 16px; + height: 16px; + background-color: currentColor; + mask-size: 16px 16px; + mask-position: center center; + mask-repeat: no-repeat; +} + +:root:-moz-locale-dir(rtl) .tabbrowser-tab[pictureinpicture]:not([busy], [crashed]) .tab-icon-stack::before +{ + transform: rotateY(180deg); +} + +.tabbrowser-tab[pictureinpicture]:not([busy], [crashed]) .tab-icon-stack > :not(.tab-icon-overlay) +{ + position: relative !important; + padding: 2px !important; + inset-inline-start: 8px !important; + top: 8px !important; + mask-image: none !important; + box-sizing: border-box !important; + z-index: 1 !important; +} + +.tabbrowser-tab[pictureinpicture]:not([busy], [crashed]):not([soundplaying], [muted], [activemedia-blocked]) .tab-icon-stack::before +{ + mask-image: url("svg_files/media/PIP.svg"); +} + +.tabbrowser-tab[pictureinpicture]:not([busy], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) .tab-icon-stack::before +{ + mask-image: url("svg_files/media/PIP_Sound.svg"); +} + +/* -------------------- Tab Text -------------------- */ + +.tab-label-container +{ + height: var(--tab-min-height) !important; + font-size: 12px !important; +} + +.tab-label +{ + width: 100% !important; + height: 16px !important; + line-height: 16px !important; + overflow: hidden !important; + text-overflow: ellipsis !important; + margin-block: 0px !important; +} + +#tabbrowser-tabs[secondarytext-unsupported] .tab-label +{ + height: var(--tab-min-height) !important; + line-height: var(--tab-min-height) !important; +} + +.tab-secondary-label +{ + width: 100% !important; + height: 16px !important; + line-height: 16px !important; + overflow: hidden !important; + margin-block: 0px !important; + order: -1 !important; +} + +.tab-secondary-label > * +{ + width: 100% !important; + height: 16px !important; + line-height: 16px !important; + overflow: hidden !important; + text-overflow: ellipsis !important; +} From dbcf670ee677f5e58982428d5ff5e3f19e3dbe03 Mon Sep 17 00:00:00 2001 From: QNetITQ <85301851+QNetITQ@users.noreply.github.com> Date: Wed, 13 Nov 2024 18:15:19 +0300 Subject: [PATCH 30/35] Update wavefox_tabs.css --- .../modules/horizontal_tabs/wavefox_tabs.css | 132 ------------------ 1 file changed, 132 deletions(-) diff --git a/chrome/modules/horizontal_tabs/wavefox_tabs.css b/chrome/modules/horizontal_tabs/wavefox_tabs.css index 84ae7dba..f87a9668 100644 --- a/chrome/modules/horizontal_tabs/wavefox_tabs.css +++ b/chrome/modules/horizontal_tabs/wavefox_tabs.css @@ -254,138 +254,6 @@ background-position: var(--tab-attention-indicator-position) !important; } -/* -------------------- Media Icons -------------------- */ - -.tab-icon-overlay:not([crashed]) -{ - background-color: transparent !important; - border: none !important; - fill: currentColor !important; -} - -.tab-icon-overlay:not([crashed]):hover -{ - background-color: var(--toolbarbutton-hover-background) !important; -} - -.tab-icon-overlay:not([crashed]):hover:active -{ - background-color: var(--toolbarbutton-active-background) !important; -} - -.tabbrowser-tab:is([pinned], [image], [sharing], [pictureinpicture]):not([crashed]) .tab-icon-overlay -{ - top: -8px !important; - inset-inline-end: -8px !important; -} - -.tab-icon-overlay[indicator-replaces-favicon], -.tab-icon-stack[indicator-replaces-favicon] > :not(.tab-icon-overlay) -{ - opacity: 1 !important; -} - -.tabbrowser-tab:not([pinned]) .tab-icon-stack > * -{ - margin-inline-end: 10px !important; -} - -.tabbrowser-tab:is([pinned], [image], [sharing], [pictureinpicture]):is([soundplaying], [muted], [activemedia-blocked]):not([crashed]) .tab-icon-stack > :not(.tab-icon-overlay) -{ - mask-image: url("svg_files/media/Media.svg"); - mask-size: 16px 16px; -} - -:root:-moz-locale-dir(rtl) .tabbrowser-tab:is([pinned], [image], [sharing], [pictureinpicture]):is([soundplaying], [muted], [activemedia-blocked]):not([crashed]) .tab-icon-stack > :not(.tab-icon-overlay) -{ - mask-image: url("svg_files/media/Media_rtl.svg"); - mask-size: 16px 16px; -} - -/* ---------- Picture-In-Picture ---------- */ - -.tabbrowser-tab[pictureinpicture]:not([busy], [crashed]) .tab-icon-stack::before -{ - content: ""; - display: block; - position: absolute; - width: 16px; - height: 16px; - background-color: currentColor; - mask-size: 16px 16px; - mask-position: center center; - mask-repeat: no-repeat; -} - -:root:-moz-locale-dir(rtl) .tabbrowser-tab[pictureinpicture]:not([busy], [crashed]) .tab-icon-stack::before -{ - transform: rotateY(180deg); -} - -.tabbrowser-tab[pictureinpicture]:not([busy], [crashed]) .tab-icon-stack > :not(.tab-icon-overlay) -{ - position: relative !important; - padding: 2px !important; - inset-inline-start: 8px !important; - top: 8px !important; - mask-image: none !important; - box-sizing: border-box !important; - z-index: 1 !important; -} - -.tabbrowser-tab[pictureinpicture]:not([busy], [crashed]):not([soundplaying], [muted], [activemedia-blocked]) .tab-icon-stack::before -{ - mask-image: url("svg_files/media/PIP.svg"); -} - -.tabbrowser-tab[pictureinpicture]:not([busy], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) .tab-icon-stack::before -{ - mask-image: url("svg_files/media/PIP_Sound.svg"); -} - -/* -------------------- Tab Text -------------------- */ - -.tab-label-container -{ - height: var(--tab-min-height) !important; - font-size: 12px !important; -} - -.tab-label -{ - width: 100% !important; - height: 16px !important; - line-height: 16px !important; - overflow: hidden !important; - text-overflow: ellipsis !important; - margin-block: 0px !important; -} - -#tabbrowser-tabs[secondarytext-unsupported] .tab-label -{ - height: var(--tab-min-height) !important; - line-height: var(--tab-min-height) !important; -} - -.tab-secondary-label -{ - width: 100% !important; - height: 16px !important; - line-height: 16px !important; - overflow: hidden !important; - margin-block: 0px !important; - order: -1 !important; -} - -.tab-secondary-label > * -{ - width: 100% !important; - height: 16px !important; - line-height: 16px !important; - overflow: hidden !important; - text-overflow: ellipsis !important; -} - /* ---------------------------------------- Tab Bar ---------------------------------------- */ #TabsToolbar #search-container From 78d383875984e22319e8fb52ba53d45ea9712d32 Mon Sep 17 00:00:00 2001 From: QNetITQ <85301851+QNetITQ@users.noreply.github.com> Date: Wed, 13 Nov 2024 18:19:38 +0300 Subject: [PATCH 31/35] Update userChrome.css --- chrome/userChrome.css | 31 ++++++++++++++++--------------- 1 file changed, 16 insertions(+), 15 deletions(-) diff --git a/chrome/userChrome.css b/chrome/userChrome.css index a5013477..7ec3ac50 100644 --- a/chrome/userChrome.css +++ b/chrome/userChrome.css @@ -2,20 +2,21 @@ /* ---------- Horizontal Tabs ---------- */ -@import "modules/horizontal_tabs/wavefox_tab_shapes.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); -@import "modules/horizontal_tabs/wavefox_tabs.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); -@import "modules/horizontal_tabs/wavefox_drag_space.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); -@import "modules/horizontal_tabs/wavefox_selected_tab_indicator.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); -@import "modules/horizontal_tabs/wavefox_toolbar_transparency.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); -@import "modules/horizontal_tabs/wavefox_tab_shadows.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); -@import "modules/horizontal_tabs/wavefox_tab_separators.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); -@import "modules/horizontal_tabs/wavefox_tabs_on_bottom.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); -@import "modules/horizontal_tabs/wavefox_one_line.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); -@import "modules/horizontal_tabs/wavefox_toolbar_buttons.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); -@import "modules/horizontal_tabs/wavefox_context_menu_densities.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); -@import "modules/horizontal_tabs/wavefox_rounded_web_page.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.revamp"); -@import "modules/horizontal_tabs/wavefox_transparency_on_linux.css" layer(BasicPriority) /* supports() */ (-moz-platform: linux); -@import "modules/horizontal_tabs/wavefox_transparency_on_windows.css" layer(BasicPriority) /* supports() */ (-moz-platform: windows); -@import "Lepton_Icons/icons/Lepton_Icons.css" layer(BasicPriority) /* supports() */ (-moz-bool-pref: "userChrome.Menu.Icons.LeptonIcons.Enabled"); +@import "modules/horizontal_tabs/wavefox_tab_shapes.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); +@import "modules/horizontal_tabs/wavefox_tabs.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); +@import "modules/horizontal_tabs/wavefox_drag_space.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); +@import "modules/horizontal_tabs/wavefox_selected_tab_indicator.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); +@import "modules/horizontal_tabs/wavefox_toolbar_transparency.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); +@import "modules/horizontal_tabs/wavefox_tab_shadows.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); +@import "modules/horizontal_tabs/wavefox_tab_separators.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); +@import "modules/horizontal_tabs/wavefox_tabs_on_bottom.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); +@import "modules/horizontal_tabs/wavefox_one_line.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); +@import "modules/horizontal_tabs/wavefox_toolbar_buttons.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); +@import "modules/horizontal_tabs/wavefox_context_menu_densities.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); +@import "modules/horizontal_tabs/wavefox_tab_media_icons_and_text.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.verticalTabs"); +@import "modules/horizontal_tabs/wavefox_rounded_web_page.css" layer(BasicPriority) /* supports() */ not (-moz-bool-pref: "sidebar.revamp"); +@import "modules/horizontal_tabs/wavefox_transparency_on_linux.css" layer(BasicPriority) /* supports() */ (-moz-platform: linux); +@import "modules/horizontal_tabs/wavefox_transparency_on_windows.css" layer(BasicPriority) /* supports() */ (-moz-platform: windows); +@import "Lepton_Icons/icons/Lepton_Icons.css" layer(BasicPriority) /* supports() */ (-moz-bool-pref: "userChrome.Menu.Icons.LeptonIcons.Enabled"); /* ---------------------------------------- Third-party styles (Maximum priority) ---------------------------------------- */ From fba7f24ea7941fe5ca9db512157d51d62c9bff13 Mon Sep 17 00:00:00 2001 From: QNetITQ <85301851+QNetITQ@users.noreply.github.com> Date: Thu, 14 Nov 2024 13:25:20 +0300 Subject: [PATCH 32/35] Update wavefox_tabs.css --- chrome/modules/horizontal_tabs/wavefox_tabs.css | 1 + 1 file changed, 1 insertion(+) diff --git a/chrome/modules/horizontal_tabs/wavefox_tabs.css b/chrome/modules/horizontal_tabs/wavefox_tabs.css index f87a9668..f19da2bc 100644 --- a/chrome/modules/horizontal_tabs/wavefox_tabs.css +++ b/chrome/modules/horizontal_tabs/wavefox_tabs.css @@ -84,6 +84,7 @@ { --tab-shadow-max-size: 0px !important; --tab-attention-indicator-position: 50% calc(50% + 12px); + --tabstrip-min-height: auto !important; } /* ---------------------------------------- Nav Bar ---------------------------------------- */ From 043bbe163d380cfab8dbc5015d74345d05056f57 Mon Sep 17 00:00:00 2001 From: QNetITQ <85301851+QNetITQ@users.noreply.github.com> Date: Thu, 14 Nov 2024 19:56:22 +0300 Subject: [PATCH 33/35] Update and rename FT-Experimental.css to Experimental.css --- .../{FT-Experimental.css => Experimental.css} | 193 ++++++++++-------- 1 file changed, 104 insertions(+), 89 deletions(-) rename chrome/modules/horizontal_tabs/{FT-Experimental.css => Experimental.css} (69%) diff --git a/chrome/modules/horizontal_tabs/FT-Experimental.css b/chrome/modules/horizontal_tabs/Experimental.css similarity index 69% rename from chrome/modules/horizontal_tabs/FT-Experimental.css rename to chrome/modules/horizontal_tabs/Experimental.css index d4f0175b..639e049e 100644 --- a/chrome/modules/horizontal_tabs/FT-Experimental.css +++ b/chrome/modules/horizontal_tabs/Experimental.css @@ -1,19 +1,108 @@ /* ---------------------------------------- Custom properties ---------------------------------------- */ -@property --wavefox-ft-border-radius +@property --wavefox-ft-tab-border-radius { syntax: ""; inherits: true; initial-value: 4px; } -@property --wavefox-ft-shadow +/* ---------------------------------------- Density ---------------------------------------- */ + +:root { - syntax: "*"; - inherits: true; - initial-value: none; + --tab-min-height: 36px !important; + + &[uidensity="compact"] + { + --tab-min-height: 32px !important; + } + + &[uidensity="touch"] + { + --tab-min-height: 40px !important; + } +} + +/* ---------------------------------------- Titlebar ---------------------------------------- */ + +:root[tabsintitlebar] +{ + .browser-titlebar + { + will-change: auto !important; + transition: color var(--inactive-window-transition) !important; + + &:-moz-window-inactive + { + color: color-mix(in srgb, currentColor calc(var(--inactive-titlebar-opacity) * 100%), transparent) !important; + opacity: 1 !important; + } + } +} + +/* ---------------------------------------- Tabs ---------------------------------------- */ + +.tabbrowser-tab +{ + &[pinned] .tab-content + { + padding-inline: calc((var(--tab-min-height) - 16px) / 2) !important; + } + + &:not([pinned]) .tab-content + { + padding-inline: 10px !important; + } + + &[pending] .tab-icon-image + { + filter: saturate(0) !important; + } + + .tab-background + { + border-radius: var(--wavefox-ft-tab-border-radius) !important; + } + + .tab-close-button + { + width: 16px !important; + height: 16px !important; + border-radius: 50% !important; + padding: 2px !important; + margin: 0px !important; + } +} + +/* ---------------------------------------- Indents ---------------------------------------- */ + +#tabbrowser-tabs:not([overflow]) .tabbrowser-tab:nth-child(1 of .tabbrowser-tab:not([pinned], [hidden])) +{ + margin-inline-start: 0px !important; } + + + + + + + + + + + + + + + + + + + + + /* ---------------------------------------- Floating tabs ---------------------------------------- */ @media (-moz-bool-pref: "userChrome.Tabs.Option1.Enabled") or @@ -47,106 +136,32 @@ } } - - - - - - - - - - - - - - - - - - - -/* ---------------------------------------- Density ---------------------------------------- */ -:root[uidensity="compact"] -{ - --tab-min-height: 32px !important; -} -:root -{ - --tab-min-height: 36px !important; -} -:root[uidensity="touch"] -{ - --tab-min-height: 40px !important; -} -/* ---------------------------------------- Titlebar ---------------------------------------- */ -:root[tabsintitlebar] -{ - .browser-titlebar - { - will-change: auto !important; - transition: color var(--inactive-window-transition) !important; - &:-moz-window-inactive - { - color: color-mix(in srgb, currentColor calc(var(--inactive-titlebar-opacity) * 100%), transparent) !important; - opacity: 1 !important; - } - } -} -/* ---------------------------------------- Tabs ---------------------------------------- */ +/* ---------------------------------------- Attached tabs ---------------------------------------- */ + + + + + + + + + -.tabbrowser-tab -{ - --tab-label-mask-size: 0px !important; - .tab-background - { - border-radius: var(--wavefox-ft-border-radius) !important; - } - &[pinned] .tab-content - { - padding-inline: calc((var(--tab-min-height) - 16px) / 2 + var(--pinned-tabs-width-offset, 0px)) !important; - } - &:not([pinned]) .tab-content - { - padding-inline: 10px !important; - } -} -.tabbrowser-tab[visuallyselected] .tab-background -{ - box-shadow: var(--wavefox-ft-shadow) !important; -} -.tabbrowser-tab[pending] .tab-icon-image -{ - filter: saturate(0) !important; -} -.tab-close-button -{ - width: 16px !important; - height: 16px !important; - border-radius: 50% !important; - padding: 2px !important; - margin: 0px !important; -} -/* ---------------------------------------- Indents ---------------------------------------- */ -#tabbrowser-tabs:not([overflow]) .tabbrowser-tab:nth-child(1 of .tabbrowser-tab:not([pinned], [hidden])) -{ - margin-inline-start: 0px !important; -} 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 34/35] 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 @@ + + +} From e3e28c6839a82ef31443091bbc97212c6a2a4415 Mon Sep 17 00:00:00 2001 From: QNetITQ <85301851+QNetITQ@users.noreply.github.com> Date: Thu, 14 Nov 2024 23:09:15 +0300 Subject: [PATCH 35/35] Firefox 133 / WaveFox v1.7.133 --- chrome/userChrome.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/chrome/userChrome.css b/chrome/userChrome.css index 7ec3ac50..405a91ef 100644 --- a/chrome/userChrome.css +++ b/chrome/userChrome.css @@ -1,4 +1,4 @@ -@layer BasicPriority, HighPriority, VeryHighPriority; +@layer BasicPriority, HighPriority, VeryHighPriority; /* ---------- Horizontal Tabs ---------- */