diff --git a/README.md b/README.md index c8eefad..24bbb4c 100644 --- a/README.md +++ b/README.md @@ -10,22 +10,19 @@ A Firefox userChrome.css theme that aims to recreate the look and feel of the Ch 3. Go to about:config and change these preferences: ### For all operating systems: - * `toolkit.legacyUserProfileCustomizations.stylesheets` = `true` - * `svg.context-properties.content.enabled` = `true` - * `layout.css.color-mix.enabled` = `true` - - ### Firefox 119.0 and above: - * `layout.css.light-dark.enabled` = `true` + 1. `toolkit.legacyUserProfileCustomizations.stylesheets` = `true` + 2. `svg.context-properties.content.enabled` = `true` + 3. `layout.css.color-mix.enabled` = `true` ### On macOS: - * To use the Edge style context menu on macOS then set `widget.macos.native-context-menus` = `false` + 1. To use the Edge style context menu on macOS then set `widget.macos.native-context-menus` = `false` ### Recommended: - * `browser.tabs.tabMinWidth` = `66` - * `browser.tabs.tabClipWidth` = `86` + 1. `browser.tabs.tabMinWidth` = `66` + 2. `browser.tabs.tabClipWidth` = `86` ### Optional: - * To use the light theme in private browsing mode set `browser.theme.dark-private-windows` = `false` + 1. To use the light theme in private browsing mode set `browser.theme.dark-private-windows` = `false` Additional tweaks can also be applied to the theme, such as Mica (Windows 11 Only), Floating Tabs and more. See [Tweaks](#tweaks). @@ -73,7 +70,6 @@ To disable a tweak, set the key to `false` or delete it, then restart the browse | enable Mica toolbar background *(Windows 11 only)* | | ------------------------------------------------------------------- | -| **BROKEN ON NEWER VERSIONS OF FIREFOX** | | **See [Mica Tweak Instructions][3] for installation instructions.** | | **NOTE: Only works on default theme: 'System theme - auto'** | | `uc.tweak.win11-mica` | @@ -106,7 +102,6 @@ To disable a tweak, set the key to `false` or delete it, then restart the browse | `uc.tweak.show-tab-close-button-on-hover` | ## Mica Tweak Instructions (Windows 11 Only) -NOTE: Broken on newer versions of Firefox. 1. Download and install [Mica For Everyone][2]. 2. Create a custom process rule with the following: 1. Name: `firefox` diff --git a/chrome/content/common.css b/chrome/content/common.css index 46d324a..469f685 100644 --- a/chrome/content/common.css +++ b/chrome/content/common.css @@ -1,4 +1,4 @@ -/* Edge-Frfox - content/common.css */ +/* EdgeFr-Fox by bmFtZQ - content/common.css */ /* colours */ @-moz-document url-prefix(about:) { diff --git a/chrome/content/newtab.css b/chrome/content/newtab.css index 399cee2..bddfe20 100644 --- a/chrome/content/newtab.css +++ b/chrome/content/newtab.css @@ -1,10 +1,11 @@ -/* Edge-Frfox - content/newtab.css */ +/* EdgeFr-Fox by bmFtZQ - content/newtab.css */ /* colours */ @-moz-document url-prefix("about:newtab"), url-prefix("about:home"), url-prefix("about:firefoxview") { - :root:not([lwt-newtab], [lwt-newtab-brighttext]) { + :root:not([lwt-newtab]) > body:not([lwt-newtab]), + :is(:root, body)[style*="--newtab-background-color: rgb(249, 249, 251)"] { --newtab-background-color: #F7F7F7 !important; --newtab-background-color-secondary: #fff !important; --newtab-text-primary-color: #252525 !important; @@ -32,7 +33,8 @@ url-prefix("about:firefoxview") { --newtab-button-secondary-color: inherit !important; } - :root:not([style*="color"])[lwt-newtab-brighttext] { + :is(:root, body)[style*="--newtab-background-color: rgb(43, 42, 51)"][lwt-newtab-brighttext], + :is(:root, body):not([style*="color"])[lwt-newtab-brighttext] { --newtab-background-color: #252525 !important; --newtab-background-color-secondary: #4A4A4A !important; --newtab-text-primary-color: #fff !important; diff --git a/chrome/global/browser.css b/chrome/global/browser.css index 647a4bd..b5572ae 100644 --- a/chrome/global/browser.css +++ b/chrome/global/browser.css @@ -1,4 +1,4 @@ -/* Edge-Frfox - browser.css */ +/* EdgeFr-Fox 2 - browser */ @supports (-moz-bool-pref("uc.tweak.floating-tabs")) { :root { diff --git a/chrome/global/colors.css b/chrome/global/colors.css index a4219dd..2be755b 100644 --- a/chrome/global/colors.css +++ b/chrome/global/colors.css @@ -1,78 +1,138 @@ -/* Edge-Frfox - colors.css */ +/* EdgeFr-Fox by bmFtZQ - colors.css */ -/* default colours (light & dark) */ +/* light */ :root:not(:-moz-lwtheme), -:root[privatebrowsingmode="temporary"][style*="--lwt-accent-color: rgb(28, 27, 34)"] { - --lwt-accent-color: light-dark(#cecece, #1C1C1C) !important; - --lwt-accent-color-inactive: light-dark(#e8e8e8, #2e2e2e) !important; - --lwt-text-color: light-dark(#000, #E5E5E5) !important; - --toolbar-bgcolor: light-dark(#f7f7f7, #3B3B3B) !important; - --toolbar-color: light-dark(#000, #fff) !important; - --toolbarbutton-icon-fill: light-dark(#000, #fff) !important; - --chrome-content-separator-color: light-dark(#bfbfbf, #686868) !important; - --lwt-toolbarbutton-icon-fill-attention: light-dark(#0078D4, #4C98D1) !important; - --toolbarbutton-icon-fill-attention: light-dark(#0078D4, #4C98D1) !important; +:root[style*="--lwt-accent-color: rgb(240, 240, 244)"] { + --lwt-accent-color: #cecece !important; + --lwt-accent-color-inactive: #e8e8e8 !important; + --lwt-text-color: #000 !important; + --toolbar-bgcolor: #f7f7f7 !important; + --toolbar-color: #000 !important; + --toolbarbutton-icon-fill: #000 !important; + --chrome-content-separator-color: #bfbfbf !important; + --lwt-toolbarbutton-icon-fill-attention: #0078D4 !important; + --toolbarbutton-icon-fill-attention: #0078D4 !important; --lwt-tab-text: var(--toolbar-color) !important; - --lwt-selected-tab-background-color: unset !important; - --tab-selected-bgcolor: unset !important; - --toolbar-field-background-color: light-dark(#fff, #2B2B2B) !important; - --toolbar-field-color: light-dark(#000, #fff) !important; - --toolbar-field-border-color: light-dark(#0000, #0000) !important; + --lwt-selected-tab-background-color: var(--toolbar-bgcolor) !important; + --tab-selected-bgcolor: var(--toolbar-bgcolor) !important; + --toolbar-field-background-color: #fff !important; + --toolbar-field-color: #000 !important; + --toolbar-field-border-color: #0000 !important; --toolbar-field-focus-background-color: var(--toolbar-field-background-color) !important; --toolbar-field-focus-color: var(--toolbar-field-color) !important; - --toolbar-field-focus-border-color: light-dark(#0055D7, #63ADE5) !important; - --urlbar-hover-highlight-color: light-dark(rgba(192, 192, 192, 0.5), rgba(128, 128, 128, 0.5)) !important; - --urlbar-box-bgcolor: light-dark(rgba(0, 0, 0, 0.09), rgba(255, 255, 255, 0.11)) !important; - --urlbar-box-hover-bgcolor: light-dark(rgba(0, 0, 0, 0.09), rgba(255, 255, 255, 0.11)) !important; - --urlbar-box-focus-bgcolor: light-dark(rgba(0, 0, 0, 0.22), rgba(255, 255, 255, 0.28)) !important; - --urlbar-icon-fill-opacity: 1 !important; - --urlbar-popup-url-color: light-dark(#0072C9, #75B6E8) !important; + --toolbar-field-focus-border-color: #0055D7 !important; + --urlbar-hover-highlight-color: rgba(192, 192, 192, 0.5) !important; + --urlbar-box-bgcolor: rgba(0, 0, 0, 0.09) !important; + --urlbar-box-hover-bgcolor: rgba(0, 0, 0, 0.09) !important; + --urlbar-box-focus-bgcolor: rgba(0, 0, 0, 0.22) !important; + --urlbar-icon-fill-opacity: 0.6 !important; + --urlbar-popup-url-color: #0072C9 !important; --lwt-brighttext-url-color: var(--urlbar-popup-url-color) !important; - --autocomplete-popup-background: light-dark(#fff, #4A4A4A) !important; - --autocomplete-popup-color: light-dark(#fff, #fff) !important; - --autocomplete-popup-highlight-background: light-dark(#f2f2f2, #383838) !important; - --autocomplete-popup-hover-background: light-dark(#e5e5e5, #444444) !important; - --autocomplete-popup-separator-color: light-dark(#dadada00, #63636300) !important; - --button-bgcolor: light-dark(#EDEDED, #5C5C5C) !important; - --button-hover-bgcolor: light-dark(#e5e5e5, #646464) !important; - --button-active-bgcolor: light-dark(#d5d5d5, #575757) !important; - --button-primary-bgcolor: light-dark(#0078D4, #006CBE) !important; - --button-primary-hover-bgcolor: light-dark(#006CBE, #0078D4) !important; - --button-primary-active-bgcolor: light-dark(#1683D8, #005CA3) !important; - --button-primary-color: light-dark(#fff, #fff) !important; - --error-text-color: light-dark(#FF9AA2, #FF9AA2) !important; - --input-bgcolor: light-dark(#fff, #4A4A4A) !important; - --input-color: light-dark(#2b2b2b, #fff) !important; - --input-border-color: light-dark(#bebebe, #8A8A8A) !important; - --input-error-border-color: light-dark(#FF848A, #FF848A) !important; - --zoom-controls-bgcolor: light-dark(#4A4A4A, #4A4A4A) !important; - --arrowpanel-background: light-dark(#fff, #4A4A4A) !important; - --arrowpanel-color: light-dark(#1c1c1c, #fff) !important; - --panel-description-color: light-dark(#000a, #fffb) !important; - --panel-disabled-color: light-dark(#9E9E9E, #ABABAA) !important; - --arrowpanel-dimmed: light-dark(#565656, #565656) !important; - --arrowpanel-dimmed-further: light-dark(#707070, #707070) !important; - --panel-item-hover-bgcolor: light-dark(#eee, #646464) !important; - --panel-item-active-bgcolor: light-dark(#ddd, #747474) !important; - --arrowpanel-border-color: light-dark(#dadada, #636363) !important; - --panel-separator-color: light-dark(#dadada, #636363) !important; - --panel-banner-item-update-supported-bgcolor: light-dark(#188038, #81C995) !important; - --focus-outline-color: light-dark(#0055D7, #63ADE5) !important; + --autocomplete-popup-background: #fff !important; + --autocomplete-popup-color: #fff !important; + --autocomplete-popup-highlight-background: #f2f2f2 !important; + --autocomplete-popup-hover-background: #e5e5e5 !important; + --autocomplete-popup-separator-color: #dadada00 !important; + --button-bgcolor: #EDEDED !important; + --button-hover-bgcolor: #e5e5e5 !important; + --button-active-bgcolor: #d5d5d5 !important; + --button-primary-bgcolor: #0078D4 !important; + --button-primary-hover-bgcolor: #006CBE !important; + --button-primary-active-bgcolor: #1683D8 !important; + --button-primary-color: #fff !important; + --error-text-color: #FF9AA2 !important; + --input-bgcolor: #fff !important; + --input-color: #2b2b2b !important; + --input-border-color: #bebebe !important; + --input-error-border-color: #FF848A !important; + --zoom-controls-bgcolor: #4A4A4A !important; + --arrowpanel-background: #fff !important; + --arrowpanel-color: #1c1c1c !important; + --panel-description-color: #000a !important; + --panel-disabled-color: #9E9E9E !important; + --arrowpanel-dimmed: #565656 !important; + --arrowpanel-dimmed-further: #707070 !important; + --panel-item-hover-bgcolor: #eee !important; + --panel-item-active-bgcolor: #ddd !important; + --arrowpanel-border-color: #dadada !important; + --panel-separator-color: #dadada !important; + --panel-banner-item-update-supported-bgcolor: #188038 !important; + --focus-outline-color: #0055D7 !important; --panel-shortcut-color: inherit !important; --uc-urlbar-shadow: 0 0 4px rgba(0, 0, 0, 0.1); - --toolbarbutton-hover-background: light-dark(rgba(0, 0, 0, 0.08), rgba(255, 255, 255, 0.1)) !important; - --toolbarbutton-active-background: light-dark(rgba(0, 0, 0, 0.12), rgba(255, 255, 255, 0.16)) !important; + --toolbarbutton-hover-background: rgba(0, 0, 0, 0.08) !important; + --toolbarbutton-active-background: rgba(0, 0, 0, 0.12) !important; --uc-private-browsing-indicator: var(--button-primary-bgcolor); --uc-private-browsing-indicator-text: var(--button-primary-color); - --tab-icon-overlay-stroke: light-dark(#fff, #4b4b4b) !important; - --tab-icon-overlay-fill: light-dark(#252525, #fff) !important; + --tab-icon-overlay-stroke: #fff !important; + --tab-icon-overlay-fill: #252525 !important; } -/* ensure that dark mode is enabled completely in private browsing mode. */ -:root[privatebrowsingmode="temporary"], -:root[privatebrowsingmode="temporary"] #nav-bar, -:root[privatebrowsingmode="temporary"] #PersonalToolbar { - color-scheme: dark !important; +/* dark */ +:root[lwt-default-theme-in-dark-mode="true"], +:root[style*="--lwt-accent-color: rgb(28, 27, 34)"] { + --lwt-accent-color: #1C1C1C !important; + --lwt-accent-color-inactive: #2e2e2e !important; + --lwt-text-color: #E5E5E5 !important; + --toolbar-bgcolor: #3B3B3B !important; + --toolbar-color: #fff !important; + --toolbarbutton-icon-fill: #fff !important; + --chrome-content-separator-color: #686868 !important; + --lwt-toolbarbutton-icon-fill-attention: #4C98D1 !important; + --toolbarbutton-icon-fill-attention: #4C98D1 !important; + --lwt-tab-text: var(--toolbar-color) !important; + --lwt-selected-tab-background-color: var(--toolbar-bgcolor) !important; + --tab-selected-bgcolor: var(--toolbar-bgcolor) !important; + --toolbar-field-background-color: #2B2B2B !important; + --toolbar-field-color: #fff !important; + --toolbar-field-border-color: #0000 !important; + --toolbar-field-focus-background-color: var(--toolbar-field-background-color) !important; + --toolbar-field-focus-color: var(--toolbar-field-color) !important; + --toolbar-field-focus-border-color: #63ADE5 !important; + --urlbar-hover-highlight-color: rgba(128, 128, 128, 0.5) !important; + --urlbar-box-bgcolor: rgba(255, 255, 255, 0.11) !important; + --urlbar-box-hover-bgcolor: rgba(255, 255, 255, 0.11) !important; + --urlbar-box-focus-bgcolor: rgba(255, 255, 255, 0.28) !important; + --urlbar-icon-fill-opacity: 1 !important; + --urlbar-popup-url-color: #75B6E8 !important; + --lwt-brighttext-url-color: var(--urlbar-popup-url-color) !important; + --autocomplete-popup-background: #4A4A4A !important; + --autocomplete-popup-color: #fff !important; + --autocomplete-popup-highlight-background: #383838 !important; + --autocomplete-popup-hover-background: #444444 !important; + --autocomplete-popup-separator-color: #63636300 !important; + --button-bgcolor: #5C5C5C !important; + --button-hover-bgcolor: #646464 !important; + --button-active-bgcolor: #575757 !important; + --button-primary-bgcolor: #006CBE !important; + --button-primary-hover-bgcolor: #0078D4 !important; + --button-primary-active-bgcolor: #005CA3 !important; + --button-primary-color: #fff !important; + --error-text-color: #FF9AA2 !important; + --input-bgcolor: #4A4A4A !important; + --input-color: #fff !important; + --input-border-color: #8A8A8A !important; + --input-error-border-color: #FF848A !important; + --zoom-controls-bgcolor: #4A4A4A !important; + --arrowpanel-background: #4A4A4A !important; + --arrowpanel-color: #fff !important; + --panel-description-color: #fffb !important; + --panel-disabled-color: #ABABAA !important; + --arrowpanel-dimmed: #565656 !important; + --arrowpanel-dimmed-further: #707070 !important; + --panel-item-hover-bgcolor: #646464 !important; + --panel-item-active-bgcolor: #747474 !important; + --arrowpanel-border-color: #636363 !important; + --panel-separator-color: #636363 !important; + --panel-banner-item-update-supported-bgcolor: #81C995 !important; + --focus-outline-color: #63ADE5 !important; + --panel-shortcut-color: inherit !important; + --toolbarbutton-hover-background: rgba(255, 255, 255, 0.1) !important; + --toolbarbutton-active-background: rgba(255, 255, 255, 0.16) !important; + --uc-private-browsing-indicator: var(--button-primary-bgcolor); + --uc-private-browsing-indicator-text: var(--button-primary-color); + --tab-icon-overlay-stroke: #4b4b4b !important; + --tab-icon-overlay-fill: #fff !important; } #urlbar { @@ -82,20 +142,38 @@ } /* Change Colour of page when loading */ -:root:not(:-moz-lwtheme) #tabbrowser-tabpanels { - background-color: light-dark(#f7f7f7, #252525) !important; +:root:not(:-moz-lwtheme) #tabbrowser-tabpanels, +:root[style*="--lwt-accent-color: rgb(240, 240, 244)"] #tabbrowser-tabpanels { + background-color: #f7f7f7 !important; +} + +:root[lwt-default-theme-in-dark-mode="true"] #tabbrowser-tabpanels, +:root[style*="--lwt-accent-color: rgb(28, 27, 34)"] #tabbrowser-tabpanels { + background-color: #252525 !important; } /* make the titlebar buttons black/white on default themes */ -:root:not(:-moz-lwtheme)[tabsintitlebar] .titlebar-buttonbox { - color: light-dark(#000, #fff) !important; +:root:not(:-moz-lwtheme)[tabsintitlebar] .titlebar-buttonbox, +:root[style*="--lwt-accent-color: rgb(240, 240, 244)"][tabsintitlebar] .titlebar-buttonbox { + color: #000 !important; +} + +:root[lwt-default-theme-in-dark-mode="true"][tabsintitlebar] .titlebar-buttonbox, +:root[style*="--lwt-accent-color: rgb(28, 27, 34)"][tabsintitlebar] .titlebar-buttonbox { + color: #fff !important; } #statuspanel-label { background-color: var(--toolbar-field-focus-background-color) !important; color: var(--toolbar-field-focus-color) !important; border-color: transparent !important; - box-shadow: 0 2px 5px #0004, 0 0 0 1px light-dark(#0002, #0004) !important; + box-shadow: 0 2px 5px #0004, 0 0 0 1px #0002 !important; +} + +@media (prefers-color-scheme: dark) { + #statuspanel-label { + box-shadow: 0 2px 5px #0004, 0 0 0 1px #0004 !important; + } } @media (-moz-platform: windows) { @@ -197,33 +275,57 @@ /* side bar theme */ #sidebar-box:not([lwt-sidebar]) { - --sidebar-background-color: light-dark(#f7f7f7, #3b3b3b) !important; - --sidebar-text-color: light-dark(#000, #fff) !important; + --sidebar-background-color: #f7f7f7 !important; + --sidebar-text-color: #000 !important; appearance: none !important; } +#sidebar-box[style*="--sidebar-background-color: rgb(56, 56, 61"] { + --sidebar-background-color: #3B3B3B !important; + --sidebar-text-color: #fff !important; +} + #browser:not([style*="--sidebar-border-color"]) { - --sidebar-border-color: light-dark(#bfbfbf, #686868) !important; + --sidebar-border-color: #bfbfbf !important; +} + +#browser[style*="--sidebar-border-color: rgba(255, 255, 255"] { + --sidebar-border-color: #686868 !important; } .sidebar-panel:not([lwt-sidebar]) { - color: light-dark(#000, #fff) !important; - scrollbar-color: light-dark(#0006, #fff6) light-dark(#f7f7f740, #3b3b3b40) !important; + color: #000 !important; } @-moz-document url(chrome://browser/content/syncedtabs/sidebar.xhtml){ - body { - background: transparent !important; - } +body { + background: transparent !important; +} +} + +.sidebar-panel[lwt-sidebar-brighttext][style*="--lwt-sidebar-background-color: rgb(56, 56, 61)"], +body[lwt-sidebar-brighttext][style*="--lwt-sidebar-background-color: rgb(56, 56, 61)"] { + --lwt-sidebar-background-color: #3B3B3B !important; + --lwt-sidebar-text-color: #fff !important; + scrollbar-color: #fff6 #3B3B3B40 !important; } @media(-moz-platform: windows) { .sidebar-panel:not([lwt-sidebar]) #sidebar-search-container>#search-box, .sidebar-panel:not([lwt-sidebar]) #viewButton { appearance: none !important; - background-color: light-dark(#fff, #2b2b2b) !important; + background-color: #fff !important; color: inherit !important; - border: 1px solid light-dark(#bfbfbf, #686868) !important; + border: 1px solid #bfbfbf !important; + border-radius: 2px !important; + } + + .sidebar-panel[lwt-sidebar-brighttext][style*="--lwt-sidebar-background-color: rgb(56, 56, 61)"] #sidebar-search-container>#search-box, + .sidebar-panel[lwt-sidebar-brighttext][style*="--lwt-sidebar-background-color: rgb(56, 56, 61)"] #viewButton { + appearance: none !important; + background-color: #2B2B2B !important; + color: inherit !important; + border: 1px solid #686868 !important; border-radius: 2px !important; } } diff --git a/chrome/global/popup.css b/chrome/global/popup.css index 73c1976..6b8f31d 100644 --- a/chrome/global/popup.css +++ b/chrome/global/popup.css @@ -1,4 +1,4 @@ -/* Edge-Frfox - popup.css */ +/* EdgeFr-Fox by bmFtZQ - popup.css */ :root { --panel-subview-body-padding: 2px 0 !important; diff --git a/chrome/global/tweaks.css b/chrome/global/tweaks.css index baf00d5..e9550f1 100644 --- a/chrome/global/tweaks.css +++ b/chrome/global/tweaks.css @@ -1,4 +1,4 @@ -/* Edge-Frfox - tweaks.css */ +/* EdgeFr-Fox by bmFtZQ - tweaks.css */ /* disable drag space above tabs */ @supports -moz-bool-pref("uc.tweak.disable-drag-space") { @@ -28,14 +28,21 @@ bugs with certain themes eg. dark text on dark background.) */ @supports -moz-bool-pref("uc.tweak.floating-tabs") { :root:not(:-moz-lwtheme), - :root[privatebrowsingmode="temporary"][style*="--lwt-accent-color: rgb(28, 27, 34)"] { - --lwt-accent-color: light-dark(#f3f3f3, #202020) !important; + :root[style*="--lwt-accent-color: rgb(240, 240, 244)"] { + --lwt-accent-color: #f3f3f3 !important; --lwt-accent-color-inactive: unset !important; - --toolbar-bgcolor: light-dark(#fff, #4D4D4D) !important; - --lwt-tab-text: light-dark(#262626, #fff) !important; - --chrome-content-separator-color: light-dark(#bfbfbf, #535353) !important; + --toolbar-bgcolor: #fff !important; + --lwt-tab-text: #262626 !important; --uc-urlbar-shadow: none !important; - --uc-tab-border-color: light-dark(#0000, #fff1) !important; + } + + :root[lwt-default-theme-in-dark-mode="true"], + :root[style*="--lwt-accent-color: rgb(28, 27, 34)"] { + --lwt-accent-color: #202020 !important; + --toolbar-bgcolor: #4D4D4D !important; + --lwt-accent-color-inactive: unset !important; + --chrome-content-separator-color: #535353 !important; + --uc-tab-border-color: #ffffff0f !important; } @media (-moz-gtk-csd-available) { @@ -135,10 +142,9 @@ bugs with certain themes eg. dark text on dark background.) */ } } -/* Mica broken on newer versions of Firefox */ -/* Uncomment to enable, only works for Firefox versions lower than 115 */ -/* @media (-moz-platform: windows) { +@media (-moz-windows-compositor) { @supports -moz-bool-pref("uc.tweak.win11-mica") { + /* enable mica appearance */ #main-window:not([inFullscreen]):not(:-moz-lwtheme), #main-window:not([inFullscreen])[lwt-default-theme-in-dark-mode="true"] { appearance: -moz-win-borderless-glass !important; @@ -149,9 +155,12 @@ bugs with certain themes eg. dark text on dark background.) */ background: transparent !important; } + /* force tab color (for the tab transparency) */ .tab-background:is([selected], [multiselected]) { background: var(--toolbar-bgcolor) !important; } + + /* color adjustments */ :root:not([inFullscreen]):not(:-moz-lwtheme):not(:-moz-window-inactive) { --lwt-accent-color: #00000020 !important; } @@ -168,6 +177,7 @@ bugs with certain themes eg. dark text on dark background.) */ } } + /* line up buttons with duplicate icons from -moz-win-glass */ :root:is(:not(:-moz-lwtheme), [lwt-default-theme-in-dark-mode="true"]) .titlebar-buttonbox-container { --uc-titlebar-button-size: 30px; --uc-titlebar-size: calc(var(--tab-min-height) + var(--tab-block-margin)); @@ -186,7 +196,7 @@ bugs with certain themes eg. dark text on dark background.) */ padding-right: 19px !important; } } -} */ +} @media not (-moz-platform: macos) { @supports not -moz-bool-pref("uc.tweak.revert-context-menu") { diff --git a/chrome/icons/icons.css b/chrome/icons/icons.css index 101cea3..2868cb1 100644 --- a/chrome/icons/icons.css +++ b/chrome/icons/icons.css @@ -1,8 +1,8 @@ -/* Edge-Frfox - icons.css */ +/* EdgeFr-Fox by bmFtZQ - icons.css */ /* windows 11 style window controls (no known way to detect between windows 10 and 11 so applied to both) */ -@media (-moz-platform: windows), +@media (-moz-windows-compositor), (-moz-gtk-csd-available) { .titlebar-min { list-style-image: url("win11-minimize.svg") !important; @@ -23,7 +23,7 @@ and 11 so applied to both) */ /* darkmode icon that uses thicker strokes and is easier to see (only needed at 1x scale) */ @media (max-resolution: 1dppx) { - toolbar[brighttext] .titlebar-close, + :root[lwtheme-brighttext="true"] .titlebar-close, .titlebar-close:hover { list-style-image: url("win11-close-dark.svg") !important; } diff --git a/chrome/toolbar/findbar.css b/chrome/toolbar/findbar.css index 87bb8ba..909b778 100644 --- a/chrome/toolbar/findbar.css +++ b/chrome/toolbar/findbar.css @@ -1,4 +1,4 @@ -/* Edge-Frfox - findbar.css */ +/* EdgeFr-Fox by bmFtZQ - findbar.css */ .findbar-find-previous, .findbar-find-next, diff --git a/chrome/toolbar/navbar.css b/chrome/toolbar/navbar.css index 1eba8a2..10a832b 100644 --- a/chrome/toolbar/navbar.css +++ b/chrome/toolbar/navbar.css @@ -1,4 +1,4 @@ -/* Edge-Frfox - navbar.css */ +/* EdgeFr-Fox by bmFtZQ - navbar.css */ :root { --toolbarbutton-border-radius: 4px !important; diff --git a/chrome/toolbar/personalbar.css b/chrome/toolbar/personalbar.css index 0051896..f7127ee 100644 --- a/chrome/toolbar/personalbar.css +++ b/chrome/toolbar/personalbar.css @@ -1,4 +1,4 @@ -/* Edge-Frfox - personalbar.css */ +/* EdgeFr-Fox by bmFtZQ - personalbar.css */ #PersonalToolbar { --bookmark-block-padding: 6px !important; diff --git a/chrome/toolbar/tabbar.css b/chrome/toolbar/tabbar.css index 30e5668..dea2bbc 100644 --- a/chrome/toolbar/tabbar.css +++ b/chrome/toolbar/tabbar.css @@ -1,4 +1,4 @@ -/* Edge-Frfox - tabbar.css */ +/* EdgeFr-Fox 2 - tabbar */ @supports -moz-bool-pref("uc.tweak.floating-tabs.equal-margin") and -moz-bool-pref("uc.tweak.floating-tabs") { :root #titlebar { @@ -86,17 +86,31 @@ box-shadow: -4px 4px 0 4px var(--uc-tab-corner-bg) !important; } -.tab-background:is([selected], [multiselected]) { - --uc-tab-corner-bg: var(--tab-selected-bgcolor, var(--lwt-selected-tab-background-color, var(--toolbar-bgcolor))); +.tabbrowser-tab[selected="true"] .tab-background { + --uc-tab-corner-bg: var(--lwt-selected-tab-background-color, var(--toolbar-bgcolor)); } -.tabbrowser-tab:hover .tab-background:not([selected], [multiselected]) { +.tab-background:is([selected], [multiselected]) { + --uc-tab-corner-bg: var(--tab-selected-bgcolor, var(--toolbar-bgcolor)); +} + +#tabbrowser-tabs:not([movingtab])>#tabbrowser-arrowscrollbox>.tabbrowser-tab>.tab-stack>.tab-background[multiselected="true"]:-moz-lwtheme, +#tabbrowser-tabs:not([movingtab])>#tabbrowser-arrowscrollbox>.tabbrowser-tab>.tab-stack>.tab-background[selected="true"]:-moz-lwtheme { + background-image: linear-gradient(var(--lwt-selected-tab-background-color, transparent), var(--lwt-selected-tab-background-color, transparent)), linear-gradient(var(--toolbar-bgcolor), var(--toolbar-bgcolor)), var(--lwt-header-image, none); + --uc-tab-corner-bg: var(--lwt-selected-tab-background-color, var(--toolbar-bgcolor)); +} + +.tabbrowser-tab .tab-background:is([selected], [multiselected]) { + --uc-tab-corner-bg: var(--tab-selected-bgcolor, var(--toolbar-bgcolor)); +} + +.tabbrowser-tab:hover>.tab-stack>.tab-background:not([selected="true"], [multiselected]) { background-color: color-mix(in srgb, currentColor 8%, transparent) !important; --uc-tab-corner-bg: color-mix(in srgb, currentColor 8%, transparent) !important; } @supports not -moz-bool-pref("uc.tweak.floating-tabs") { - #Tabstoolbar:not([brighttext]) .tabbrowser-tab:hover .tab-background:not([selected], [multiselected]) { + :root:not([lwtheme-brighttext="true"]) .tabbrowser-tab:hover>.tab-stack>.tab-background:not([selected="true"], [multiselected]) { background-color: color-mix(in srgb, white 30%, transparent) !important; --uc-tab-corner-bg: color-mix(in srgb, white 30%, transparent) !important; } @@ -120,15 +134,20 @@ margin: 0 !important; } -/* fix window background colours */ +/* fix colours */ @media not (-moz-gtk-csd-available) { - :root:not(:-moz-lwtheme) #navigator-toolbox { + #navigator-toolbox:not(:-moz-lwtheme) { background-color: var(--lwt-accent-color) !important; color: var(--lwt-text-color) !important; } - :root:not(:-moz-lwtheme) #navigator-toolbox:-moz-window-inactive { - background-color: var(--lwt-accent-color-inactive, var(--lwt-accent-color)) !important; + /* force inactive window on default theme */ + @media not (-moz-platform: windows-win7) { + @media not (-moz-platform: windows-win8) { + #navigator-toolbox:-moz-window-inactive:not(:-moz-lwtheme) { + background-color: var(--lwt-accent-color-inactive, var(--lwt-accent-color)) !important; + } + } } } @@ -392,8 +411,8 @@ toolbarbutton[part="scrollbutton-down"] { 0 2px 4px rgba(0, 0, 0, 0.45), 0 0px 2px rgba(0, 0, 0, 0.2); } -#tabbrowser-tabs .tab-background:is([selected], [multiselected]), -#TabsToolbar #firefox-view-button[open] > .toolbarbutton-icon { +.tabbrowser-tab:is([visuallyselected="true"], [multiselected])>.tab-stack>.tab-background, +#TabsToolbar #firefox-view-button[open]>.toolbarbutton-icon { box-shadow: var(--uc-tab-shadow) !important; } diff --git a/chrome/toolbar/urlbar.css b/chrome/toolbar/urlbar.css index d9871fc..746951b 100644 --- a/chrome/toolbar/urlbar.css +++ b/chrome/toolbar/urlbar.css @@ -1,4 +1,4 @@ -/* Edge-Frfox - urlbar.css */ +/* EdgeFr-Fox by bmFtZQ - urlbar.css */ :root { --urlbar-min-height: 30px !important; @@ -17,8 +17,7 @@ @media not (-moz-gtk-csd-available) { #urlbar[focused="true"]:not([suppress-focus-border])>#urlbar-background:not(:-moz-lwtheme), #searchbar:not(:-moz-lwtheme):focus-within { - --uc-outline-dimmed: color-mix(in srgb, var(--toolbar-field-focus-border-color) 50%, transparent); - outline-color: light-dark(var(--uc-outline-dimmed), var(--toolbar-field-focus-border-color)) !important; + outline-color: color-mix(in srgb, var(--toolbar-field-focus-border-color) 50%, transparent) !important; } } diff --git a/chrome/userChrome.css b/chrome/userChrome.css index d8692d8..e6a952b 100644 --- a/chrome/userChrome.css +++ b/chrome/userChrome.css @@ -1,4 +1,4 @@ -/* Edge-Frfox */ +/* EdgeFr-Fox by bmFtZQ */ @import url("icons/icons.css"); @import url("toolbar/tabbar.css"); @import url("toolbar/navbar.css"); @@ -9,6 +9,3 @@ @import url("global/popup.css"); @import url("global/tweaks.css"); @import url("global/browser.css"); - -/* import custom stylesheet instead of modifying Edge-Frfox theme files */ -@import url("custom.css"); diff --git a/chrome/userContent.css b/chrome/userContent.css index 3c5ab07..e1bf933 100644 --- a/chrome/userContent.css +++ b/chrome/userContent.css @@ -1,3 +1,3 @@ -/* Edge-Frfox */ +/* EdgeFr-Fox by bmFtZQ */ @import url("content/common.css"); @import url("content/newtab.css");