diff --git a/.github/ISSUE_TEMPLATE/bug.md b/.github/ISSUE_TEMPLATE/bug.md deleted file mode 100644 index de532d9..0000000 --- a/.github/ISSUE_TEMPLATE/bug.md +++ /dev/null @@ -1,14 +0,0 @@ ---- -name: 🐛 Bug -about: Report a bug -labels: bug ---- - -**Description** -Include clear explaination of bug and how to reproduce. - -**Include screenshot / video recording if possible.** - -**Configuration** -- Firefox Version: -- OS: (eg. Windows, macOS, etc.) diff --git a/.github/ISSUE_TEMPLATE/feature.md b/.github/ISSUE_TEMPLATE/feature.md deleted file mode 100644 index d85f754..0000000 --- a/.github/ISSUE_TEMPLATE/feature.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -name: ✨ Feature -about: Request a new feature / enhancement -labels: enhancement ---- - -**Description** -Include clear explaination of the feature and how it works. - -**Include screenshot / video recording if possible.** diff --git a/.gitignore b/.gitignore index dd2cc3f..29bc542 100644 --- a/.gitignore +++ b/.gitignore @@ -4,8 +4,3 @@ inkscape-template.svg /userContent.css .vscode /icons -/chrome/background-0.jpg -/chrome/background-1.jpg -/chrome/background-0.png -/chrome/background-1.png -/custom/ diff --git a/README.md b/README.md index f0673db..500199e 100644 --- a/README.md +++ b/README.md @@ -1,116 +1,81 @@ # Edge-Frfox A Firefox userChrome.css theme that aims to recreate the look and feel of the Chromium version of Microsoft Edge. - -thumbnail screenshot +![thumbnail](screenshots/thumbnail.png) +###### Screenshot taken with macOS Monterey / Firefox Nightly 96.0a1 (2021-11-30) ## How to install 1. Go to `about:support` and click the "Open Folder/Show in Finder" button for the root directory of your browser profile/s. 2. Download and copy the `chrome` folder into the profile folder. 3. Go to about:config and change these preferences: + ###### For all operating systems: + 1. `toolkit.legacyUserProfileCustomizations.stylesheets` = `true` + 2. `svg.context-properties.content.enabled` = `true` + 3. `layout.css.color-mix.enabled` = `true` - ### For all operating systems: - * `toolkit.legacyUserProfileCustomizations.stylesheets` = `true` - * `svg.context-properties.content.enabled` = `true` - * `layout.css.color-mix.enabled` = `true` + ###### On macOS: + ~~1. To use the Edge style context menu on macOS then set `widget.macos.native-context-menus` = `false`~~ **(Not Implemented Yet!)** - ### Firefox 119.0 and above: - * `layout.css.light-dark.enabled` = `true` + ##### Recommended: + 1. `browser.tabs.tabMinWidth` = `66` + 2. `browser.tabs.tabClipWidth` = `66` - ### On macOS: - * 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` - - ### Optional: - * 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 Floating Tabs, rounded browser corners and more. See [Tweaks](#tweaks). + Additional tweaks can also be applied to the theme, such as Mica (Windows 11 Only), Floating Tabs and more. See [Tweaks](#tweaks). **Note: Most frequently tested on macOS** -## Screenshots -| Theme | Light | Dark | -| ----------------------------------- | ----------------------------- | ---------------------------- | -| Default (Windows 11) | ![Light][s-l] | ![Dark][s-d] | -| Floating Tabs (Windows 11) | ![Light, Floating Tabs][s-lf] | ![Dark, Floating Tabs][s-df] | -| GTK (GNOME 42, [adw-gtk3][1] theme) | ![Light, GTK][s-lgtk] | ![Dark, GTK][s-dgtk] | +## Screenshots (Windows) +|Theme|Light|Dark| +|-|-|-| +|Default|![Light](screenshots/light.png)|![Dark](screenshots/dark.png)| +|Floating Tabs|![Light, Floating Tabs](screenshots/light-floating-tabs.png)|![Dark, Floating Tabs](screenshots/dark-floating-tabs.png)| +|Mica|![Light, Mica](screenshots/light-mica.png)|![Dark, Mica](screenshots/dark-mica.png)| +|Mica and Floating Tabs|![Light, Mica and Floating Tabs](screenshots/light-mica-floating-tabs.png)|![Dark, Mica and Floating Tabs](screenshots/dark-mica-floating-tabs.png)| ## Tweaks Certain tweaks can be applied to the theme, to enable them navigate to `about:config` and create a boolean key for each tweak you want to use and set it to `true`, then restart the browser. To disable a tweak, set the key to `false` or delete it, then restart the browser. -| Enable Edge style floating tabs | -| --------------------------------------------------------------- | -| `uc.tweak.floating-tabs` | -| **OPTIONAL1: Make the top and bottom margins of the tab equal** | -| `uc.tweak.floating-tabs.equal-margin` | +|disable drag space above tabs| +|-| +|`uc.tweak.disable-drag-space`| -| Enable rounded corners | -| -------------------------- | -| `uc.tweak.rounded-corners` | +|enable Edge style floating tabs| +|-| +|`uc.tweak.floating-tabs`| -| Hide Tabs Bar (Useful when using vertical tabs extensions such as Sidebery, Tree Style Tab, etc.) | -| ------------------------------------------------------------------------------------------------- | -| **NOTE: At the moment, this only supports macOS and Windows.** | -| `uc.tweak.hide-tabs-bar` | -| **OPTIONAL: Only enable in fullscreen mode (currently: macOS Only!)** | -| `uc.tweak.hide-tabs-bar.only-when-maximised` | +|enable Mica toolbar background (Windows 11 only)| +|-| +|**See [Mica Tweak Instructions (Windows 11 Only)](#mica-tweak-instructions-windows-11-only) for installation instructions.**| +|`uc.tweak.win11-mica`| -| Use background image on newtab page | -| -------------------------------------------------------------------------------------------------- | -| **SETUP: Add an image named `background-0.(jpg/png)` to the `chrome` folder.** | -| **OPTIONAL: Add a second image named `background-1.(jpg/png)` for seperate dark mode background.** | -| `uc.tweak.newtab-background` | +|force tab background colour to `--toolbar-bg` (useful for Proton themes)| +|-| +|**NOTE: can cause readability issues with some themes! (eg. white text on white bg)**| +|`uc.tweak.force-tab-colour`| -| Hide forward button when it's disabled (like in Edge) | -| ------------------------------------------------------ | -| `uc.tweak.hide-forward-button` | +|only show Firefox account button when in private mode (useful as a private browsing indicator)| +|-| +|**NOTE: all functionality of this button can still be accessed from the app menu.**| +|`uc.tweak.fxa-button-as-private-indicator`| -| Hide Firefox logo on newtab page | -| -------------------------------- | -| `uc.tweak.hide-newtab-logo` | +|remove tab separators| +|-| +|`uc.tweak.remove-tab-separators`| -| Disable drag space above tabs | -| ----------------------------- | -| `uc.tweak.disable-drag-space` | +|remove extra padding from permissions button (older functionality)| +|-| +|`uc.tweak.less-permissions-button-padding`| -| Force tab background colour to the same colour as the navbar background (useful for Proton themes) | -| -------------------------------------------------------------------------------------------------- | -| **NOTE: can cause readability issues with some themes! (eg. white text on white bg)** | -| `uc.tweak.force-tab-colour` | -| ![force tab colour example](screenshots/force-tab-colour.svg) (Left: OFF, Right: ON) | - -| Show context menu navigation buttons (Back, Forward, Reload, Bookmark) vertically | -| --------------------------------------------------------------------------------- | -| **NOTE: labels are only shown in the English language.** | -| `uc.tweak.vertical-context-navigation` | - -| Remove tab separators | -| -------------------------------- | -| `uc.tweak.remove-tab-separators` | - -| Use Firefox's default context menu font-size (only applies to Windows) | -| ---------------------------------------------------------------------- | -| `uc.tweak.smaller-context-menu-text` | - -| Disable custom context menus | -| ------------------------------ | -| `uc.tweak.revert-context-menu` | - -| If a tab's close button is hidden, show it when hovering over tab | -| ----------------------------------------------------------------- | -| `uc.tweak.show-tab-close-button-on-hover` | - -## Mica Tweak Notice -Mica is broken due to changes made in the Firefox 115 update, Mica has now been -removed from this theme. - -If you still have `uc.tweak.win11-mica` set in `about:config` you can safely -delete it +## Mica Tweak Instructions (Windows 11 Only) +1. Download and install [Mica For Everyone](https://github.com/MicaForEveryone/MicaForEveryone). +2. Create a custom process rule with the following: + 1. Name: `firefox` + 2. Titlebar Color: `System` + 3. Backdrop Type: `Mica` +3. Enable tweak in `about:config`: `uc.tweak.win11-mica` +4. Restart Firefox. ## Acknowledgements [muckSponge](https://github.com/muckSponge) - [MaterialFox](https://github.com/muckSponge/MaterialFox) @@ -119,15 +84,6 @@ delete it [KibSquib48](https://github.com/KibSquib48) - [MicaFox](https://github.com/KibSquib48/MicaFox) - -[1]: https://github.com/lassekongo83/adw-gtk3 +--- - -[s-l]: screenshots/light.png -[s-lf]: screenshots/light-floating-tabs.png -[s-lgtk]: screenshots/gtk-light.png - - -[s-d]: screenshots/dark.png -[s-df]: screenshots/dark-floating-tabs.png -[s-dgtk]: screenshots/gtk-dark.png +Old version can be found [here](https://github.com/bmFtZQ/edge-frfox/tree/v91.0-archive). diff --git a/chrome/content/common.css b/chrome/content/common.css index 7491148..b82a5b1 100644 --- a/chrome/content/common.css +++ b/chrome/content/common.css @@ -1,59 +1,84 @@ -/* Edge-Frfox - content/common.css */ +/* EdgeFr-Fox by bmFtZQ - content/common.css */ /* colours */ @-moz-document url-prefix(about:) { :root { - --in-content-page-color: light-dark(#252525, #fff) !important; - --in-content-page-background: light-dark(#f7f7f7, #252525) !important; - --in-content-deemphasized-text: light-dark(#666, #bbb) !important; - --in-content-box-background: light-dark(#fff, #333) !important; - --in-content-box-background-odd: light-dark(rgb(0 0 0 / .05), rgb(255 255 255 / .05)) !important; - --in-content-box-info-background: light-dark(#f7f7f7, rgb(255 255 255 / 0.15)) !important; - --in-content-icon-color: light-dark(#666, #fff) !important; - --in-content-accent-color: light-dark(#006CBE, #75B6E8) !important; - --in-content-accent-color-active: light-dark(#1683D8, #4C98D1) !important; - --in-content-border-hover: light-dark(rgb(0 0 0 / .5), rgb(255 255 255 / .3)) !important; + --in-content-page-color: #252525 !important; + --in-content-page-background: #f7f7f7 !important; + --in-content-deemphasized-text: #666 !important; + --in-content-box-background: #fff !important; + --in-content-box-background-odd: rgba(0, 0, 0, 0.05) !important; + --in-content-box-info-background: #f7f7f7 !important; + --in-content-icon-color: #666 !important; + --in-content-accent-color: #006CBE !important; + --in-content-accent-color-active: #1683D8 !important; + --in-content-border-hover: rgba(0, 0, 0, 0.5) !important; --in-content-border-invalid: var(--red-50) !important; - --in-content-border-color: light-dark(#bebebe, rgb(255 255 255 / .2)) !important; - --in-content-error-text-color: light-dark(#FF848A, #FF9AA2) !important; - --in-content-link-color: light-dark(#0078D4, #75B6E8) !important; - --in-content-link-color-hover: light-dark(#006CBE, #63ADE5) !important; - --in-content-link-color-active: light-dark(#0749AC, #4C98D1) !important; - --in-content-link-color-visited: light-dark(#0078D4, #75B6E8) !important; - --link-color: var(--in-content-link-color) !important; - --link-color-hover: var(--in-content-link-color-hover) !important; - --link-color-active: var(--in-content-link-color-active) !important; - --link-color-visited: var(--in-content-link-color-visited) !important; + --in-content-border-color: #bebebe !important; + --in-content-error-text-color: #FF848A !important; + --in-content-link-color: #0078D4 !important; + --in-content-link-color-hover: #006CBE !important; + --in-content-link-color-active: #0749AC !important; + --in-content-link-color-visited: #0078D4 !important; --in-content-button-text-color: var(--in-content-text-color) !important; --in-content-button-text-color-hover: var(--in-content-text-color) !important; --in-content-button-text-color-active: var(--in-content-button-text-color-hover) !important; - --in-content-button-background: light-dark(#EDEDED, #3B3B3B) !important; - --in-content-button-background-hover: light-dark(#e5e5e5, #545454) !important; - --in-content-button-background-active: light-dark(#d5d5d5, #606060) !important; - --in-content-primary-button-text-color: light-dark(#fff, #fff) !important; - --in-content-primary-button-background: light-dark(#0061e0, #006CBE) !important; - --in-content-primary-button-background-hover: light-dark(#0250bb, #0078D4) !important; - --in-content-primary-button-background-active: light-dark(#053e94, #005CA3) !important; - --color-accent-primary: light-dark(#0078D4, #006CBE) !important; - --color-accent-primary-hover: light-dark(#006CBE, #0078D4) !important; - --color-accent-primary-active: light-dark(#0749AC, #005CA3) !important; - --in-content-danger-button-background: light-dark(#DF4951, #E12424) !important; - --in-content-danger-button-background-hover: light-dark(#EA656C, #F94343) !important; - --in-content-danger-button-background-active: light-dark(#BB353C, #AA1E1E) !important; - --in-content-focus-outline-color: light-dark(rgb(0 85 215 / .5), #63ADE5) !important; - --focus-outline-color: var(--in-content-focus-outline-color) !important; - --in-content-table-background: light-dark(#f7f7f7, #252525) !important; + --in-content-button-background: #EDEDED !important; + --in-content-button-background-hover: #e5e5e5 !important; + --in-content-button-background-active: #d5d5d5 !important; + --in-content-primary-button-text-color: #fff !important; + --in-content-primary-button-background: #0061e0 !important; + --in-content-primary-button-background-hover: #0250bb !important; + --in-content-primary-button-background-active: #053e94 !important; + --in-content-danger-button-background: #DF4951 !important; + --in-content-danger-button-background-hover: #EA656C !important; + --in-content-danger-button-background-active: #BB353C !important; + --in-content-focus-outline-color: color-mix(in srgb, #0055D7 50%, transparent) !important; + --in-content-table-background: #f7f7f7 !important; --in-content-text-color: var(--in-content-page-color) !important; - --border-interactive-color: light-dark(#929292, #858585) !important; - scrollbar-color: - light-dark(rgb(37 37 37 / .4), rgb(255 255 255 / .4)) - light-dark(#f7f7f7, #252525) !important; + scrollbar-color: rgba(37, 37, 37, 0.4) #f7f7f7 !important; + } + + @media (prefers-color-scheme: dark) { + :root { + --in-content-page-background: #252525 !important; + --in-content-page-color: #fff !important; + --in-content-deemphasized-text: #bbb !important; + --in-content-box-background: #333 !important; + --in-content-box-background-odd: rgba(255, 255, 255, 0.05) !important; + --in-content-box-info-background: rgba(255, 255, 255, 0.15) !important; + --in-content-border-color: rgba(255, 255, 255, 0.2) !important; + --in-content-border-hover: rgba(255, 255, 255, 0.3) !important; + --in-content-border-invalid: rgb(255, 132, 139) !important; + --in-content-error-text-color: #FF9AA2 !important; + --in-content-button-background: #3B3B3B !important; + --in-content-button-background-hover: #545454 !important; + --in-content-button-background-active: #606060 !important; + --in-content-icon-color: #fff !important; + --in-content-primary-button-text-color: #fff !important; + --in-content-primary-button-background: #006CBE !important; + --in-content-primary-button-background-hover: #0078D4 !important; + --in-content-primary-button-background-active: #005CA3 !important; + --in-content-danger-button-background: #E12424 !important; + --in-content-danger-button-background-hover: #F94343 !important; + --in-content-danger-button-background-active: #AA1E1E !important; + --in-content-focus-outline-color: #63ADE5 !important; + --in-content-table-background: #252525 !important; + --in-content-accent-color: #75B6E8 !important; + --in-content-accent-color-active: #4C98D1 !important; + --in-content-link-color: #75B6E8 !important; + --in-content-link-color-hover: #63ADE5 !important; + --in-content-link-color-active: #4C98D1 !important; + --in-content-link-color-visited: var(--in-content-link-color) !important; + --card-outline-color: #555 !important; + --dialog-warning-text-color: var(--red-40) !important; + scrollbar-color: rgba(255, 255, 255, .4) #252525 !important; + } } } /* preferences */ -@-moz-document url-prefix(about:preferences), -url-prefix(about:addons) { +@-moz-document url-prefix(about:preferences), url-prefix(about:addons) { .category[selected] { position: relative !important; border-radius: 4px !important; @@ -71,9 +96,8 @@ url-prefix(about:addons) { background-color: var(--in-content-accent-color); border-radius: 3px; position: absolute; - left: 2px; - top: 50%; - translate: 0 -50%; + left: 0; + top: 12px; } button.tab-button:hover { @@ -84,16 +108,6 @@ url-prefix(about:addons) { button.tab-button[selected]:hover { border-block-color: transparent currentColor !important; } - - .toggle-button { - --toggle-dot-margin: 4px !important; - --toggle-width: 40px !important; - --toggle-height: 20px !important; - --toggle-background-color: transparent !important; - --toggle-dot-background-color: var(--in-content-page-color) !important; - --toggle-dot-background-color-on-pressed: #fff !important; - --toggle-dot-transform-x: calc(var(--toggle-width) - 2 * var(--toggle-dot-margin) - 2 * var(--toggle-border-width) - var(--toggle-dot-width)) !important; - } } /* fix page flashes when loading some websites */ diff --git a/chrome/content/newtab.css b/chrome/content/newtab.css index d8ec514..444b421 100644 --- a/chrome/content/newtab.css +++ b/chrome/content/newtab.css @@ -1,10 +1,8 @@ -/* 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]) { +@-moz-document url-prefix("about:newtab"), url-prefix("about:home") { + body:not([lwt-newtab], [lwt-newtab-brighttext]) { --newtab-background-color: #F7F7F7 !important; --newtab-background-color-secondary: #fff !important; --newtab-text-primary-color: #252525 !important; @@ -23,7 +21,7 @@ url-prefix("about:firefoxview") { --newtab-wordmark-color: #737373 !important; --newtab-status-success: #50B080 !important; --newtab-status-error: #FF848A !important; - --newtab-inner-box-shadow-color: rgb(0 0 0 / .1) !important; + --newtab-inner-box-shadow-color: rgba(0, 0, 0, 0.1) !important; --newtab-overlay-color: color-mix(in srgb, var(--newtab-background-color) 85%, transparent) !important; --newtab-text-emphasis-background: #FFED32 !important; --newtab-text-emphasis-text-color: #000 !important; @@ -32,7 +30,8 @@ url-prefix("about:firefoxview") { --newtab-button-secondary-color: inherit !important; } - :root:not([style*="color"])[lwt-newtab-brighttext] { + body[style*="--newtab-background-color: rgb(43, 42, 51); --newtab-text-primary-color: rgba(251, 251, 254, 1);"]:not([style*="--newtab-background-color-secondary"])[lwt-newtab-brighttext], + body:not([style*="color"])[lwt-newtab-brighttext] { --newtab-background-color: #252525 !important; --newtab-background-color-secondary: #4A4A4A !important; --newtab-text-primary-color: #fff !important; @@ -49,8 +48,7 @@ url-prefix("about:firefoxview") { } } -@-moz-document url-prefix("about:newtab"), -url-prefix("about:home") { +@-moz-document url-prefix("about:newtab"), url-prefix("about:home") { /* hide pin */ .icon.icon-pin-small { display: none !important; @@ -58,7 +56,7 @@ url-prefix("about:home") { /* unpinned sites have lower opacity title */ .top-site-button .title:not(.pinned) { - opacity: 0.7 !important; + opacity: 0.6 !important; } /* search bar */ @@ -73,7 +71,7 @@ url-prefix("about:home") { white-space: nowrap !important; text-overflow: ellipsis !important; --elevation: 4; - box-shadow: 0 0 calc((var(--elevation) * 0.225px) + 2px) rgb(0 0 0 / .11), 0 calc(var(--elevation) * 0.4px) calc((var(--elevation) * 0.9px)) rgb(0 0 0 / .13) !important; + box-shadow: 0 0 calc((var(--elevation) * 0.225px) + 2px) rgba(0, 0, 0, 0.11), 0 calc(var(--elevation) * 0.4px) calc((var(--elevation) * 0.9px)) rgba(0, 0, 0, 0.13) !important; } .search-handoff-button:hover { @@ -111,7 +109,7 @@ url-prefix("about:home") { .top-site-outer .default-icon, .top-site-outer .search-topsite { - background-size: 16px !important; + background-size: 24px !important; height: 24px !important; width: 24px !important; } @@ -121,51 +119,29 @@ url-prefix("about:home") { } /* card */ - .card-outer, .card-outer .card, .ds-card-grid.ds-card-grid-border .ds-card:not(.placeholder) { - border-radius: 6px !important; - } - - .card-outer .card, - .ds-card-grid.ds-card-grid-border .ds-card:not(.placeholder) { - box-shadow: 0 1px 4px rgb(0 0 0 / .3) !important; + border-radius: 4px !important; + box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3) !important; } .card-outer .card-preview-image-outer, .ds-card-grid.ds-card-grid-border .ds-card:not(.placeholder) .img-wrapper .img img { - border-radius: 6px 6px 0 0 !important - } - - .fake-textbox { - overflow: hidden !important; - text-overflow: ellipsis !important; - } - - .outer-wrapper.only-search { - display: flex !important; - padding: 30px !important; - } - - @media (-moz-bool-pref: "uc.tweak.hide-newtab-logo") { - .logo-and-wordmark { - display: none !important; - } - - .outer-wrapper:not(.fixed-search) .search-wrapper { - padding-top: 0 !important; - } + border-radius: 4px 4px 0 0 !important } } /* private browsing newtab */ @-moz-document url-prefix(about:privatebrowsing) { :root { - --uc-wordmark-color: light-dark(#737373, #fff); - --uc-background-color-secondary: light-dark(#fff, #4a4a4a); + --uc-wordmark-color: #737373 !important; + --uc-background-color-secondary: #fff !important; + } - @media (-moz-bool-pref: "browser.theme.dark-private-windows") { - color-scheme: dark !important; + @media (prefers-color-scheme: dark) { + :root { + --uc-wordmark-color: #fff !important; + --uc-background-color-secondary: #4a4a4a !important; } } @@ -182,7 +158,7 @@ url-prefix("about:home") { border-radius: 99px !important; padding-inline-start: 48px !important; --elevation: 4; - box-shadow: 0 0 calc((var(--elevation) * 0.225px) + 2px) rgb(0 0 0 / .11), 0 calc(var(--elevation) * 0.4px) calc((var(--elevation) * 0.9px)) rgb(0 0 0 / .13) !important; + box-shadow: 0 0 calc((var(--elevation) * 0.225px) + 2px) rgba(0, 0, 0, 0.11), 0 calc(var(--elevation) * 0.4px) calc((var(--elevation) * 0.9px)) rgba(0, 0, 0, 0.13) !important; } .search-handoff-button:hover { @@ -209,108 +185,5 @@ url-prefix("about:home") { .info { background-color: var(--uc-background-color-secondary) !important; - background-image: none !important; - position: relative !important; - } - - .info::before { - content: ""; - position: absolute; - left: 32px; - top: 20px; - height: 32px; - aspect-ratio: 1 / 1; - background: center / contain url("../icons/account-private.svg"); - border-radius: 99px; - } -} - -@media (-moz-bool-pref: "uc.tweak.newtab-background") { - @-moz-document url(about:newtab), - url(about:home), - url(about:privatebrowsing), - url-prefix("about:firefoxview") { - :root body { - /* specify both jpg and png file extensions, but jpg images will always - have a higher priority */ - --bg-0: url(../background-0.jpg), url(../background-0.png); - --bg-1: url(../background-1.jpg), url(../background-1.png); - --newtab-element-hover-color: rgb(239 239 239 / .3) !important; - --newtab-element-active-color: rgb(239 239 239 / .45) !important; - --text-shadow: 0 1px 2px #000; - --icon-shadow: drop-shadow(0 0.3px 0.6px #000); - background-color: #252525 !important; - background-image: var(--bg-0) !important; - background-position: center !important; - background-size: cover !important; - background-attachment: fixed !important; - } - - :root[lwt-newtab-brighttext] body, - :root.private body { - background-image: var(--bg-1), var(--bg-0) !important; - --newtab-element-hover-color: rgb(66 66 66 / .4) !important; - --newtab-element-active-color: rgb(66 66 66 / .55) !important; - } - - @media not (-moz-bool-pref: "browser.theme.dark-private-windows") { - :root.private body { - background-image: var(--bg-0) !important; - } - - @media (prefers-color-scheme: dark) { - :root.private body { - background-image: var(--bg-1), var(--bg-0) !important; - } - } - } - - .top-site-outer .title, - .ds-header, - .ds-layout .section-title span, - .ds-navigation, - .page-section-header>h1, - .page-section-header>.section-description, - .closed-tab-li-main:not(:hover, :active), - .closed-tab-li-dismiss, - .brand-logo>.brand-feature-name, - #colorways-collection-title, - #colorways-collection-description, - .synced-tabs-container>.loading-content { - text-shadow: var(--text-shadow) !important; - color: #fff !important; - -moz-osx-font-smoothing: auto !important; - } - - .wordmark, - .icon-settings, - .top-site-outer .context-menu-button, - .closed-tab-li-main:not(:hover, :active) .favicon, - .page-section-header:not(:hover)>.twisty, - .synced-tab-li-favicon, - .page-section-header:not(:hover)>.twisty, - .closed-tab-li-dismiss:not(:hover), - .synced-tabs-container>.loading-content .sync { - filter: var(--icon-shadow) !important; - color: #fff !important; - fill: currentColor !important - } - - .section-top-bar .learn-more-link a, - .ds-navigation a { - color: #b3d4ff !important; - text-shadow: var(--text-shadow) !important; - -moz-osx-font-smoothing: auto !important; - } - - .top-site-outer .title .sponsored-label, - .closed-tab-li-main:not(:hover, :active) :is(.closed-tab-li-url, .closed-tab-li-time) { - color: #eee !important; - } - - .fixed-search .search-wrapper { - border-bottom: 0 !important; - background: transparent linear-gradient(#0004, transparent) !important; - } } } diff --git a/chrome/global/browser.css b/chrome/global/browser.css deleted file mode 100644 index dab9cb5..0000000 --- a/chrome/global/browser.css +++ /dev/null @@ -1,79 +0,0 @@ -/* Edge-Frfox - browser.css */ - -@media (-moz-bool-pref: "uc.tweak.floating-tabs") { - :root { - --browser-frame-bgcolor: var(--lwt-accent-color); - } -} - -@media not (-moz-bool-pref: "uc.tweak.floating-tabs") { - :root { - --browser-frame-bgcolor: var(--toolbar-bgcolor); - } -} - -@media (-moz-bool-pref: "uc.tweak.rounded-corners") { - /* Fix changes to the bookmarks bar made in Firefox 120 */ - :root[BookmarksToolbarOverlapsBrowser] .newTabBrowserPanel, - :root[BookmarksToolbarOverlapsBrowser] #sidebar-box { - padding-top: 0 !important; - } - - :root[BookmarksToolbarOverlapsBrowser] #appcontent, - :root[BookmarksToolbarOverlapsBrowser] #sidebar-box { - margin-top: var(--bookmarks-toolbar-overlapping-browser-height); - } - - :root { - --uc-tweak-rounded-corners-padding: 3px; - --uc-tweak-rounded-corners-border: 1px solid rgb(0 0 0 / .05); - --uc-tweak-rounded-corners-radius: 8px; - --uc-tweak-rounded-corners-shadow: 0px 1px 1px rgb(0 0 0 / .1); - - & #browser:not([style*="--sidebar-border-color"]) { - --sidebar-border-color: light-dark(#bfbfbf80, #595959) !important; - } - } - - /* disable rounded corners in fullscreen, only if the toolbar is hidden */ - :root[inFullscreen] #navigator-toolbox:where([style*="margin-top"], [fullscreenShouldAnimate]) + #browser, - :root[inDOMFullscreen] #browser { - --uc-tweak-rounded-corners-padding: 0; - --uc-tweak-rounded-corners-border: none; - --uc-tweak-rounded-corners-radius: 0; - --uc-tweak-rounded-corners-shadow: none; - } - - #appcontent { - margin-inline: var(--uc-tweak-rounded-corners-padding) !important; - margin-block-end: var(--uc-tweak-rounded-corners-padding) !important; - border-radius: var(--uc-tweak-rounded-corners-radius) !important; - overflow: hidden !important; - border: var(--uc-tweak-rounded-corners-border) !important; - box-shadow: var(--uc-tweak-rounded-corners-shadow) !important; - } - - /* apply rounded corners to sidebar */ - #sidebar-box { - margin-inline-start: var(--uc-tweak-rounded-corners-padding) !important; - margin-block-end: var(--uc-tweak-rounded-corners-padding) !important; - border-radius: var(--uc-tweak-rounded-corners-radius) !important; - overflow: hidden !important; - border: var(--uc-tweak-rounded-corners-border) !important; - box-shadow: var(--uc-tweak-rounded-corners-shadow) !important; - - &[positionend] { - margin-inline-start: 0 !important; - margin-inline-end: var(--uc-tweak-rounded-corners-padding) !important; - } - } - - /* remove sidebar border */ - #sidebar-splitter { - border-inline-width: 0 !important; - } - - #browser { - background-color: var(--browser-frame-bgcolor); - } -} diff --git a/chrome/global/colors.css b/chrome/global/colors.css index 1254ddf..3c35531 100644 --- a/chrome/global/colors.css +++ b/chrome/global/colors.css @@ -1,312 +1,148 @@ -/* Edge-Frfox - colors.css */ +/* EdgeFr-Fox by bmFtZQ - colors.css */ -/* default colours (light & dark) */ -: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-non-lwt-bgcolor: var(--toolbar-bgcolor) !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; +/* light */ +:root:not(:-moz-lwtheme) { + --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; + --lwt-selected-tab-background-color: var(--toolbar-bgcolor) !important; --tab-selected-bgcolor: var(--toolbar-bgcolor) !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; + --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; - --link-color: light-dark(#0078D4, #75B6E8) !important; - --urlbar-hover-highlight-color: light-dark(rgb(192 192 192 / .5), rgb(128 128 128 / .5)) !important; - --urlbar-box-bgcolor: light-dark(rgb(0 0 0 / .09), rgb(255 255 255 / .11)) !important; - --urlbar-box-hover-bgcolor: light-dark(rgb(0 0 0 / .09), rgb(255 255 255 / .11)) !important; - --urlbar-box-focus-bgcolor: light-dark(rgb(0 0 0 / .22), rgb(255 255 255 / .28)) !important; + --toolbar-field-focus-border-color: #0055D7 !important; --urlbar-icon-fill-opacity: 1 !important; - --urlbar-popup-url-color: light-dark(#0072C9, #75B6E8) !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; + --urlbar-box-bgcolor: #f7f7f7 !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; + --toolbarbutton-hover-background: #e0e0e0 !important; + --toolbarbutton-active-background: #d5d5d5 !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: #000 !important; + --panel-description-color: #000a !important; + --panel-disabled-color: #0009 !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: #50B080 !important; + --focus-outline-color: #0055D7 !important; --panel-shortcut-color: inherit !important; - --uc-urlbar-shadow: 0 0 4px rgb(0 0 0 / .1); - --toolbarbutton-hover-background: light-dark(rgb(0 0 0 / .08), rgb(255 255 255 / .1)) !important; - --toolbarbutton-active-background: light-dark(rgb(0 0 0 / .12), rgb(255 255 255 / .16)) !important; + --uc-urlbar-shadow: 0 0 4px rgba(0, 0, 0, 0.1); + --toolbarbutton-hover-background: #00000014 !important; + --toolbarbutton-active-background: #00000021 !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; - --toolbarseparator-color: color-mix(in srgb, currentColor 40%, transparent) !important; + --uc-private-browding-indicator-hover: var(--button-primary-hover-bgcolor); + --uc-private-browding-indicator-active: var(--button-primary-active-bgcolor); + --uc-private-browding-indicator-text: var(--button-primary-color); } -/* ensure that dark mode is enabled completely in private browsing mode. */ -@media (-moz-bool-pref: "browser.theme.dark-private-windows") { - :root[privatebrowsingmode="temporary"], - :root[privatebrowsingmode="temporary"] #nav-bar, - :root[privatebrowsingmode="temporary"] #PersonalToolbar { - color-scheme: dark !important; - } -} - -#urlbar { - --urlbar-box-bgcolor: inherit !important; - --urlbar-box-hover-bgcolor: inherit !important; - --urlbar-box-focus-bgcolor: inherit !important; +/* dark */ +:root[lwt-default-theme-in-dark-mode="true"] { + --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-icon-fill-opacity: 1 !important; + --urlbar-popup-url-color: #75B6E8 !important; + --lwt-brighttext-url-color: var(--urlbar-popup-url-color) !important; + --urlbar-box-bgcolor: #3B3B3B !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: #3B3B3B !important; + --button-hover-bgcolor: #545454 !important; + --button-active-bgcolor: #606060 !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: #50B080 !important; + --focus-outline-color: #63ADE5 !important; + --panel-shortcut-color: inherit !important; + --toolbarbutton-hover-background: #ffffff25 !important; + --toolbarbutton-active-background: #ffffff32 !important; + --uc-private-browsing-indicator: var(--button-primary-bgcolor); + --uc-private-browding-indicator-hover: var(--button-primary-hover-bgcolor); + --uc-private-browding-indicator-active: var(--button-primary-active-bgcolor); + --uc-private-browding-indicator-text: var(--button-primary-color); } /* Change Colour of page when loading */ :root:not(:-moz-lwtheme) #tabbrowser-tabpanels { - background-color: light-dark(#f7f7f7, #252525) !important; + background-color: #f7f7f7 !important; +} + +:root[lwt-default-theme-in-dark-mode="true"] #tabbrowser-tabpanels { + background-color: #252525 !important; } /* make the titlebar buttons black/white on default themes */ :root:not(:-moz-lwtheme)[tabsintitlebar] .titlebar-buttonbox { - color: var(--toolbar-color) !important; + color: #000 !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 #0002, 0 0 0 1px light-dark(#0001, #0002) !important; - border-radius: 0 4px 0 0 !important; - - #statuspanel[mirror] & { - border-radius: 4px 0 0 0 !important; - } -} - -@media (-moz-platform: windows) { - tooltip { - background-color: var(--arrowpanel-background) !important; - color: var(--arrowpanel-color) !important; - border-color: var(--arrowpanel-border-color) !important; - } - - .titlebar-button:not(.titlebar-close):hover { - background-color: color-mix(in srgb, currentColor 11%, transparent) !important; - } - - .titlebar-button:hover:active { - background-color: color-mix(in srgb, currentColor 20%, transparent) !important; - } - - .titlebar-close:hover { - stroke: white !important; - background-color: #e81123 !important; - } - - .titlebar-close:hover:active { - background-color: #EF6B76 !important; - } - - toolbar[brighttext] .titlebar-close:hover:active { - background-color: #9C1420 !important; - } - - /* library window theme */ - window#places { - --organizer-color: light-dark(#000, #fff) !important; - --organizer-deemphasized-color: light-dark(#666, #bbb) !important; - --organizer-toolbar-background: light-dark(#f7f7f7, #3B3B3B) !important; - --organizer-pane-background: light-dark(#f7f7f7, #2B2B2B) !important; - --organizer-content-background: light-dark(#f7f7f7, #1C1C1C) !important; - --organizer-hover-background: light-dark(#00000025, #ffffff25) !important; - --organizer-selected-background: light-dark(#006CBE80, #006CBE80) !important; - --organizer-outline-color: light-dark(#0055D7a0, #63ADE5) !important; - --organizer-toolbar-field-background: light-dark(#fff, #2B2B2B) !important; - --organizer-toolbar-field-background-focused: light-dark(#fff, #2B2B2B) !important; - --organizer-border-color: light-dark(#bfbfbf, #686868) !important; - scrollbar-color: - light-dark(#0006, #fff6) - light-dark(#f7f7f740, #2B2B2B40) !important; - } - - #placesViewsBox #downloadsListBox richlistitem[selected="true"] { - background-color: light-dark(#006CBE, #006CBE) !important; - color: light-dark(#fff, #fff) !important; - } - - #placeContentColumns :is(treecol, treecolpicker) { - background-color: light-dark(#f7f7f7, #3B3B3B) !important; - color: light-dark(#000, #fff) !important; - border-inline-start: 1px solid light-dark(#bfbfbf, #686868) !important; - box-shadow: inset 0 -1px light-dark(#bfbfbf, #686868) !important; - appearance: none !important; - } - - #placeContentColumns :is(treecol, treecolpicker):where(:hover) { - background-color: light-dark(#cecece, #4A4A4A ) !important; - color: light-dark(#000, #fff) !important; - } -} - -/* side bar theme */ -#sidebar-box:not([lwt-sidebar]) { - --sidebar-background-color: light-dark(#f7f7f7, #3b3b3b) !important; - --sidebar-text-color: light-dark(#000, #fff) !important; - appearance: none !important; -} - -#browser:not([style*="--sidebar-border-color"]) { - --sidebar-border-color: light-dark(#bfbfbf, #686868) !important; -} - -.sidebar-panel:not([lwt-sidebar]) { - color: light-dark(#000, #fff) !important; - scrollbar-color: light-dark(#0006, #fff6) light-dark(#f7f7f740, #3b3b3b40) !important; - - /* Sidebar search box (Windows) */ - @media(-moz-platform: windows) { - & #sidebar-search-container>#search-box, - & #viewButton { - appearance: none !important; - background-color: light-dark(#fff, #2b2b2b) !important; - color: inherit !important; - border: 1px solid light-dark(#bfbfbf, #686868) !important; - border-radius: 4px !important; - padding: 6px 8px !important; - - &:focus { - border-width: 2px !important; - padding: 5px 7px !important; - } - } - } -} - -@-moz-document url(chrome://browser/content/syncedtabs/sidebar.xhtml){ - body { - background: transparent !important; - } -} - -/* Linux / GTK csd support */ -@media (-moz-gtk-csd-available) { - :root:not(:-moz-lwtheme) { - --toolbar-bgcolor: color-mix(in srgb, -moz-dialog 80%, #fff) !important; - --toolbar-bgimage: none !important; - --toolbar-color: -moz-dialogtext !important; - --tab-selected-bgimage: none !important; - --chrome-content-separator-color: ThreeDShadow !important; - --panel-separator-color: ThreeDShadow !important; - --button-bgcolor: color-mix(in srgb, currentColor 10%, transparent) !important; - --button-hover-bgcolor: color-mix(in srgb, currentColor 14%, transparent) !important; - --button-active-bgcolor: color-mix(in srgb, currentColor 20%, transparent) !important; - --button-color: currentColor !important; - --button-primary-bgcolor: -moz-accent-color !important; - --button-primary-hover-bgcolor: color-mix(in srgb, black 10%, -moz-accent-color) !important; - --button-primary-active-bgcolor: color-mix(in srgb, black 20%, -moz-accent-color) !important; - --button-primary-color: -moz-accent-color-foreground !important; - --autocomplete-popup-hover-background: var(--arrowpanel-dimmed) !important; - --autocomplete-popup-separator-color: color-mix(in srgb, currentColor 14%, transparent) !important; - --urlbar-box-bgcolor: var(--button-bgcolor) !important; - --urlbar-box-focus-bgcolor: var(--button-bgcolor) !important; - --urlbar-box-hover-bgcolor: var(--button-hover-bgcolor) !important; - --urlbar-box-active-bgcolor: var(--button-active-bgcolor) !important; - --urlbar-box-text-color: inherit !important; - --urlbar-box-hover-text-color: var(--urlbar-box-text-color) !important; - --urlbar-icon-fill-opacity: 0.9 !important; - --urlbar-popup-url-color: -moz-nativehyperlinktext !important; - --lwt-brighttext-url-color: #00ddff !important; - --toolbarbutton-icon-fill-attention: -moz-nativehyperlinktext !important; - --focus-outline-color: -moz-accent-color !important; - --arrowpanel-background: Field !important; - --arrowpanel-color: FieldText !important; - --arrowpanel-border-color: ThreeDShadow !important; - --arrowpanel-dimmed: color-mix(in srgb, currentColor 17%, transparent) !important; - --arrowpanel-dimmed-further: color-mix(in srgb, currentColor 30%, transparent) !important; - --panel-description-color: GrayText !important; - --panel-disabled-color: GrayText !important; - --toolbarbutton-icon-fill: currentColor !important; - --toolbar-field-background-color: Field !important; - --toolbar-field-color: FieldText !important; - --toolbar-field-border-color: ThreeDShadow !important; - --toolbar-field-focus-background-color: Field !important; - --toolbar-field-focus-color: FieldText !important; - --toolbar-field-focus-border-color: -moz-accent-color !important; - --toolbarbutton-hover-background: color-mix(in srgb, -moz-dialogtext 14%, transparent) !important; - --toolbarbutton-active-background: color-mix(in srgb, -moz-dialogtext 20%, transparent) !important; - --uc-urlbar-shadow: none; - --autocomplete-popup-highlight-color: FieldText !important; - --autocomplete-popup-highlight-background: color-mix(in srgb, currentColor 8%, transparent) !important; - --autocomplete-popup-hover-background: color-mix(in srgb, currentColor 12%, transparent) !important; - --autocomplete-popup-separator-color: #0000 !important; - --panel-item-hover-bgcolor: color-mix(in srgb, currentColor 17%, transparent) !important; - --panel-item-active-bgcolor: color-mix(in srgb, currentColor 30%, transparent) !important; - --panel-separator-color: ThreeDShadow !important; - --panel-banner-item-update-supported-bgcolor: #1bba6b !important; - --focus-outline-color: -moz-accent-color !important; - --uc-private-browsing-indicator: -moz-accent-color !important; - --uc-private-browsing-indicator-text: var(--button-primary-color); - } - - #sidebar-box:not([lwt-sidebar]) { - --sidebar-background-color: -moz-dialog !important; - --sidebar-text-color: -moz-dialog-text !important; - } - - #browser:not([style*="--sidebar-border-color"]) { - --sidebar-border-color: ThreeDShadow !important; - } - - .sidebar-panel:not([lwt-sidebar]) { - color: -moz-dialogtext !important; - } - - @media (prefers-color-scheme: light) { - :root:not(:-moz-lwtheme) { - --toolbar-bgcolor: color-mix(in srgb, -moz-dialog 65%, #fff) !important; - --urlbar-icon-fill-opacity: 0.7 !important; - --toolbar-field-border-color: transparent !important; - --toolbar-field-background-color: color-mix(in srgb, Field 90%, -moz-dialogtext) !important; - --toolbar-field-color: FieldText !important; - --toolbar-field-focus-background-color: Field !important; - --toolbar-field-focus-color: FieldText !important; - } - } - - @media (prefers-color-scheme: dark) { - :root:not(:-moz-lwtheme) { - --toolbar-bgcolor: color-mix(in srgb, -moz-dialog 90%, #fff) !important; - --urlbar-icon-fill-opacity: 1.0 !important; - --toolbar-field-border-color: transparent !important; - --toolbar-field-background-color: color-mix(in srgb, Field 90%, -moz-dialogtext) !important; - --toolbar-field-color: FieldText !important; - --toolbar-field-focus-background-color: color-mix(in srgb, Field 90%, -moz-dialogtext) !important; - --toolbar-field-focus-color: FieldText !important; - } - } +:root[lwt-default-theme-in-dark-mode="true"][tabsintitlebar] .titlebar-buttonbox { + color: #fff !important; } diff --git a/chrome/global/popup.css b/chrome/global/popup.css index 49d949b..cc69bc0 100644 --- a/chrome/global/popup.css +++ b/chrome/global/popup.css @@ -1,66 +1,42 @@ -/* Edge-Frfox - popup.css */ +/* EdgeFr-Fox by bmFtZQ - popup.css */ :root { - --panel-subview-body-padding: 2px 0 !important; - --arrowpanel-border-radius: 8px !important; - --arrowpanel-menuitem-border-radius: 4px !important; - --arrowpanel-menuitem-margin: var(--uc-arrowpanel-menuitem-margin-block) var(--uc-arrowpanel-menuitem-margin-inline) !important; - --arrowpanel-menuitem-padding-block: 6px !important; - --arrowpanel-menuitem-padding-inline: 10px !important; + --arrowpanel-border-radius: 4px !important; + --panel-subview-body-padding: 4px 0 !important; + --arrowpanel-menuitem-border-radius: 0 !important; + --arrowpanel-menuitem-margin: 0 !important; + --arrowpanel-menuitem-padding-block: 8px !important; + --arrowpanel-menuitem-padding-inline: 14px !important; --uc-arrowpanel-menuicon-margin-inline: 14px; - --uc-arrowpanel-menuitem-margin-inline: 4px; - --uc-arrowpanel-menuitem-margin-block: 2px; - --panel-separator-margin-vertical: 2px !important; + --panel-separator-margin-vertical: 4px !important; --panel-separator-margin-horizontal: 0 !important; - --uc-panel-zoom-button-padding: 8px; - --uc-panel-zoom-button-inline-padding: 9px; - --uc-panel-zoom-padding-block: calc(var(--panel-separator-margin-vertical) + var(--uc-arrowpanel-menuitem-margin-block)); - + --uc-panel-zoom-button-inline-padding: 13px; --uc-autocomplete-panel-menuitem-margin: 4px; - --uc-autocomplete-panel-menuicon-padding-inline: 14px; + --uc-autocomplete-panel-menuicon-padding-inline: 12px; --uc-autocomplete-panel-separator-margin-vertical: 4px; - - --uc-permission-itemcontainer-padding-block: 8px; - --uc-permission-item-margin-block: 4px; - --uc-permission-item-padding-inline: 16px; - - --uc-contextmenu-border-radius: 8px; - --uc-contextmenu-padding: calc(4px - var(--uc-contextmenu-menuitem-border-width)) 0; - --uc-contextmenu-menuitem-border-radius: calc(4px + var(--uc-contextmenu-menuitem-border-width)); - --uc-contextmenu-menuitem-padding-block: 6px; - --uc-contextmenu-menuitem-padding-inline: 10px; - --uc-contextmenu-menuitem-border-width: 2px; - --uc-contextmenu-menuicon-margin-inline: 12px; - --uc-contextmenu-menuitem-margin-inline: calc(4px - var(--uc-contextmenu-menuitem-border-width)); - --uc-contextmenu-menuitem-margin-block: 0px; - --uc-contextmenu-menuitem-margin: var(--uc-contextmenu-menuitem-margin-block) var(--uc-contextmenu-menuitem-margin-inline); - --uc-contextmenu-separator-vertical: calc(4px - var(--uc-contextmenu-menuitem-border-width)); - --uc-contextmenu-separator-horizontal: 0; } /* app menu */ .addon-banner-item, .panel-banner-item { - margin: 2px 4px 2px !important; + margin: 0 4px 4px !important; padding-inline: 4px 12px !important; - padding-block: var(--arrowpanel-menuitem-padding-block) !important; - border-radius: var(--arrowpanel-menuitem-border-radius) !important; + border-radius: 2px !important; } -#appMenu-fxa-label2 label, -#PanelUI-fxa-menu-syncnow-button label { +#appMenu-fxa-label2>vbox>label { margin-block: 0 !important; } .widget-overflow-list .toolbarbutton-1:not(.toolbarbutton-combined)>.toolbarbutton-text, -.subviewbutton:not(#appMenu-zoom-controls > .subviewbutton)>.toolbarbutton-icon+.toolbarbutton-text, +.subviewbutton:not(#appMenu-zoom-controls2 > .subviewbutton)>.toolbarbutton-icon+.toolbarbutton-text, #appMenu-fxa-label2>vbox { padding-inline-start: var(--uc-arrowpanel-menuicon-margin-inline) !important; } /* special case menuitems with no icons */ -#appMenu-zoom-controls>.toolbarbutton-text, +#appMenu-zoom-controls2>.toolbarbutton-text, #fxa-manage-account-button>vbox, #PanelUI-fxa-menu-syncnow-button>hbox { padding-inline-start: calc(16px + var(--uc-arrowpanel-menuicon-margin-inline)) !important; @@ -73,7 +49,7 @@ /* firefox profile avatar in appmenu */ #appMenu-fxa-label2::before { content: ""; - display: flex; + display: -moz-box; height: 16px; width: 16px; background: var(--avatar-image-url) 0/16px; @@ -81,49 +57,31 @@ border-radius: 99px; } + /* disable proton account separator */ #appMenu-fxa-separator { border-image: none !important; } -#appMenu-fxa-status2:not([fxastatus]) { - padding-block: 0 !important; -} - -#appMenu-fxa-status2:not([fxastatus])>#appMenu-fxa-label2 { - margin-inline-end: calc(var(--arrowpanel-menuitem-padding-inline) * -1) !important; -} - /* zoom controls */ -#appMenu-zoom-controls { +#appMenu-zoom-controls2 { border-top: 1px solid var(--panel-separator-color) !important; - padding-inline: calc(var(--arrowpanel-menuitem-padding-inline) + var(--uc-arrowpanel-menuitem-margin-inline)) var(--uc-arrowpanel-menuitem-margin-inline) !important; - padding-block: var(--uc-panel-zoom-padding-block) !important; + padding: 0 0 0 var(--arrowpanel-menuitem-padding-inline) !important; margin: var(--panel-separator-margin-vertical) 0 calc(var(--panel-separator-margin-vertical) * -1) !important; } -#appMenu-zoom-controls>.subviewbutton { +#appMenu-zoom-controls2>.subviewbutton { padding: var(--uc-panel-zoom-button-padding) var(--uc-panel-zoom-button-inline-padding) !important; margin: 0 !important; } -#appMenu-zoom-controls>#appMenu-zoomReset-button2 { +#appMenu-zoom-controls2>#appMenu-zoomReset-button2 { padding: var(--uc-panel-zoom-button-padding) calc(var(--uc-panel-zoom-button-padding) / 2) !important; } -/* #appMenu-zoomReduce-button2, */ -#appMenu-zoom-controls>#appMenu-fullscreen-button2 { - margin-left: calc((var(--panel-separator-margin-vertical) + var(--uc-arrowpanel-menuitem-margin-block)) * 2 + 1px) !important; -} - -#appMenu-zoom-controls>#appMenu-fullscreen-button2::before { - content: ""; - border-inline-start: 1px solid var(--panel-separator-color); - display: block; - position: relative; - height: 32px; - margin-block: calc(var(--uc-panel-zoom-button-padding) * -1); - transform: translateX(calc(var(--uc-panel-zoom-button-inline-padding) * -1 - (var(--panel-separator-margin-vertical) + var(--uc-arrowpanel-menuitem-margin-block)) - 1px)); +#appMenu-zoomReduce-button2, +#appMenu-fullscreen-button2 { + border-inline-start: 1px solid var(--panel-separator-color) !important; } #appMenu-zoomReset-button2 { @@ -131,17 +89,23 @@ min-height: calc(16px + var(--uc-panel-zoom-button-padding) * 2) !important; } +#appMenu-zoomReset-button2:not([disabled], [open], :active):is(:hover) { + background-color: var(--panel-item-hover-bgcolor) !important; +} + +#appMenu-zoomReset-button2:not([disabled]):is([open], :hover:active) { + background-color: var(--panel-item-active-bgcolor) !important; +} + #appMenu-zoomReduce-button2:not([disabled], [open], :active):is(:hover), #appMenu-zoomEnlarge-button2:not([disabled], [open], :active):is(:hover), -#appMenu-fullscreen-button2:not([disabled], [open], :active):is(:hover), -#appMenu-zoomReset-button2:not([disabled], [open], :active):is(:hover) { +#appMenu-fullscreen-button2:not([disabled], [open], :active):is(:hover) { background-color: var(--panel-item-hover-bgcolor) !important; } #appMenu-zoomReduce-button2:not([disabled]):is([open], :hover:active), #appMenu-zoomEnlarge-button2:not([disabled]):is([open], :hover:active), -#appMenu-fullscreen-button2:not([disabled]):is([open], :hover:active), -#appMenu-zoomReset-button2:not([disabled]):is([open], :hover:active) { +#appMenu-fullscreen-button2:not([disabled]):is([open], :hover:active) { background-color: var(--panel-item-active-bgcolor) !important; } @@ -151,37 +115,8 @@ stroke: none !important; } -#appMenu-zoomReset-button2>.toolbarbutton-text, #appMenu-fullscreen-button2>.toolbarbutton-icon { background-color: transparent !important; - padding: 0 !important; -} - -.subviewbutton[shortcut]::after { - opacity: 0.7 !important; -} - -#widget-overflow-mainView .panel-subview-body { - padding-bottom: 0 !important; -} - -.PanelUI-subView>.panel-header+toolbarseparator { - margin-bottom: 0 !important; -} - -.PanelUI-subView>.panel-header+toolbarseparator+.panel-subview-body { - padding-top: var(--panel-separator-margin-vertical) !important; -} - -#identity-popup-security-button { - margin-bottom: var(--panel-separator-margin-vertical) !important; -} - -#permission-popup-mainView-panel-header, -#identity-popup-mainView-panel-header, -#protections-popup-mainView-panel-header, -.panel-header { - min-height: calc((var(--arrowpanel-menuitem-padding-block) + 4px) * 2 + 16px) !important; } /* URL bar popup */ @@ -189,6 +124,14 @@ border-radius: 2px !important; } +#identity-popup-security-button { + padding-inline: calc(var(--arrowpanel-menuitem-padding-inline) - 4px) !important; +} + +.identity-popup-security-connection>hbox { + margin-inline-start: calc(20px + var(--uc-arrowpanel-menuicon-margin-inline)) !important; +} + .identity-popup-security-connection>hbox>description { margin-inline-start: 0 !important; } @@ -197,53 +140,19 @@ margin-inline-end: calc(-1 * (var(--arrowpanel-menuitem-padding-inline) - 10px)) !important; } -#identity-popup-mainView-panel-header-span, -#permission-popup-mainView-panel-header-span, -#identity-popup-mainView-panel-header label, -#permission-popup-mainView-panel-header label, -#protections-popup-mainView-panel-header-span { - margin-block: 0 !important; -} - -.permission-popup-section { - padding-block: var(--uc-permission-itemcontainer-padding-block) !important; -} - -#permission-popup-permissions-content { - padding-inline: var(--uc-permission-item-padding-inline) !important; -} - -.permission-popup-permission-item, -#permission-popup-storage-access-permission-list-header { - margin-block: var(--uc-permission-item-margin-block) !important; -} - -.permission-popup-permission-label, -.permission-popup-permission-header-label { - margin-inline-start: var(--uc-arrowpanel-menuicon-margin-inline) !important; -} - -#editBookmarkPanel>#editBookmarkHeaderSeparator, -#editBookmarkPanel>.panel-subview-body>#editBookmarkSeparator { - margin-inline: 0 !important; -} - /* subview */ .panel-header { - padding: 4px !important; + padding: 4px; padding-top: 4px !important; } -.panel-header+toolbarseparator, -#identity-popup-mainView-panel-header+toolbarseparator, -#permission-popup-mainView-panel-header+toolbarseparator, -#protections-popup-mainView-panel-header-section+toolbarseparator { +.panel-header+toolbarseparator { margin-block-start: 0 !important; } -.panel-header>.subviewbutton-back { +.subviewbutton-back { margin: 0 !important; - padding: var(--arrowpanel-menuitem-padding-block) !important; + border-radius: 2px !important; } .panel-subview-footer-button { @@ -275,34 +184,34 @@ #downloadsListBox>richlistitem { padding-inline-end: 8px !important; - border-radius: var(--arrowpanel-menuitem-border-radius) !important; -} - -#downloadsListBox, -.downloadsPanelFooterButton { - margin: var(--arrowpanel-menuitem-margin) !important; - width: auto !important; - min-width: auto !important; + border-radius: 0 !important; } #downloadsPanel-blockedSubview, #downloadsPanel-mainView { - padding: var(--panel-separator-margin-vertical) 0 !important; + padding: var(--panel-separator-margin-vertical) 0 0 !important; } #emptyDownloads { padding: 1.5em 16px 1.7em !important; } -#downloadsHistory .button-text { - margin-block: 0 !important; - margin-inline: 0 !important; -} - -.PanelUI-subView .subviewbutton-nav::after, -#PlacesToolbar menu>.menu-right, -.subviewbutton>.menu-right { - fill-opacity: 1 !important; +/* context menus */ +@media (-moz-windows-compositor) { + menupopup { + --panel-color: var(--arrowpanel-color) !important; + --panel-border-radius: 4px !important; + --panel-padding: 4px 0px !important; + --panel-border-color: var(--arrowpanel-border-color) !important; + --panel-background: var(--arrowpanel-background) !important; + --nested-margin: -6px !important; + --menuitem-hover-background-color: var(--panel-item-hover-bgcolor) !important; + --menu-background-color: var(--arrowpanel-background) !important; + --menu-color: var(--arrowpanel-color) !important; + --menuitem-disabled-hover-background-color: #0000 !important; + --menu-disabled-color: var(--panel-disabled-color) !important; + --menu-border-color: var(--panel-separator-color) !important; + } } /* auto complete popup */ @@ -312,329 +221,25 @@ box-shadow: 0 0 0 1px inset var(--arrowpanel-border-color) !important; } -#PopupAutoComplete .autocomplete-richlistitem[originaltype="loginsFooter"] { - justify-content: start !important; +.autocomplete-richlistitem[originaltype="loginsFooter"] { -moz-box-pack: start !important; color: inherit !important; + border-color: var(--panel-separator-color) !important; background-color: transparent !important; - height: 28px !important; - min-height: 28px !important; - padding-inline-start: var(--uc-contextmenu-menuitem-padding-inline) !important; - position: relative !important; - overflow: visible !important; - margin-top: calc(var(--uc-contextmenu-separator-vertical) * 2 + 1px) !important; + height: 40px !important; + padding-inline-start: var(--uc-autocomplete-panel-menuicon-padding-inline) !important; } -.autocomplete-richlistitem[originaltype="loginsFooter"]::before { - content: ""; - width: calc(100% + var(--uc-contextmenu-menuitem-margin-inline) * 2); - border-top: 1px solid var(--panel-separator-color); - position: absolute; - top: calc((var(--uc-contextmenu-separator-vertical) + var(--uc-contextmenu-menuitem-border-width)) * -1 - 1px); - left: calc(var(--uc-contextmenu-menuitem-margin-inline) * -1); -} - -#PopupAutoComplete .autocomplete-richlistitem:hover { +.autocomplete-richlistitem:hover { background-color: var(--panel-item-hover-bgcolor) !important; } -#PopupAutoComplete .autocomplete-richlistitem[selected] { +.autocomplete-richlistitem[selected] { background-color: var(--panel-item-active-bgcolor) !important; color: inherit !important; } .ac-site-icon { fill: currentColor !important; - margin-block: auto !important; - margin-inline: 0 var(--uc-autocomplete-panel-menuicon-padding-inline) !important; -} - -#PopupAutoComplete>richlistbox>richlistitem>.ac-title { - margin-inline: calc(16px + var(--uc-autocomplete-panel-menuicon-padding-inline)) !important; -} - -/* workaround for inaccessible shadow-root element - moves the shadow-root element underneath, and away from panel edges */ -#PopupAutoComplete { - padding-block: 10px !important; - padding-inline: 2px !important; -} - -panel[type="autocomplete-richlistbox"]>.autocomplete-richlistbox { - margin-block: -10px !important; - margin-inline: -2px !important; - padding: var(--uc-contextmenu-padding) !important; - border-radius: var(--uc-contextmenu-border-radius) !important; - color: inherit !important; -} - -#PopupAutoComplete>richlistbox>richlistitem>.two-line-wrapper { - padding-block: 0 !important; - padding-inline-end: calc((var(--uc-autocomplete-panel-menuitem-margin) + var(--arrowpanel-menuitem-padding-inline)) * 2) !important; -} - -#PlacesToolbar menuitem, -#PlacesToolbar menu, -panelview .toolbarbutton-1, -.subviewbutton, -.widget-overflow-list .toolbarbutton-1 { - min-height: calc(16px + var(--uc-contextmenu-menuitem-padding-block) * 2) !important; -} - -/* disable context menu when this tweak is applied */ -@media not (-moz-bool-pref: "uc.tweak.revert-context-menu") { - /* Context Menu */ - menupopup:not(.PanelUI-subView), - menupopup:not(.PanelUI-subView) menuitem, - menupopup:not(.PanelUI-subView) menu, - menupopup:not(.PanelUI-subView) menuseparator, - panel { - appearance: none !important; - } - - menupopup:not(.PanelUI-subView), - panel[type="autocomplete-richlistbox"], - menulist>menupopup:not(.PanelUI-subView)>menucaption { - -moz-window-shadow: none !important; - background: 0 !important; - border: 0 !important; - color: var(--arrowpanel-color) !important; - } - - .popup-internal-box, - panel[type="autocomplete-richlistbox"]>.autocomplete-richlistbox, - .menupopup-arrowscrollbox { - background: var(--arrowpanel-background) !important; - border: 1px solid light-dark(transparent, var(--panel-separator-color)) !important; - } - - /* make room for menu shadow */ - menupopup:not(.PanelUI-subView) { - padding: 4px 12px 20px !important; - margin: -6px -12px -16px !important; - } - - /* cut off shadow so it doesn't get in the way of the menubar items */ - menubar menupopup { - padding: 1px 8px 20px !important; - margin: -1px -4px -16px !important; - } - - menupopup { - --uc-margin: 0 !important; - --uc-box-shadow: - 0 8px 12px #0003, - 0 4px 5px #0002, - 0 2px 4px #0002, - 0 0 0 1px #0001; - } - - @media (prefers-color-scheme:dark) { - menupopup { - --uc-box-shadow: - 0 8px 12px #0003, - 0 4px 5px #0003, - 0 2px 4px #0002, - 0 0 0 1px #0002; - } - } - - /* use default shadow for subview menupopup (eg. bookmarks) */ - menupopup.PanelUI-subView { - --uc-box-shadow: 0 0 0 1px var(--panel-border-color); - --uc-margin: 1px !important; - margin-top: -5px !important; - } - - .menupopup-arrowscrollbox { - box-shadow: var(--uc-box-shadow) !important; - } - - .popup-internal-box { - margin: 0 !important; - } - - .popup-internal-box, - .menupopup-arrowscrollbox { - padding: var(--uc-contextmenu-padding) !important; - border-radius: var(--uc-contextmenu-border-radius) !important; - color: inherit !important; - } - - menupopup menu[disabled="true"], - menupopup menuitem[disabled="true"] { - color: var(--panel-disabled-color) !important; - background: none !important; - } - - menupopup menu:hover:not([disabled=true]), - menupopup menuitem:hover:not([disabled=true]), - menupopup menu[_moz-menuactive]:not([disabled=true]), - menupopup menuitem[_moz-menuactive]:not([disabled=true]) { - background-color: var(--panel-item-hover-bgcolor) !important; - color: inherit !important; - } - - menupopup menuitem:hover:active:not([disabled=true]), - menupopup menu:hover:active:not([disabled=true]) { - background-color: var(--panel-item-active-bgcolor) !important; - color: inherit !important; - } - - menupopup menuseparator { - margin: var(--uc-contextmenu-separator-vertical) 0 !important; - padding: 0 !important; - background: none !important; - border-top: 1px solid var(--panel-separator-color) !important; - - &::before { - content: unset !important; - } - } - - #PlacesToolbar menupopup[placespopup="true"] menuseparator::before { - display: none !important; - } - - menupopup menu, - menupopup menuitem, - menupopup menucaption, - #PopupAutoComplete>richlistbox>richlistitem { - padding: var(--uc-contextmenu-menuitem-padding-block) var(--uc-contextmenu-menuitem-padding-inline) !important; - margin: var(--uc-contextmenu-menuitem-margin) !important; - border-radius: var(--uc-contextmenu-menuitem-border-radius) !important; - border: var(--uc-contextmenu-menuitem-border-width) solid transparent !important; - background-clip: padding-box !important; - min-height: calc(16px + (var(--uc-contextmenu-menuitem-padding-block) + var(--uc-contextmenu-menuitem-border-width)) * 2) !important; - } - - :not(:not(menubar)>menu, #ContentSelectDropdown)>menupopup>menuitem:not(.menuitem-iconic, [type="checkbox"], [type="radio"], .in-menulist, .in-menulist menuitem, .unified-nav-current), - :not(:not(menubar)>menu, #ContentSelectDropdown)>menupopup>menu:not(.menu-iconic, [type="checkbox"], [type="radio"], .in-menulist, .in-menulist menu, .unified-nav-current), - :not(:not(menubar)>menu, #ContentSelectDropdown)>menupopup>menucaption { - padding-inline-start: calc(var(--uc-contextmenu-menuitem-padding-inline) + 16px + var(--uc-contextmenu-menuicon-margin-inline)) !important; - } - - .menu-iconic-icon { - margin-block: 0 !important; - margin-inline-end: 0 !important; - margin-inline-start: 0 !important; - } - - menu>.menu-iconic-text, - menuitem>.menu-iconic-text { - padding-inline-start: var(--uc-contextmenu-menuicon-margin-inline) !important; - } - - .menu-text, - .menu-iconic-text { - margin-inline-start: 0 !important; - padding-block: 0 !important; - } - - .menu-accel, - .menu-iconic-accel { - margin-inline-end: 0 !important; - padding-block: 0 !important; - opacity: 0.7 !important; - } - - .menu-iconic>.menu-iconic-left, - .menuitem-iconic>.menu-iconic-left { - padding-inline-end: 0 !important; - padding-block: 0 !important; - } - - menuitem:is(.menuitem-iconic:not([data-usercontextid]), [type="checkbox"], [type="radio"], [checked], [selected]) .menu-iconic-icon { - -moz-context-properties: fill !important; - fill: currentColor !important; - } - - .menu-right, - .menu-accel-container { - appearance: none !important; - margin-inline-end: 0 !important; - -moz-context-properties: fill; - fill: currentColor !important; - } - - menupopup menuitem:is([type="checkbox"], [type="radio"]) .menu-iconic-icon, - menulist>menupopup>menuitem .menu-iconic-icon, - menu .menu-right { - height: 16px !important; - width: 16px !important; - } - - menulist>menupopup>menuitem:is([checked="true"], [selected="true"])::before, - menupopup>menuitem::before, - menupopup>menuitem::after { - display: none !important; - } - - menuitem:is([type="checkbox"], [checked="true"], [type="radio"])>.menu-iconic-left>.menu-iconic-icon { - display: flex !important; - } - - menuitem[checked="true"]>.menu-iconic-left, - .menu-iconic>.menu-iconic-left, - .menuitem-iconic>.menu-iconic-left { - margin: 0 !important; - } - - #context-navigation:not([hidden]) { - padding: 0 !important; - --menuitem-min-width: calc(16px + var(--uc-contextmenu-menuitem-padding-inline) * 2) !important; - min-width: calc(4 * var(--menuitem-min-width)); - } - - #context-navigation>.menuitem-iconic>.menu-iconic-left>.menu-iconic-icon { - width: 16px !important; - height: 16px !important; - padding: 0 !important; - } - - #context-navigation { - margin-inline: var(--uc-contextmenu-menuitem-margin-inline) !important; - } - - #context-navigation>.menuitem-iconic { - justify-content: center !important; - -moz-box-pack: center !important; - } - - #context-navigation>.menuitem-iconic { - margin: 0 !important; - } - - #context-navigation>.menuitem-iconic { - flex-grow: 1 !important; - width: unset !important; - } - - #context-navigation>.menuitem-iconic[_moz-menuactive="true"]>.menu-iconic-left>.menu-iconic-icon { - background-color: transparent !important; - } - - #context-bookmarkpage[starred] .menu-iconic-icon { - fill: var(--lwt-toolbarbutton-icon-fill-attention, var(--toolbarbutton-icon-fill-attention, currentColor)) !important; - } - - @media not (-moz-bool-pref: "uc.tweak.smaller-context-menu-text") { - @media (-moz-platform: windows) { - .menu-text, - .menu-iconic-text, - panel .toolbarbutton-text { - margin-inline-start: 0 !important; - margin-block: -3px -1px !important; - padding-block: 0 !important; - } - - .menu-text, - .menu-iconic-text, - panel .toolbarbutton-text, - #appMenu-fxa-status2, - .panel-header { - font-size: 13.6px !important; - } - } - } + margin: auto var(--uc-autocomplete-panel-menuicon-padding-inline) !important; } diff --git a/chrome/global/tree.css b/chrome/global/tree.css deleted file mode 100644 index 2bbffb4..0000000 --- a/chrome/global/tree.css +++ /dev/null @@ -1,87 +0,0 @@ -/* Edge-Frfox - tree.css */ - -/* Change height of tree items and add rounded corners */ -treechildren::-moz-tree-row, -treecol:not([hideheader="true"]), -.tree-columnpicker-button { - min-height: max(28px, 1.3em) !important; - border-radius: 2px !important; -} - -/* Change the background colour on hover */ -@media not (prefers-contrast) { - treechildren::-moz-tree-row(hover) { - background-color: var(--toolbarbutton-hover-background) !important; - } -} - -/* Change the background colour when pressed */ -treechildren::-moz-tree-row(selected) { - background-color: var(--toolbarbutton-active-background) !important; -} - -/* Change the background colour when focused */ -treechildren::-moz-tree-row(selected, focus) { - background-color: var(--button-primary-bgcolor) !important; -} - -treechildren::-moz-tree-row(current, focus) { - outline: var(--default-focusring); - outline-color: var(--button-primary-bgcolor) !important; - outline-offset: calc(-1 * var(--default-focusring-width)); -} - -treechildren::-moz-tree-image(selected), -treechildren::-moz-tree-twisty(selected), -treechildren::-moz-tree-cell-text(selected) { - color: inherit !important; -} - -treechildren::-moz-tree-image(selected, focus), -treechildren::-moz-tree-twisty(selected, focus), -treechildren::-moz-tree-cell-text(selected, focus) { - color: var(--button-primary-color) !important; -} - -/* Spacing between icon and label */ -treechildren::-moz-tree-image { - margin-inline-end: 8px !important; -} - -/* Separator appearance */ -treechildren::-moz-tree-separator { - border-top: 1px solid var(--toolbarseparator-color) !important; - border-bottom: none !important; -} - -/* Change the colour of the drop feedback elements */ -treechildren::-moz-tree-cell-text(primary, dropOn) { - background-color: var(--button-primary-bgcolor) !important; - color: var(--button-primary-color) !important; -} - -treechildren::-moz-tree-drop-feedback { - background-color: var(--toolbarbutton-icon-fill-attention) !important; - border-radius: 2px !important; -} - -/* Change the appearance for the expandable items */ -treechildren::-moz-tree-twisty { - padding-top: 0 !important; - padding-inline: 4px !important; - width: 16px !important; - list-style-image: url("../icons/arrow-filled-right.svg") !important; -} - -treechildren:-moz-locale-dir(rtl)::-moz-tree-twisty(closed) { - list-style-image: url("../icons/arrow-filled-left.svg") !important; -} - -treechildren::-moz-tree-twisty(open) { - list-style-image: url("../icons/arrow-filled-down.svg") !important; -} - -/* Change the identation of child items */ -treechildren::-moz-tree-indentation { - width: 16px !important; -} diff --git a/chrome/global/tweaks.css b/chrome/global/tweaks.css index 126e378..f556b11 100644 --- a/chrome/global/tweaks.css +++ b/chrome/global/tweaks.css @@ -1,64 +1,61 @@ -/* Edge-Frfox - tweaks.css */ +/* EdgeFr-Fox by bmFtZQ - tweaks.css */ /* disable drag space above tabs */ -@media (-moz-bool-pref: "uc.tweak.disable-drag-space") { - :root { +@supports -moz-bool-pref("uc.tweak.disable-drag-space") { + :root #titlebar { --tab-block-margin: 0px !important; } } /* force tabs to toolbar bg (useful for proton themes) (might experience some bugs with certain themes eg. dark text on dark background.) */ -@media (-moz-bool-pref: "uc.tweak.force-tab-colour") { +@supports -moz-bool-pref("uc.tweak.force-tab-colour") { :root { --lwt-selected-tab-background-color: unset !important; } } -/* remove tab separators */ -@media (-moz-bool-pref: "uc.tweak.remove-tab-separators") { - .tabbrowser-tab .tab-stack { - &::before, - &::after { - content: initial !important; - } +/* hide firefox account button when not in private mode (useful as a private +browsing indicator) */ +@supports -moz-bool-pref("uc.tweak.fxa-button-as-private-indicator") { + :root:not([privatebrowsingmode]) #nav-bar:not([customizing]) #fxa-toolbar-menu-button { + display: none !important; } } -@media (-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; +/* remove tab separators */ +@supports -moz-bool-pref("uc.tweak.remove-tab-separators") { + .tabbrowser-tab:not([selected="true"], :hover, [beforeselected-visible], [beforehovered]) .tab-stack::after { + display: none !important; + } + + .tabbrowser-tab:not([last-visible-tab="true"]) { + margin-inline-end: 0px !important; + } +} + +@supports -moz-bool-pref("uc.tweak.less-permissions-button-padding") { + #identity-icon-box { + padding-inline: var(--uc-toolbarbutton-inner-inline-padding) !important; + } + + #identity-permission-box { + padding-inline: 2px var(--uc-urlbar-icon-inline-padding) !important; + margin-inline-start: -8px !important; + } +} + +@supports -moz-bool-pref("uc.tweak.floating-tabs") { + :root:not(:-moz-lwtheme) { + --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; - --uc-urlbar-shadow: none !important; - --uc-tab-border-color: light-dark(#0000, #fff1) !important; - --toolbar-non-lwt-bgcolor: var(--lwt-accent-color) !important; + --toolbar-bgcolor: #fff !important; } - @media (-moz-gtk-csd-available) { - :root:not(:-moz-lwtheme) { - --toolbar-bgcolor: color-mix(in srgb, -moz-dialog 80%, #fff) !important; - --toolbar-field-background-color: Field !important; - --lwt-tab-text: -moz-dialogtext !important; - --uc-tab-border-color: #ffffff0f !important; - } - } - - .tabbrowser-tab, - #tabbrowser-arrowscrollbox-periphery #tabs-newtab-button, - #TabsToolbar #TabsToolbar-customization-target> :not(#tabbrowser-tabs) { - padding-top: 4px !important; - } - - #tabbrowser-tabs { - margin-top: calc(var(--tab-block-margin) - 4px) !important; - } - - #TabsToolbar #TabsToolbar-customization-target> :not(#tabbrowser-tabs) { - margin-top: calc(var(--tab-block-margin) - 2px) !important; + :root[lwt-default-theme-in-dark-mode="true"] { + --toolbar-bgcolor: #4D4D4D !important; + --lwt-accent-color-inactive: unset !important; + --chrome-content-separator-color: #535353 !important; } /* remove toolbar bg */ @@ -77,28 +74,33 @@ bugs with certain themes eg. dark text on dark background.) */ border-radius: var(--tab-border-radius) !important; } - .tab-background[selected] { - outline: 1px solid var(--uc-tab-border-color, var(--lwt-tab-line-color, var(--lwt-tabs-border-color, transparent))) !important; - outline-offset: -1px !important; - } - /* adjust spacing of area above tabs */ - @media not (-moz-platform: macos) { - :root[sizemode="maximized"] { + @supports not -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + :root[sizemode="maximized"] #titlebar { --tab-block-margin: 4px !important; } } - :root:is([inFullscreen], :not([tabsintitlebar])) { + :root:is([inFullscreen], :not([tabsintitlebar])) #titlebar { --tab-block-margin: 4px !important; } - @media (-moz-bool-pref: "uc.tweak.disable-drag-space") { - :root { + @supports -moz-bool-pref("uc.tweak.disable-drag-space") { + :root #titlebar { --tab-block-margin: 4px !important; } } + :root #titlebar { + --tab-min-height: 33px !important; + } + + /* remove navbar shadow */ + #titlebar, + :root[lwtheme-brighttext="true"] #titlebar { + box-shadow: none !important; + } + /* move tab shadow behind urlbar */ .tabbrowser-tab[visuallyselected="true"], #nav-bar { @@ -122,187 +124,73 @@ bugs with certain themes eg. dark text on dark background.) */ margin-bottom: -8px !important; } - :root { - --uc-titlebar-shadow: none; - --uc-tab-shadow: - 0 3.3px 3px rgb(0 0 0 / .06), - 0 0 0 1px rgb(0 0 0 / .11); + .tabbrowser-tab:is([visuallyselected="true"], [multiselected])>.tab-stack>.tab-background { + box-shadow: 0 3px 4px rgba(0, 0, 0, 0.12), 0 0px 2px rgba(0, 0, 0, 0.1) !important; } - :root[lwtheme-brighttext="true"] { - --uc-titlebar-shadow: none; - --uc-tab-shadow: 0 1px 2px rgb(0 0 0 / .08); - } -} - -@media not (-moz-platform: macos) { - @media not (-moz-bool-pref: "uc.tweak.revert-context-menu") { - @media (-moz-bool-pref: "uc.tweak.vertical-context-navigation") { - #context-navigation { - flex-direction: column !important; - -moz-box-orient: vertical !important; - } - - #context-navigation>.menuitem-iconic { - justify-content: start !important; - -moz-box-pack: start !important; - } - - #context-navigation .menu-iconic-text { - display: flex !important; - } - - :root, - :root[lang^="en"] { - --uc-string-back: "Back"; - --uc-string-forward: "Forward"; - --uc-string-reload: "Reload"; - --uc-string-stop: "Stop"; - --uc-string-bookmark-page: "Bookmark Page"; - --uc-string-edit-bookmark: "Edit Bookmark"; - } - - #context-navigation>#context-back .menu-iconic-text::before { - content: var(--uc-string-back) !important; - } - - #context-navigation>#context-forward .menu-iconic-text::before { - content: var(--uc-string-forward) !important; - } - - #context-navigation>#context-reload .menu-iconic-text::before { - content: var(--uc-string-reload) !important; - } - - #context-navigation>#context-stop .menu-iconic-text::before { - content: var(--uc-string-stop) !important; - } - - #context-navigation>#context-bookmarkpage .menu-iconic-text::before { - content: var(--uc-string-bookmark-page) !important; - } - - #context-navigation>#context-bookmarkpage[starred] .menu-iconic-text::before { - content: var(--uc-string-edit-bookmark) !important; - } - } + :root[lwtheme-brighttext="true"] .tabbrowser-tab:is([visuallyselected="true"], [multiselected])>.tab-stack>.tab-background { + box-shadow: 0 3px 4px rgba(0, 0, 0, 0.25), 0 0px 2px rgba(0, 0, 0, 0.1) !important; } } @media (-moz-windows-compositor) { - @media (-moz-bool-pref: "uc.tweak.revert-context-menu") { - menupopup { - --panel-color: var(--arrowpanel-color) !important; - --panel-border-radius: 4px !important; - --panel-border-color: var(--arrowpanel-border-color) !important; - --panel-background: var(--arrowpanel-background) !important; - --menuitem-hover-background-color: var(--panel-item-hover-bgcolor) !important; - --menu-background-color: var(--arrowpanel-background) !important; - --menu-color: var(--arrowpanel-color) !important; - --menuitem-disabled-hover-background-color: #0000 !important; - --menu-disabled-color: var(--panel-disabled-color) !important; - --menu-border-color: var(--panel-separator-color) !important; + @supports -moz-bool-pref("uc.tweak.win11-mica") { + /* enable mica appearance */ + #main-window:not(:-moz-lwtheme), + #main-window[lwt-default-theme-in-dark-mode="true"] { + appearance: -moz-win-glass !important; + background: transparent !important; } - } -} -@media (-moz-bool-pref: "uc.tweak.show-tab-close-button-on-hover") { - #tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:not([pinned], [selected]):hover .tab-close-button { - display: flex !important; - } -} + #main-window[lwt-default-theme-in-dark-mode="true"] #navigator-toolbox:not(:-moz-window-inactive) { + background: transparent !important; + } -@media (-moz-bool-pref: "uc.tweak.hide-tabs-bar") { - :root:not([customizing]) { - /* Height of navbar, used for determining height and position of window controls */ - --uc-navbar-height: 38px; - /* Drag space next to the window controls, allows you to move the window more easily */ - --uc-titlebar-drag-space: 40px; - - @media not (-moz-bool-pref: "uc.tweak.hide-tabs-bar.only-when-maximised") { - /* Set containing block for the window buttons */ - & #titlebar { - position: relative !important; - } - - /* Hide the tabs */ - & #TabsToolbar { - visibility: collapse !important; - padding-inline-start: 0 !important; - } - - /* Add some padding to the top of the navbar */ - & #nav-bar { - padding-top: var(--tab-block-margin) !important; + @supports -moz-bool-pref("uc.tweak.floating-tabs") { + #navigator-toolbox:not(:-moz-lwtheme), + #main-window[lwt-default-theme-in-dark-mode="true"] #navigator-toolbox:not(:-moz-window-inactive) { + background: transparent !important; } } - /* macOS specific positioning */ - @media (-moz-platform: macos) { - &[inFullscreen] { - /* Hide the tabs */ - & #TabsToolbar { - visibility: collapse !important; - padding-inline-start: 0 !important; - } + /* force tab color (for the tab transparency) */ + .tab-background:is([selected], [multiselected]) { + background: var(--toolbar-bgcolor) !important; + } + + /* color adjustments */ + :root:not(:-moz-lwtheme):not(:-moz-window-inactive) { + --lwt-accent-color: #00000020 !important; + } + + @supports -moz-bool-pref("uc.tweak.floating-tabs") { + :root:not(:-moz-lwtheme):not(:-moz-window-inactive) { + --toolbar-bgcolor: #ffffffcc !important; } - @media not (-moz-bool-pref: "uc.tweak.hide-tabs-bar.only-when-maximised") { - /* Offset navbar contents to make space for the window controls */ - &[tabsintitlebar] #nav-bar:not([inFullscreen]) { - padding-left: calc(84px + var(--uc-titlebar-drag-space)); - - /* Remove the padding from the side of the navbar */ - & #nav-bar-customization-target > :is(toolbarbutton, toolbaritem):first-child { - padding-inline-start: 0 !important; - } - } - - /* Positioning of the window controls */ - #TabsToolbar .titlebar-buttonbox { - --uc-position: calc((var(--uc-navbar-height) + var(--tab-block-margin)) / 2 - 8px); - visibility: visible !important; - position: absolute !important; - top: var(--uc-position); - left: var(--uc-position); - margin: 0 !important; - } + :root[lwt-default-theme-in-dark-mode="true"]:not(:-moz-window-inactive) { + --toolbar-bgcolor: #ffffff20 !important; } } - /* Windows specific positioning */ - @media (-moz-platform: windows) { - /* Offset navbar contents to make space for the window controls */ - &:where([inFullscreen], [tabsintitlebar]) #nav-bar { - padding-right: calc(140px + var(--uc-titlebar-drag-space)); + /* line up buttons with duplicate icons from -moz-win-glass */ + .titlebar-buttonbox-container { + --uc-titlebar-button-size: 30px; + --uc-titlebar-size: calc(var(--tab-min-height) + var(--tab-block-margin)); + margin-bottom: calc(var(--uc-titlebar-size) - var(--uc-titlebar-button-size)) !important; + } - /* Remove the padding from the side of the navbar */ - & #PanelUI-menu-button { - padding-inline-end: 0 !important; - } - } + .titlebar-button:not(.titlebar-close:hover, :-moz-window-inactive) { + list-style-image: none !important; + } - /* Positioning of the window controls */ - & #toolbar-menubar[inactive] + #TabsToolbar .titlebar-buttonbox { - visibility: visible !important; - position: absolute !important; - top: 0; - right: 0; - height: calc(var(--uc-navbar-height) + var(--tab-block-margin)) !important; - } - - /* Set background colour of the menu bar to maintain consistency with the navbar */ - @media not (-moz-bool-pref: "uc.tweak.floating-tabs") { - #toolbar-menubar { - background-color: var(--toolbar-bgcolor) !important; - } - } + :root:is([inFullscreen], [sizemode="maximized"]) .titlebar-button { + padding-block: 7px 9px !important; + } + + :root:is([inFullscreen], [sizemode="maximized"]) .titlebar-close { + padding-block: 7px 9px !important; + padding-right: 19px !important; } } } - -@media (-moz-bool-pref: "uc.tweak.hide-forward-button") { - :root:not([customizing]) #forward-button[disabled] { - display: none !important; - } -} diff --git a/chrome/icons/accessibility.svg b/chrome/icons/accessibility.svg deleted file mode 100755 index bfcf02a..0000000 --- a/chrome/icons/accessibility.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/chrome/icons/account-private.svg b/chrome/icons/account-private.svg deleted file mode 100644 index 4c3040e..0000000 --- a/chrome/icons/account-private.svg +++ /dev/null @@ -1,13 +0,0 @@ - - - - - - - - - - - - - diff --git a/chrome/icons/account.svg b/chrome/icons/account.svg deleted file mode 100644 index 1400006..0000000 --- a/chrome/icons/account.svg +++ /dev/null @@ -1,7 +0,0 @@ - - - - - - - diff --git a/chrome/icons/add-to-dictionary.svg b/chrome/icons/add-to-dictionary.svg deleted file mode 100644 index ebcb80f..0000000 --- a/chrome/icons/add-to-dictionary.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - diff --git a/chrome/icons/arrow-filled-down.svg b/chrome/icons/arrow-filled-down.svg deleted file mode 100644 index bd111a7..0000000 --- a/chrome/icons/arrow-filled-down.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/chrome/icons/arrow-filled-left.svg b/chrome/icons/arrow-filled-left.svg deleted file mode 100644 index c0f6945..0000000 --- a/chrome/icons/arrow-filled-left.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/chrome/icons/arrow-filled-right.svg b/chrome/icons/arrow-filled-right.svg deleted file mode 100644 index 2f65f5e..0000000 --- a/chrome/icons/arrow-filled-right.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/chrome/icons/arrow-left.svg b/chrome/icons/arrow-left.svg deleted file mode 100644 index 1da2ba2..0000000 --- a/chrome/icons/arrow-left.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/chrome/icons/audio-save.svg b/chrome/icons/audio-save.svg deleted file mode 100644 index 21b6752..0000000 --- a/chrome/icons/audio-save.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - diff --git a/chrome/icons/bookmark-star-on-tray.svg b/chrome/icons/bookmark-star-on-tray.svg index e35453e..912cdc9 100644 --- a/chrome/icons/bookmark-star-on-tray.svg +++ b/chrome/icons/bookmark-star-on-tray.svg @@ -1,4 +1,4 @@ - - - + + + diff --git a/chrome/icons/checkmark.svg b/chrome/icons/checkmark.svg deleted file mode 100644 index ade387a..0000000 --- a/chrome/icons/checkmark.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/chrome/icons/container-tab.svg b/chrome/icons/container-tab.svg deleted file mode 100644 index 3a11413..0000000 --- a/chrome/icons/container-tab.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/chrome/icons/duplicate-tab.svg b/chrome/icons/duplicate-tab.svg deleted file mode 100644 index 5c80180..0000000 --- a/chrome/icons/duplicate-tab.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/chrome/icons/edit-delete.svg b/chrome/icons/edit-delete.svg deleted file mode 100755 index cf851d6..0000000 --- a/chrome/icons/edit-delete.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/chrome/icons/edit-redo.svg b/chrome/icons/edit-redo.svg deleted file mode 100644 index 4fd020f..0000000 --- a/chrome/icons/edit-redo.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/chrome/icons/edit-select-all.svg b/chrome/icons/edit-select-all.svg deleted file mode 100755 index f39494d..0000000 --- a/chrome/icons/edit-select-all.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/chrome/icons/edit-undo.svg b/chrome/icons/edit-undo.svg deleted file mode 100755 index 7595ba6..0000000 --- a/chrome/icons/edit-undo.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/chrome/icons/edit.svg b/chrome/icons/edit.svg deleted file mode 100644 index f77c003..0000000 --- a/chrome/icons/edit.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/chrome/icons/firefox-view.svg b/chrome/icons/firefox-view.svg deleted file mode 100644 index 6288a1e..0000000 --- a/chrome/icons/firefox-view.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/chrome/icons/icons.css b/chrome/icons/icons.css index e99d62c..047ccb6 100644 --- a/chrome/icons/icons.css +++ b/chrome/icons/icons.css @@ -1,9 +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), -(-moz-gtk-csd-available) { +@media (-moz-windows-compositor) { .titlebar-min { list-style-image: url("win11-minimize.svg") !important; } @@ -20,32 +19,24 @@ and 11 so applied to both) */ list-style-image: url("win11-close.svg") !important; } - /* darkmode icon that uses thicker strokes and is easier to see (only needed - at 1x scale) */ + /* darkmode icon that uses thicker strokes and 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; } } } -.subviewbutton { +#appMenu-multiView .subviewbutton, +#overflowMenu-customize-button { -moz-context-properties: fill, fill-opacity !important; fill: currentColor !important; } -:root[fxastatus="not_configured"] #fxa-avatar-image { - list-style-image: url("account.svg") !important; -} - -.private-browsing-indicator-icon { - list-style-image: url("account-private.svg") !important; - border-radius: 100% !important; -} - /* disable context menu icons on macOS */ -@media not (-moz-platform: macos) { +@supports not -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { #context-back { list-style-image: url("back.svg") !important; } @@ -103,16 +94,14 @@ and 11 so applied to both) */ #downloads-button, #downloads-indicator-anchor, -#appMenu-downloads-button, -#appMenu-library-downloads-button { +#appMenu-downloads-button { list-style-image: url("downloads.svg") !important; } #appMenu-passwords-button, -#password-notification-icon, -#PopupAutoComplete>richlistbox>richlistitem[originaltype="generatedPassword"]>.two-line-wrapper>.ac-site-icon, -#PopupAutoComplete>richlistbox>richlistitem[originaltype="loginWithOrigin"]>.two-line-wrapper>.ac-site-icon, -#PopupAutoComplete>richlistbox>richlistitem[originaltype="login"]>.ac-site-icon { +#PopupAutoComplete > richlistbox > richlistitem[originaltype="generatedPassword"] > .two-line-wrapper > .ac-site-icon, +#PopupAutoComplete > richlistbox > richlistitem[originaltype="loginWithOrigin"] > .two-line-wrapper > .ac-site-icon, +#PopupAutoComplete > richlistbox > richlistitem[originaltype="login"] > .ac-site-icon { list-style-image: url("passwords.svg") !important; } @@ -133,10 +122,6 @@ and 11 so applied to both) */ list-style-image: url("new-tab.svg") !important; } -#firefox-view-button { - list-style-image: url("firefox-view.svg") !important; -} - #sync-button, .urlbarView-row[source="tabs"]>.urlbarView-row-inner>.urlbarView-no-wrap>.urlbarView-favicon, #urlbar-engine-one-off-item-tabs { @@ -146,10 +131,7 @@ and 11 so applied to both) */ #history-panelmenu, .urlbarView-row[source="history"]>.urlbarView-row-inner>.urlbarView-no-wrap>.urlbarView-favicon, #urlbar-engine-one-off-item-history, -#appMenu-history-button, -#appMenu-library-history-button, -#sidebar-switcher-history, -#sidebar-box[sidebarcommand="viewHistorySidebar"]>#sidebar-header>#sidebar-switcher-target>#sidebar-icon { +#appMenu-history-button { list-style-image: url("history.svg") !important; } @@ -163,18 +145,10 @@ and 11 so applied to both) */ list-style-image: url("print.svg") !important; } -.searchbar-search-icon { - list-style-image: url("search-glass.svg") !important; -} - #find-button, +.searchbar-search-icon, #appMenu-find-button2 { - list-style-image: url("search-page.svg") !important; -} - -#appMenu-translate-button, -#translations-button-icon { - list-style-image: url("translate.svg") !important; + list-style-image: url("search-glass.svg") !important; } #open-file-button { @@ -182,8 +156,7 @@ and 11 so applied to both) */ } #add-ons-button, -#appMenu-extensions-themes-button, -#unified-extensions-button { +#appMenu-extensions-themes-button { list-style-image: url("extension.svg") !important; } @@ -221,8 +194,7 @@ and 11 so applied to both) */ #preferences-button, .search-setting-button>.button-box>.button-icon, -#appMenu-settings-button, -.unified-extensions-item-open-menu.subviewbutton { +#appMenu-settings-button { list-style-image: url("settings.svg") !important; } @@ -230,11 +202,8 @@ and 11 so applied to both) */ list-style-image: url("forget.svg") !important; } +#privatebrowsing-button, #appMenu-new-private-window-button2 { - list-style-image: url("private-window.svg") !important; -} - -#privatebrowsing-button { list-style-image: url("privateBrowsing.svg") !important; } @@ -269,10 +238,7 @@ and 11 so applied to both) */ } #bookmarks-menu-button, -#appMenu-bookmarks-button, -#sidebar-switcher-bookmarks, -#appMenu-library-bookmarks-button, -#sidebar-box[sidebarcommand="viewBookmarksSidebar"]>#sidebar-header>#sidebar-switcher-target>#sidebar-icon { +#appMenu-bookmarks-button { list-style-image: url("bookmark-star-on-tray.svg") !important; } @@ -317,7 +283,7 @@ and 11 so applied to both) */ /* security */ .identity-popup-security-connection { - list-style-image: url("security-broken.svg") !important; + background-image: url("security-broken.svg") !important; } #identity-box[pageproxystate="valid"].notSecure #identity-icon, @@ -327,30 +293,30 @@ and 11 so applied to both) */ } #identity-popup[connection=chrome] .identity-popup-security-connection { - list-style-image: url("firefox.svg") !important; + background-image: url("firefox.svg") !important; } #identity-popup[connection="file"] .identity-popup-security-connection { - list-style-image: url("page-portrait.svg") !important; + background-image: url("page-portrait.svg") !important; } #identity-popup[connection^=secure] .identity-popup-security-connection { - list-style-image: url("security.svg") !important; + background-image: url("security.svg") !important; } #identity-popup[ciphers=weak] .identity-popup-security-connection, #identity-popup[mixedcontent~=passive-loaded][isbroken] .identity-popup-security-connection, #identity-popup[connection=secure-cert-user-overridden] .identity-popup-security-connection, #identity-popup[connection=cert-error-page] .identity-popup-security-connection { - list-style-image: url("security-warning.svg") !important; + background-image: url("security-warning.svg") !important; } #identity-popup[connection=net-error-page] .identity-popup-security-connection { - list-style-image: url("info.svg") !important; + background-image: url("info.svg") !important; } #identity-popup[connection=extension] .identity-popup-security-connection { - list-style-image: url("extension.svg") !important; + background-image: url("extension.svg") !important; } #appMenu-new-tab-button2 { @@ -370,9 +336,7 @@ and 11 so applied to both) */ .widget-overflow-list .subviewbutton-nav::after, .PanelUI-subView .subviewbutton-nav::after, .menu-right { - content: url("arrow-filled-right.svg") !important; - opacity: 0.6 !important; - scale: 0.75 !important; + content: url("arrow-right.svg") !important; } #PlacesChevron, @@ -380,10 +344,6 @@ and 11 so applied to both) */ list-style-image: url("arrow-right.svg") !important; } -.panel-header>.subviewbutton-back { - list-style-image: url("arrow-left.svg") !important; -} - #overflowMenu-customize-button, #appmenu-moreTools-button { list-style-image: url("customize.svg") !important; @@ -403,27 +363,32 @@ and 11 so applied to both) */ list-style-image: url("bookmark.svg") !important; } -#sidebar-box[sidebarcommand="viewTabsSidebar"]>#sidebar-header>#sidebar-switcher-target>#sidebar-icon, -#sidebar-switcher-tabs { - list-style-image: url("send-to-device.svg") !important; -} - /* tab icons */ .tab-icon-image[src="chrome://branding/content/icon32.png"], +.tab-icon-image[src="chrome://global/skin/icons/settings.svg"], +.tab-icon-image[src="chrome://mozapps/skin/extensions/extension.svg"], +.tab-icon-image[src="chrome://browser/skin/customize.svg"], .tab-icon-image[src="chrome://browser/skin/privatebrowsing/favicon.svg"] { - content: url("new-tab-image.svg") !important; + padding-left: 16px !important; + box-sizing: border-box !important; +} + +.tab-icon-image[src="chrome://branding/content/icon32.png"], +.tab-icon-image[src="chrome://browser/skin/privatebrowsing/favicon.svg"] { + background: url("new-tab-image.svg") !important; } .tab-icon-image[src="chrome://global/skin/icons/settings.svg"] { - content: url("settings.svg") !important; + background: url("settings.svg") !important; } + .tab-icon-image[src="chrome://mozapps/skin/extensions/extension.svg"] { - content: url("extension.svg") !important; + background: url("extension.svg") !important; } .tab-icon-image[src="chrome://browser/skin/customize.svg"] { - content: url("customize.svg") !important; + background: url("customize.svg") !important; } /* permissions */ @@ -481,8 +446,7 @@ and 11 so applied to both) */ } .popup-notification-icon[popupid="persistent-storage"], -.persistent-storage-icon, -.indexedDB-icon { +.persistent-storage-icon { list-style-image: url("persistent-storage.svg") !important; } @@ -551,460 +515,3 @@ and 11 so applied to both) */ #stop-reload-button[animate]>#reload-button>.toolbarbutton-animatable-box>.toolbarbutton-animatable-image { background-image: url("stop-to-reload.svg") !important; } - -#reader-mode-button>.urlbar-icon { - list-style-image: url("reader-mode.svg") !important; -} - -#unified-extensions-manage-extensions { - list-style-image: url("manage.svg") !important; -} - -/* disable context menu icons when this tweak is applied */ -@media not (-moz-bool-pref: "uc.tweak.revert-context-menu") { - - /* Context Menu Icons */ - menupopup>menuitem:is([checked="true"], [selected="true"]) .menu-iconic-icon { - list-style-image: url("checkmark.svg") !important; - } - - #context-video-pictureinpicture:not([checked="true"]) .menu-iconic-icon { - list-style-image: url("media-pip.svg") !important; - } - - #context-media-loop:not([checked="true"]) .menu-iconic-icon { - list-style-image: url("media-loop.svg") !important; - } - - :not(:not(menubar)>menu, #ContentSelectDropdown)>menupopup>menuitem:not(.menuitem-iconic, [type="checkbox"], [type="radio"], .in-menulist, .in-menulist menuitem, .unified-nav-current), - :not(:not(menubar)>menu, #ContentSelectDropdown)>menupopup>menu:not(.menu-iconic, [type="checkbox"], [type="radio"], .in-menulist, .in-menulist menu, .unified-nav-current) { - background-image: var(--menu-image) !important; - background-size: 16px !important; - background-position: var(--uc-contextmenu-menuitem-padding-inline) center !important; - background-repeat: no-repeat !important; - -moz-context-properties: fill, fill-opacity !important; - fill: currentColor !important; - } - - @media (-moz-platform: macos) { - #context-back { - --menu-image: url("back.svg"); - } - - #context-forward { - --menu-image: url("forward.svg"); - } - - #context-reload { - --menu-image: url("reload.svg"); - } - - #context-stop { - --menu-image: url("close.svg"); - } - - #context-bookmarkpage { - --menu-image: url("bookmark-hollow.svg"); - } - - #contentAreaContextMenu #context-bookmarkpage[starred] { - --menu-image: url("bookmark.svg"); - fill: var(--lwt-toolbarbutton-icon-fill-attention, var(--toolbarbutton-icon-fill-attention, currentColor)) !important; - } - } - - #context-savepage { - --menu-image: url("save.svg"); - } - - #context-selectall, - .textbox-contextmenu menuitem[cmd*="selectAll"], - #context_selectAllTabs, - #toolbar-context-selectAllTabs { - --menu-image: url("edit-select-all.svg"); - } - - #context-undo, - .textbox-contextmenu menuitem[cmd*="undo"], - #context_undoCloseTab, - #toolbar-context-undoCloseTab { - --menu-image: url("edit-undo.svg"); - } - - #context-redo, - .textbox-contextmenu menuitem[cmd*="redo"] { - --menu-image: url("edit-redo.svg"); - } - - #context-copy, - .textbox-contextmenu menuitem[cmd*="copy"], - #placesContext_copy { - --menu-image: url("edit-copy.svg"); - } - - #context-paste, - .textbox-contextmenu menuitem[cmd*="paste"], - #placesContext_paste_group { - --menu-image: url("edit-paste.svg"); - } - - #context-cut, - .textbox-contextmenu menuitem[cmd*="cut"], - #placesContext_cut { - --menu-image: url("edit-cut.svg"); - } - - #context-delete, - .customize-context-removeExtension, - .unified-extensions-context-menu-remove-extension, - .textbox-contextmenu menuitem[cmd*="delete"], - menuitem[id="placesContext_deleteBookmark"], - menuitem[id="placesContext_deleteFolder"], - menuitem[id="placesContext_delete"], - menuitem[id="placesContext_delete_history"], - menuitem[id="placesContext_deleteHost"] { - --menu-image: url("edit-delete.svg"); - } - - #paste-and-go { - --menu-image: url("paste-and-go.svg"); - } - - #context-print-selection { - --menu-image: url("print.svg"); - } - - #context-take-screenshot { - --menu-image: url("screenshot.svg"); - } - - #context-viewsource { - --menu-image: url("source-code.svg"); - } - - #context-inspect-a11y { - --menu-image: url("accessibility.svg"); - } - - #context-inspect { - --menu-image: url("inspect.svg"); - } - - #context-searchselect { - --menu-image: url("search-glass.svg"); - } - - #context-viewimage { - --menu-image: url("image-open.svg"); - } - - #context-saveimage, - #context-video-saveimage { - --menu-image: url("image-save.svg"); - } - - #context-savevideo { - --menu-image: url("video-save.svg"); - } - - #context-viewvideo { - --menu-image: url("video-open.svg") - } - - #context-saveaudio { - --menu-image: url("audio-save.svg"); - } - - #context-copyimage-contents { - --menu-image: url("image-copy.svg"); - } - - #context-copyimage, - #context-copyvideourl, - #context-copylink { - --menu-image: url("link.svg"); - } - - #context-sendimage, - #context-sendvideo, - #context-sendaudio { - --menu-image: url("mail.svg"); - } - - #context-setDesktopBackground, - .viewCustomizeToolbar { - --menu-image: url("customize.svg"); - } - - #context-reloadimage, - #context_reloadTab, - #context_reloadSelectedTabs, - #toolbar-context-reloadSelectedTab, - #toolbar-context-reloadSelectedTabs { - --menu-image: url("reload.svg"); - } - - #context-sendlinktodevice, - #context_sendTabToDevice, - #context-sendpagetodevice { - --menu-image: url("send-to-device.svg"); - } - - #context-openlinkintab, - #context-openlinkincontainertab, - menuitem[id="placesContext_open:newtab"], - menuitem[id="placesContext_openLinks:tabs"], - menuitem[id="placesContext_openBookmarkLinks:tabs"], - menuitem[id="placesContext_openBookmarkContainer:tabs"] { - --menu-image: url("tab.svg"); - } - - #context_openANewTab, - #toolbar-context-openANewTab { - --menu-image: url("new-tab-image.svg"); - } - - #context-openlinkinusercontext-menu, - menu[id="placesContext_open:newcontainertab"], - menu[id="placesContext_openContainer:tabs"] { - --menu-image: url("container-tab.svg"); - } - - #context-openlink, - menuitem[id="placesContext_open:newwindow"] { - --menu-image: url("window.svg"); - } - - #context-openlinkprivate, - menuitem[id="placesContext_open:newprivatewindow"] { - --menu-image: url("private-window.svg"); - } - - #context-savelink { - --menu-image: url("downloads.svg"); - } - - #spell-add-to-dictionary { - --menu-image: url("add-to-dictionary.svg"); - } - - #manage-saved-logins { - --menu-image: url("passwords.svg"); - } - - #context-media-play, - #context_playTab, - #context_playSelectedTabs { - --menu-image: url("media-play.svg"); - } - - #context-media-pause { - --menu-image: url("media-pause.svg"); - } - - #context-media-mute, - #context_toggleMuteTab, - #context_toggleMuteSelectedTabs { - --menu-image: url("media-mute.svg"); - } - - #context-media-unmute, - #context_toggleMuteTab[muted], - #context_toggleMuteSelectedTabs[muted] { - --menu-image: url("media-unmute.svg"); - } - - #context-media-playbackrate { - --menu-image: url("media-speed.svg"); - } - - #context-video-fullscreen { - --menu-image: url("fullscreen.svg"); - } - - #context-leave-dom-fullscreen, - menuitem[contexttype="fullscreen"][label*="Exit"] { - --menu-image: url("fullscreen-exit.svg"); - } - - #context-media-hidecontrols, - #context-media-showcontrols { - --menu-image: url("permissions.svg"); - } - - #context_pinTab, - #context_unpinTab, - #context_pinSelectedTabs, - #context_unpinSelectedTabs, - .customize-context-moveToPanel { - --menu-image: url("pin.svg"); - } - - #context_duplicateTab, - #context_duplicateTabs { - --menu-image: url("duplicate-tab.svg"); - } - - #context_bookmarkTab, - #context_bookmarkSelectedTabs, - #toggle_PersonalToolbar, - #context-bookmarklink, - #toolbar-context-bookmarkSelectedTab, - #toolbar-context-bookmarkSelectedTabs { - --menu-image: url("bookmark-hollow.svg"); - } - - menuitem[id="placesContext_show_bookmark:info"], - menuitem[id="placesContext_show_folder:info"], - menuitem[id="placesContext_show:info"] { - --menu-image: url("edit.svg"); - } - - menuitem[id="placesContext_showAllBookmarks"], - #BMB_bookmarksShowAllTop, - #BMB_bookmarksShowAll, - .customize-context-manageExtension, - .unified-extensions-context-menu-manage-extension { - --menu-image: url("manage.svg"); - } - - menuitem[id="placesContext_new:bookmark"], - menuitem[id="placesContext_new:folder"], - menuitem[id="placesContext_new:separator"] { - --menu-image: url("plus.svg"); - } - - #context-savelinktopocket, - #context-pocket { - --menu-image: url("pocket-outline.svg"); - } - - #context_moveTabOptions { - --menu-image: url("move-tab.svg"); - } - - .share-tab-url-item { - --menu-image: url("share.svg"); - } - - #context_reopenInContainer { - --menu-image: url("container-tab.svg"); - } - - #context_closeTab { - --menu-image: url("close.svg"); - } - - .customize-context-reportExtension, - .unified-extensions-context-menu-report-extension { - --menu-image: url("report.svg"); - } -} - -/* header icons for the app menu sub menus (eg. fx account, history...) */ -.panel-header>h1>span::before { - content: ""; - background: var(--header-image, none) center / 16px no-repeat; - -moz-context-properties: fill, fill-opacity; - fill: currentColor; - padding-inline-start: calc(var(--uc-enabled, 0) * 16px); - margin-inline-end: calc(var(--uc-enabled, 0) * 8px); -} - -#PanelUI-fxa .panel-header>h1>span::before { - --header-image: var(--avatar-image-url); - --uc-enabled: 1; - transform: scale(1.25); - border-radius: 99px; - display: inline-block; - height: 16px; -} - -#PanelUI-bookmarks .panel-header>h1>span::before { - --header-image: url("bookmark-star-on-tray.svg"); - --uc-enabled: 1; -} - -#PanelUI-history .panel-header>h1>span::before { - --header-image: url("history.svg"); - --uc-enabled: 1; -} - -#PanelUI-helpView .panel-header>h1>span::before { - --header-image: url("help.svg"); - --uc-enabled: 1; -} - -#appMenu-libraryView .panel-header>h1>span::before { - --header-image: url("library.svg"); - --uc-enabled: 1; -} - -#unified-extensions-panel .panel-header>h1>span::before { - --header-image: url("extension.svg"); - --uc-enabled: 1; -} - -/* Tree items used for side bar and library windows */ -treechildren::-moz-tree-image { - fill-opacity: 1 !important; -} - -treechildren::-moz-tree-image(title) { - list-style-image: url("page-portrait.svg") !important; -} - -/* default folder icon */ -treechildren::-moz-tree-image(title, container), -treechildren::-moz-tree-image(title, open) { - list-style-image: url("folder.svg") !important; -} - -/* bookmarks bar icon */ -treechildren::-moz-tree-image(container, queryFolder_toolbar_____) { - list-style-image: url("bookmark-hollow.svg") !important; -} - -/* bookmarks menu icon */ -treechildren::-moz-tree-image(container, queryFolder_menu________) { - list-style-image: url("folder.svg") !important; -} - -/* smart folder icon */ -treechildren::-moz-tree-image(query) { - list-style-image: url("settings.svg") !important; -} - -/* bookmarks category icon */ -treechildren::-moz-tree-image(query, OrganizerQuery_allbms_____v) { - list-style-image: url("bookmark-hollow.svg") !important; -} - -/* downloads category icon */ -treechildren::-moz-tree-image(query, OrganizerQuery_downloads__v) { - list-style-image: url("downloads.svg") !important; -} - -/* tags category icon */ -treechildren::-moz-tree-image(title, query, tagContainer), -treechildren::-moz-tree-image(query, OrganizerQuery_tags_______v) { - list-style-image: url("tag.svg") !important; -} - -/* calendar icon for folders grouping items by date */ -treechildren::-moz-tree-image(title, query, dayContainer) { - list-style-image: url("history.svg") !important; -} - -treechildren::-moz-tree-image(title, query, hostContainer) { - list-style-image: url("folder.svg") !important; -} - -/* history category icon */ -treechildren::-moz-tree-image(query, OrganizerQuery_history____v) { - list-style-image: url("history.svg") !important; -} - -treechildren::-moz-tree-image(title, query, folder) { - list-style-image: url("folder.svg") !important; -} diff --git a/chrome/icons/image-copy.svg b/chrome/icons/image-copy.svg deleted file mode 100644 index 8266f7c..0000000 --- a/chrome/icons/image-copy.svg +++ /dev/null @@ -1,5 +0,0 @@ - - - - - diff --git a/chrome/icons/image-open.svg b/chrome/icons/image-open.svg deleted file mode 100644 index b17d039..0000000 --- a/chrome/icons/image-open.svg +++ /dev/null @@ -1,8 +0,0 @@ - - - - - - - - diff --git a/chrome/icons/image-save.svg b/chrome/icons/image-save.svg deleted file mode 100644 index 4ed3345..0000000 --- a/chrome/icons/image-save.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - diff --git a/chrome/icons/inspect.svg b/chrome/icons/inspect.svg deleted file mode 100755 index 8f29365..0000000 --- a/chrome/icons/inspect.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/chrome/icons/link.svg b/chrome/icons/link.svg deleted file mode 100644 index 4509293..0000000 --- a/chrome/icons/link.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/chrome/icons/manage.svg b/chrome/icons/manage.svg deleted file mode 100644 index 59e1249..0000000 --- a/chrome/icons/manage.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/chrome/icons/media-loop.svg b/chrome/icons/media-loop.svg deleted file mode 100644 index 0ff335c..0000000 --- a/chrome/icons/media-loop.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/chrome/icons/media-mute.svg b/chrome/icons/media-mute.svg deleted file mode 100644 index bfcc81f..0000000 --- a/chrome/icons/media-mute.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/chrome/icons/media-pause.svg b/chrome/icons/media-pause.svg deleted file mode 100644 index 6212a20..0000000 --- a/chrome/icons/media-pause.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/chrome/icons/media-pip.svg b/chrome/icons/media-pip.svg deleted file mode 100644 index a83fb54..0000000 --- a/chrome/icons/media-pip.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/chrome/icons/media-play.svg b/chrome/icons/media-play.svg deleted file mode 100644 index da95f78..0000000 --- a/chrome/icons/media-play.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/chrome/icons/media-speed.svg b/chrome/icons/media-speed.svg deleted file mode 100644 index a7767c7..0000000 --- a/chrome/icons/media-speed.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/chrome/icons/media-unmute.svg b/chrome/icons/media-unmute.svg deleted file mode 100644 index 9a7d4b7..0000000 --- a/chrome/icons/media-unmute.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/chrome/icons/move-tab.svg b/chrome/icons/move-tab.svg deleted file mode 100644 index 9c5d46f..0000000 --- a/chrome/icons/move-tab.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/chrome/icons/paste-and-go.svg b/chrome/icons/paste-and-go.svg deleted file mode 100644 index 119cac8..0000000 --- a/chrome/icons/paste-and-go.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/chrome/icons/pin.svg b/chrome/icons/pin.svg deleted file mode 100644 index fbfc31c..0000000 --- a/chrome/icons/pin.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/chrome/icons/private-window.svg b/chrome/icons/private-window.svg deleted file mode 100644 index 59126a2..0000000 --- a/chrome/icons/private-window.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - diff --git a/chrome/icons/reader-mode.svg b/chrome/icons/reader-mode.svg deleted file mode 100644 index 370fda6..0000000 --- a/chrome/icons/reader-mode.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - diff --git a/chrome/icons/report.svg b/chrome/icons/report.svg deleted file mode 100644 index 7b7517f..0000000 --- a/chrome/icons/report.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/chrome/icons/save.svg b/chrome/icons/save.svg index e3179f3..8e04ec6 100644 --- a/chrome/icons/save.svg +++ b/chrome/icons/save.svg @@ -1,3 +1,3 @@ - + diff --git a/chrome/icons/search-page.svg b/chrome/icons/search-page.svg deleted file mode 100755 index 05c3b53..0000000 --- a/chrome/icons/search-page.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/chrome/icons/send-to-device.svg b/chrome/icons/send-to-device.svg deleted file mode 100644 index 2d77ac2..0000000 --- a/chrome/icons/send-to-device.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/chrome/icons/share.svg b/chrome/icons/share.svg deleted file mode 100644 index 1d135f4..0000000 --- a/chrome/icons/share.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/chrome/icons/source-code.svg b/chrome/icons/source-code.svg deleted file mode 100755 index a65f35d..0000000 --- a/chrome/icons/source-code.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/chrome/icons/tag.svg b/chrome/icons/tag.svg deleted file mode 100644 index 8864d48..0000000 --- a/chrome/icons/tag.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/chrome/icons/translate.svg b/chrome/icons/translate.svg deleted file mode 100644 index 58e8c43..0000000 --- a/chrome/icons/translate.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/chrome/icons/video-open.svg b/chrome/icons/video-open.svg deleted file mode 100644 index 5aba487..0000000 --- a/chrome/icons/video-open.svg +++ /dev/null @@ -1,5 +0,0 @@ - - - - - diff --git a/chrome/icons/video-save.svg b/chrome/icons/video-save.svg deleted file mode 100644 index 9523d94..0000000 --- a/chrome/icons/video-save.svg +++ /dev/null @@ -1,5 +0,0 @@ - - - - - diff --git a/chrome/toolbar/findbar.css b/chrome/toolbar/findbar.css index 482985c..509141f 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, @@ -28,15 +28,3 @@ .findbar-container { overflow-inline: visible !important; } - -.close-icon:not([disabled]):hover, -.findbar-find-previous:not([disabled]):hover, -.findbar-find-next:not([disabled]):hover { - background: var(--toolbarbutton-hover-background, rgb(190 190 190 / .2)) !important; -} - -.close-icon:not([disabled]):hover:active, -.findbar-find-previous:not([disabled]):hover:active, -.findbar-find-next:not([disabled]):hover:active { - background: var(--toolbarbutton-active-background, rgb(190 190 190 / .4)) !important; -} diff --git a/chrome/toolbar/navbar.css b/chrome/toolbar/navbar.css index ef37b6c..8123bda 100644 --- a/chrome/toolbar/navbar.css +++ b/chrome/toolbar/navbar.css @@ -1,9 +1,9 @@ -/* Edge-Frfox - navbar.css */ +/* EdgeFr-Fox by bmFtZQ - navbar.css */ :root { - --toolbarbutton-border-radius: 4px !important; + --toolbarbutton-border-radius: 2px !important; --toolbarbutton-inner-padding: 7px !important; - --uc-toolbarbutton-inner-inline-padding: 10px !important; + --uc-toolbarbutton-inner-inline-padding: 12px !important; --tabs-navbar-shadow-size: 0 !important; } @@ -21,22 +21,16 @@ #reload-button>.toolbarbutton-animatable-box, #stop-button>.toolbarbutton-animatable-box { top: calc(50% - 10px) !important; + margin-inline-start: calc((16px + 2 * var(--uc-toolbarbutton-inner-inline-padding) - 20px) / 2) !important; } #nav-bar-customization-target :where(#reload-button, #stop-button)>.toolbarbutton-icon { padding: var(--toolbarbutton-inner-padding) var(--uc-toolbarbutton-inner-inline-padding) !important; } -@media (-moz-bool-pref: "uc.tweak.rounded-corners") { - #navigator-toolbox { - border-bottom: none !important; - } -} - /* account button */ #navigator-toolbox>toolbar #fxa-toolbar-menu-button, -#navigator-toolbox>toolbar #fxa-toolbar-menu-button>.toolbarbutton-badge-stack, -#fxa-avatar-image { +#navigator-toolbox>toolbar #fxa-toolbar-menu-button>.toolbarbutton-badge-stack { border-radius: 99px !important; } @@ -45,44 +39,58 @@ margin-inline: calc(var(--uc-toolbarbutton-inner-inline-padding) - var(--toolbarbutton-inner-padding)) !important; } -#fxa-toolbar-menu-button { - display: flex !important; - display: -moz-box !important; -} - -#widget-overflow-list>#fxa-toolbar-menu-button #fxa-avatar-image { - scale: 1.25 !important; -} - -#nav-bar-customization-target>#fxa-toolbar-menu-button #fxa-avatar-image { +:root[fxastatus="signedin"] #fxa-avatar-image { scale: 1.5 !important; } +:root[privatebrowsingmode] #fxa-toolbar-menu-button::before { + content: "Private" !important; + display: -moz-box !important; + font-size: 12px !important; +} + +:root[privatebrowsingmode] #fxa-toolbar-menu-button { + background: var(--uc-private-browsing-indicator, var(--lwt-toolbarbutton-icon-fill-attention, var(--toolbarbutton-icon-fill-attention))) !important; + margin: 4px !important; + padding-inline: 8px 0 !important; + color: var(--uc-private-browding-indicator-text, var(--toolbar-bgcolor)) !important; + fill: currentColor !important; +} + +:root[privatebrowsingmode] #fxa-toolbar-menu-button:hover { + background: var(--uc-private-browding-indicator-hover, color-mix(in srgb, var(--lwt-toolbarbutton-icon-fill-attention, var(--toolbarbutton-icon-fill-attention)) 90%, transparent)) !important; +} + +:root[privatebrowsingmode] #fxa-toolbar-menu-button:not([disabled=true]):is([open], [checked], :hover:active) { + background: var(--uc-private-browding-indicator-active, color-mix(in srgb, var(--lwt-toolbarbutton-icon-fill-attention, var(--toolbarbutton-icon-fill-attention)) 70%, transparent)) !important; +} + +:root[privatebrowsingmode] #nav-bar #fxa-toolbar-menu-button>.toolbarbutton-badge-stack { + background: transparent !important; + margin-inline: 0 !important; +} + /* button background transition */ @media not (prefers-reduced-motion) { .toolbarbutton-1>.toolbarbutton-icon, .toolbarbutton-1>.toolbarbutton-text, .toolbarbutton-1>.toolbarbutton-badge-stack, - :not(.panel-subview-body>toolbaritem)>.bookmark-item:not(menu, menuitem), + .bookmark-item, .urlbar-page-action, .identity-box-button, #tracking-protection-icon-container, - panel button, - panel menulist, - .titlebar-button { + #fxa-toolbar-menu-button { transition: background-color 0.25s ease !important; } - .toolbarbutton-1:not([disabled=true]):is([open], [checked], :hover:active)>.toolbarbutton-icon, - .toolbarbutton-1:not([disabled=true]):is([open], [checked], :hover:active)>.toolbarbutton-text, - .toolbarbutton-1:not([disabled=true]):is([open], [checked], :hover:active)>.toolbarbutton-badge-stack, - :not(.panel-subview-body>toolbaritem)>.bookmark-item:not(menu, menuitem):not([disabled=true]):is([open], [checked], :hover:active), - .urlbar-page-action:not([disabled=true]):is([open], [checked], :hover:active), - .identity-box-button:not([disabled=true]):is([open], [checked], :hover:active), - #tracking-protection-icon-container:not([disabled=true]):is([open], [checked], :hover:active), - panel button:not([disabled=true]):is([open], [checked], :hover:active), - panel menulist:not([disabled=true]):is([open], [checked], :hover:active), - .titlebar-button:not([disabled=true]):hover:active { + .toolbarbutton-1:not([disabled=true]):is([open],[checked],:hover:active)>.toolbarbutton-icon, + .toolbarbutton-1:not([disabled=true]):is([open],[checked],:hover:active)>.toolbarbutton-text, + .toolbarbutton-1:not([disabled=true]):is([open],[checked],:hover:active)>.toolbarbutton-badge-stack, + .bookmark-item:not([disabled=true]):is([open],[checked],:hover:active), + .urlbar-page-action:not([disabled=true]):is([open],[checked],:hover:active), + .identity-box-button:not([disabled=true]):is([open],[checked],:hover:active), + #tracking-protection-icon-container:not([disabled=true]):is([open],[checked],:hover:active), + #fxa-toolbar-menu-button:not([disabled=true]):is([open],[checked],:hover:active) { transition-duration: 0s !important; } } diff --git a/chrome/toolbar/personalbar.css b/chrome/toolbar/personalbar.css index 0215c1c..0c13f4c 100644 --- a/chrome/toolbar/personalbar.css +++ b/chrome/toolbar/personalbar.css @@ -1,63 +1,32 @@ -/* Edge-Frfox - personalbar.css */ +/* EdgeFr-Fox by bmFtZQ - personalbar.css */ #PersonalToolbar { --bookmark-block-padding: 6px !important; } -/* Bookmarks bar item sizing */ #personal-toolbar-empty-description, #PersonalToolbar .toolbarbutton-1, toolbarbutton.bookmark-item:not(.subviewbutton) { - margin-block: 2px 4px !important; - padding-block: var(--bookmark-block-padding) !important; - padding-inline: 6px !important; + margin-block: 0 4px !important; + padding: var(--bookmark-block-padding) 6px !important; font-size: 12px !important; - - /* Adjust vertical label position on Windows */ - @media (-moz-platform: windows) { - & .toolbarbutton-text { - margin-block: -1px 0 !important; - } - } } -#PersonalToolbar .toolbarbutton-1 { - padding: 0 !important; +#PlacesToolbarItems>toolbarseparator::before { + content: ""; + display: block; + border-inline-start: 1px solid var(--toolbarseparator-color) !important; + margin-block: 8px !important; + border-image-source: none !important; } -/* Bookmarks bar separators */ -#PlacesToolbarItems > toolbarseparator { - padding-inline: 1px !important; - - &::before { - content: ""; - display: block; - border-inline-start: 1px solid var(--toolbarseparator-color) !important; - margin-block: 8px 10px !important; - border-image-source: none !important; - } -} - -/* Left and Right padding of bookmarks bar */ #PersonalToolbar { - padding-inline: calc(var(--toolbar-start-end-padding) - 2px) calc(var(--toolbar-start-end-padding) + 6px) !important; + padding-inline: var(--toolbar-start-end-padding) calc(var(--toolbar-start-end-padding) + 4px) !important; } -/* Spacing between icon and label for bookmarks bar items */ #managed-bookmarks>.toolbarbutton-icon, #bookmarks-toolbar-placeholder>.toolbarbutton-icon, #PlacesToolbarItems>.bookmark-item>.toolbarbutton-icon[label]:not([label=""]), #OtherBookmarks.bookmark-item[container]>.toolbarbutton-icon { - margin-inline-end: 8px !important; -} - -/* Sizing for bookmarks bar icons */ -#PersonalToolbar .toolbarbutton-1>.toolbarbutton-icon { - width: calc(2 * var(--bookmark-block-padding) + 16px) !important; - height: calc(2 * var(--bookmark-block-padding) + 16px) !important; - padding: var(--bookmark-block-padding) !important; -} - -:root { - --bookmarks-toolbar-overlapping-browser-height: 34px !important; + margin-inline-end: 6px !important; } diff --git a/chrome/toolbar/tabbar.css b/chrome/toolbar/tabbar.css index 9e4a820..b01192e 100644 --- a/chrome/toolbar/tabbar.css +++ b/chrome/toolbar/tabbar.css @@ -1,23 +1,14 @@ -/* Edge-Frfox - tabbar.css */ +/* EdgeFr-Fox 2 - tabbar */ -:root { +:root #titlebar { + --tab-min-height: 32px !important; + --inline-tab-padding: 11px !important; + --tab-border-radius: 4px !important; --tab-block-margin: 8px !important; - - & #titlebar { - --tab-min-height: 32px !important; - --inline-tab-padding: 11px !important; - --tab-border-radius: 4px !important; - - --uc-toolbarbutton-inner-padding: 6px !important; - --toolbarbutton-border-radius: 4px !important; - --toolbarbutton-tabsline-border-radius: 8px !important; - --tabs-navbar-shadow-size: 0 !important; - --tab-shadow-max-size: 0 !important; - } - @media (-moz-bool-pref: "uc.tweak.floating-tabs.equal-margin") and (-moz-bool-pref: "uc.tweak.floating-tabs") { - --tab-block-margin: 5px !important; - } + --uc-toolbarbutton-inner-padding: 6px !important; + --toolbarbutton-border-radius: 2px !important; + --tabs-navbar-shadow-size: 0 !important; } /* tab open/close transition */ @@ -33,13 +24,13 @@ transition: transform 200ms cubic-bezier(0, .75, .25, 1) !important; } -:root:is([inFullscreen], :not([tabsintitlebar])) { +:root:is([inFullscreen], :not([tabsintitlebar])) #titlebar { --tab-block-margin: 0px !important; } /* hide space above tabs when maximised for non-macOS versions of Firefox */ -@media not (-moz-platform: macos) { - :root:is([inFullscreen], :not([tabsintitlebar]), [sizemode="maximized"]), +@supports not -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + :root:is([inFullscreen], :not([tabsintitlebar]), [sizemode="maximized"]) #titlebar, #toolbar-menubar:not([inactive])+#TabsToolbar { --tab-block-margin: 0px !important; } @@ -53,66 +44,55 @@ border: 0 !important; position: relative !important; --uc-tab-corner-bg: transparent; - - /* Rounded bottom corners */ - &::before, - &::after { - content: "" !important; - display: block !important; - position: absolute !important; - width: 8px !important; - height: 8px !important; - bottom: 0 !important; - pointer-events: none !important; - clip-path: inset(0); - } - - &::before { - border-bottom-right-radius: var(--tab-border-radius) !important; - left: 0 !important; - transform: translateX(-8px) !important; - box-shadow: 4px 4px 0 4px var(--uc-tab-corner-bg) !important; - } - - &::after { - border-bottom-left-radius: var(--tab-border-radius) !important; - right: 0 !important; - transform: translateX(8px) !important; - box-shadow: -4px 4px 0 4px var(--uc-tab-corner-bg) !important; - } } -.tabbrowser-tab:where([selected], [multiselected], :hover) + .tabbrowser-tab:not([selected]) .tab-background { +/* rounded bottom corners */ +.tab-background::before, +.tab-background::after { + content: "" !important; + display: block !important; + position: absolute !important; + width: 8px !important; + height: 8px !important; + bottom: 0 !important; + pointer-events: none !important; + clip-path: inset(0); +} + +.tab-background::before { + border-bottom-right-radius: var(--tab-border-radius) !important; + left: 0 !important; + transform: translateX(-8px) !important; + box-shadow: 4px 4px 0 4px var(--uc-tab-corner-bg) !important; +} + +.tab-background::after { border-bottom-left-radius: var(--tab-border-radius) !important; + right: 0 !important; + transform: translateX(8px) !important; + box-shadow: -4px 4px 0 4px var(--uc-tab-corner-bg) !important; +} - &::before { - --uc-tab-corner-bg: transparent !important; - } +.tabbrowser-tab[selected="true"] .tab-background { + --uc-tab-corner-bg: var(--lwt-selected-tab-background-color, var(--toolbar-bgcolor)); } .tab-background:is([selected], [multiselected]) { - --uc-tab-corner-bg: var(--tab-selected-bgcolor, var(--lwt-selected-tab-background-color, var(--toolbar-bgcolor))); + --uc-tab-corner-bg: var(--tab-selected-bgcolor, var(--toolbar-bgcolor)); } -.tabbrowser-tab:hover .tab-background:not([selected], [multiselected]) { - background-color: color-mix(in srgb, currentColor 8%, transparent) !important; - --uc-tab-corner-bg: color-mix(in srgb, currentColor 8%, transparent) !important; +#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)); } -@media not (-moz-bool-pref: "uc.tweak.floating-tabs") { - #Tabstoolbar:not([brighttext]) .tabbrowser-tab:hover .tab-background:not([selected], [multiselected]) { - background-color: color-mix(in srgb, white 30%, transparent) !important; - --uc-tab-corner-bg: color-mix(in srgb, white 30%, transparent) !important; - } +.tabbrowser-tab .tab-background:is([selected], [multiselected]) { + --uc-tab-corner-bg: var(--tab-selected-bgcolor, var(--toolbar-bgcolor)); } -.tab-background:is([selected], [multiselected]) { - outline: none !important; -} - -#tabbrowser-tabs .tab-background[multiselected]:not([selected]) { - box-shadow: none !important; - opacity: 0.7 !important; +.tabbrowser-tab:hover>.tab-stack>.tab-background:not([selected="true"], [multiselected]) { + --uc-tab-corner-bg: color-mix(in srgb, currentColor 11%, transparent) } #tabbrowser-tabs, @@ -124,15 +104,18 @@ margin: 0 !important; } -/* fix window background colours */ -@media not (-moz-gtk-csd-available) { - :root:not(:-moz-lwtheme) #navigator-toolbox { - background-color: var(--lwt-accent-color) !important; - color: var(--lwt-text-color) !important; - } +/* fix colours */ +#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; + } } } @@ -142,7 +125,7 @@ #TabsToolbar .toolbarbutton-animatable-box, #TabsToolbar .toolbarbutton-1 { - fill: currentColor !important; + fill: var(--lwt-text-color) !important; } .tabbrowser-tab[multiselected]:not(:-moz-lwtheme), @@ -150,10 +133,6 @@ color: var(--lwt-tab-text, var(--toolbar-color)) !important; } -.tabbrowser-tab:is([selected], [multiselected]):-moz-lwtheme { - z-index: 1; -} - .tab-close-button { margin-inline-end: 8px !important; width: 17px !important; @@ -174,91 +153,37 @@ display: none !important; } -#tabbrowser-tabs:not([secondarytext-unsupported]) .tab-label-container { - height: var(--tab-min-height) !important; -} - .tab-icon-stack:is([soundplaying], [muted], [activemedia-blocked])>.tab-icon-overlay, .tabbrowser-tab:hover .tab-icon-stack:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked])> :not(.tab-icon-overlay) { opacity: 1 !important; } -#tabbrowser-tabs:not([closebuttons="activetab"]) .tab-icon-overlay:not([pinned]) { +.tab-icon-overlay:not([pinned]) { margin-inline: 22px 6px !important; } -.tabbrowser-tab:not([image]) .tab-icon-overlay:not([pinned]) { - margin-inline: 0px 6px !important; -} - -/* move sound playing icon on top of favicon when there isn't enough space */ -.tab-icon-overlay:not([crashed]):is([pinned], [sharing]), -#tabbrowser-tabs[closebuttons="activetab"] .tab-icon-overlay:not([crashed]) { - top: -5.5px !important; - inset-inline-end: -6px !important; -} - -#tabbrowser-tabs[closebuttons="activetab"] :is(.tab-icon-overlay[soundplaying]:not([crashed]), - .tab-icon-overlay[muted]:not([crashed]), - .tab-icon-overlay[activemedia-blocked]:not([crashed])) { - stroke: var(--tab-icon-overlay-stroke, white) !important; - color: var(--tab-icon-overlay-fill, black) !important; - fill-opacity: 1 !important; -} - -#TabsToolbar[brighttext] #tabbrowser-tabs[closebuttons="activetab"] :is(.tab-icon-overlay[soundplaying]:not([crashed]), - .tab-icon-overlay[muted]:not([crashed]), - .tab-icon-overlay[activemedia-blocked]:not([crashed])) { - stroke: var(--tab-icon-overlay-stroke, black) !important; - color: var(--tab-icon-overlay-fill, white) !important; -} - -#tabbrowser-tabs[closebuttons="activetab"] :is(.tab-icon-overlay:not([crashed])[soundplaying]:hover, - .tab-icon-overlay:not([crashed])[muted]:hover, - .tab-icon-overlay:not([crashed])[activemedia-blocked]:hover) { - background-color: var(--tab-icon-overlay-stroke, white) !important; -} - -#TabsToolbar[brighttext] #tabbrowser-tabs[closebuttons="activetab"] :is(.tab-icon-overlay:not([crashed])[soundplaying]:hover, - .tab-icon-overlay:not([crashed])[muted]:hover, - .tab-icon-overlay:not([crashed])[activemedia-blocked]:hover) { - background-color: var(--tab-icon-overlay-stroke, black) !important; -} - .tab-icon-overlay[soundplaying]:not([crashed]), .tab-icon-overlay[muted]:not([crashed]), .tab-icon-overlay[activemedia-blocked]:not([crashed]) { - border-radius: 4px !important; + border-radius: 2px !important; padding: 0 !important; } .tabbrowser-tab { font-size: 12px !important; padding-inline: 0 !important; - overflow-clip-margin: 8px !important; + overflow-clip-margin: 4px !important; } #TabsToolbar .toolbarbutton-1>.toolbarbutton-icon, #TabsToolbar .toolbarbutton-1>.toolbarbutton-badge-stack { border-radius: var(--toolbarbutton-border-radius) !important; - padding: var(--uc-toolbarbutton-inner-padding) calc(var(--uc-toolbarbutton-inner-padding) + 2px) !important; -} - -#tabbrowser-tabs .toolbarbutton-1>.toolbarbutton-icon, -#tabbrowser-tabs .toolbarbutton-1>.toolbarbutton-badge-stack { - border-radius: var(--toolbarbutton-tabsline-border-radius) !important; + padding: var(--uc-toolbarbutton-inner-padding) !important; } #TabsToolbar .toolbarbutton-1>.toolbarbutton-icon { - width: calc(2 * (var(--uc-toolbarbutton-inner-padding) + 2px) + 16px) !important; - height: calc(2 * var(--uc-toolbarbutton-inner-padding) + 16px) !important; -} - -#TabsToolbar #tabs-newtab-button>.toolbarbutton-icon, -#TabsToolbar #alltabs-button>.toolbarbutton-badge-stack, -#TabsToolbar #tabbrowser-tabs[hasadjacentnewtabbutton][overflow="true"]~#new-tab-button>.toolbarbutton-icon { - padding: var(--uc-toolbarbutton-inner-padding) !important; width: calc(2 * var(--uc-toolbarbutton-inner-padding) + 16px) !important; + height: calc(2 * var(--uc-toolbarbutton-inner-padding) + 16px) !important; } #tabbrowser-tabs #tabs-newtab-button { @@ -269,19 +194,17 @@ padding: 0 12px !important; } -/* Tab container indicator */ -.tabbrowser-tab[usercontextid] .tab-background .tab-context-line { - height: 2px !important; - border-radius: 2px !important; - margin: 2px 7px 0 !important; -} - -.tabbrowser-tab[selected][usercontextid] .tab-background .tab-context-line { - margin-inline: 9px !important; +.tabbrowser-tab[usercontextid]>.tab-stack>.tab-background>.tab-context-line { + height: 8px !important; + clip-path: inset(0 0 6px) !important; + border-radius: var(--tab-border-radius) !important; + border-bottom-left-radius: 0 !important; + border-bottom-right-radius: 0 !important; + margin: 0 !important; } .titlebar-spacer[type="post-tabs"] { - display: flex !important; + display: -moz-box !important; } .titlebar-spacer[type="pre-tabs"], @@ -300,48 +223,20 @@ toolbarbutton[part="scrollbutton-down"] { max-width: 240px !important; } -/* Tab separators */ -.tabbrowser-tab .tab-stack { - &::before, - &::after { - content: ""; - position: absolute; - height: 20px; - inset: 0 auto; - margin-block: auto; - border-left: 1px solid transparent; - } - - &::before { - left: 0; - } - - &::after { - right: 0; - } -} - -/* Set separator color */ -.tabbrowser-tab:not([selected], [multiselected], :hover) { - & .tab-stack::before, - &:last-of-type .tab-stack::after { - border-color: color-mix(in srgb, currentColor 34%, transparent); - } -} - -/* Hide separator when previous sibling is hovered or selected */ -.tabbrowser-tab:where([selected], [multiselected], :hover) + .tabbrowser-tab:not([selected], [multiselected], :hover) .tab-stack::before { - border-color: transparent !important; -} - -/* Hide first tab separator if there are no buttons before it (Such as Firefox View) */ -#TabsToolbar-customization-target > #tabbrowser-tabs:not(toolbarbutton:not(#fxa-toolbar-menu-button) + #tabbrowser-tabs) .tabbrowser-tab:first-of-type .tab-stack::before { - border-color: transparent !important; -} - -/* .tabbrowser-tab:not([last-visible-tab="true"]) { +/* tab separators */ +.tabbrowser-tab:not([last-visible-tab="true"]) { margin-inline-end: -1px !important; -} */ +} + +.tabbrowser-tab:not([selected="true"], :hover, [beforeselected-visible], [beforehovered]) .tab-stack::after { + content: ""; + position: absolute; + display: block; + height: 20px; + right: 0; + top: 6px; + border-right: 1px solid color-mix(in srgb, currentColor 34%, transparent); +} #tabbrowser-tabs[haspinnedtabs]:not([positionpinnedtabs])>#tabbrowser-arrowscrollbox>.tabbrowser-tab[first-visible-unpinned-tab] { margin-inline-start: 0 !important; @@ -355,14 +250,25 @@ toolbarbutton[part="scrollbutton-down"] { } /* mac titlebar buttons */ -@media (-moz-platform: macos) { - .titlebar-buttonbox { - margin-inline: calc((var(--tab-min-height) + var(--tab-block-margin) - 14px) / 2) !important; +@supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + @media (-moz-mac-big-sur-theme:0) { + .titlebar-buttonbox { + margin-inline: 10px !important; + } + + .titlebar-buttonbox-container { + margin-inline-end: -8px !important; + } } - .titlebar-buttonbox-container { - margin-inline-start: -6px !important; - margin-inline-end: -2px !important; + @media (-moz-mac-big-sur-theme:1) { + .titlebar-buttonbox { + margin-inline: calc((var(--tab-min-height) + var(--tab-block-margin) - 14px) / 2) !important; + } + + .titlebar-buttonbox-container { + margin-inline-end: -8px !important; + } } } @@ -383,135 +289,35 @@ toolbarbutton[part="scrollbutton-down"] { margin-top: calc(2px + var(--tab-block-margin)) !important; } -/* add margin to tabs if they are the first or last tab */ -#tabbrowser-arrowscrollbox:not([overflowing]) .tabbrowser-tab { - &:first-of-type { - margin-inline-start: 14px !important; - } - - &:last-of-type { - margin-inline-end: 6px !important; - } -} - -/* remove gap between pinned and unpinned tabs */ -#tabbrowser-tabs[haspinnedtabs]:not([positionpinnedtabs]) > #tabbrowser-arrowscrollbox > .tabbrowser-tab:nth-child(1 of :not([pinned], [hidden])) { - margin-inline-start: 0 !important; -} - -#tabbrowser-tabs { - margin-inline-start: -6px !important; - border-inline: none !important; -} - -#TabsToolbar { - padding-inline-start: 6px !important; -} - -#tabbrowser-tabs[positionpinnedtabs]>#tabbrowser-arrowscrollbox { +#tabbrowser-tabs:not([overflow="true"]) .tabbrowser-tab[first-visible-tab] { margin-inline-start: 8px !important; } -#tabbrowser-tabs[positionpinnedtabs]>#tabbrowser-arrowscrollbox>.tabbrowser-tab[pinned] { - clip-path: inset(-8px -8px 0) !important; +#tabbrowser-tabs[overflow] .tabbrowser-tab[last-visible-tab]:not([pinned]) { + margin-inline-end: 8px !important; } -:root { - --uc-titlebar-shadow: 0 -3px 2px -3px rgb(0 0 0 / .2) inset; - --uc-tab-shadow: - 0 0 0 1px var(--lwt-tab-line-color, var(--lwt-tabs-border-color, transparent)), - 0px 2px 4px rgb(0 0 0 / .2), 0 4px 8px rgb(0 0 0 / .1); -} -:root[lwtheme-brighttext="true"] { - --uc-titlebar-shadow: 0 -3px 2px -3px rgb(0 0 0 / .75) inset inset; - --uc-tab-shadow: - 0 0 0 1px var(--lwt-tab-line-color, var(--lwt-tabs-border-color, transparent)), - 0 2px 4px rgb(0 0 0 / .45), 0 0px 2px rgb(0 0 0 / .2); -} - -#tabbrowser-tabs .tab-background:is([selected], [multiselected]), -#TabsToolbar #firefox-view-button[open] > .toolbarbutton-icon { - box-shadow: var(--uc-tab-shadow) !important; +.tabbrowser-tab:is([visuallyselected="true"], [multiselected])>.tab-stack>.tab-background { + box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3), 0 0px 2px rgba(0, 0, 0, 0.2) !important; } #titlebar { - box-shadow: var(--uc-titlebar-shadow) !important; + box-shadow: 0 -3px 2px -3px rgba(0, 0, 0, 0.2) inset !important; } -#tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab .tab-label-container { - --tab-label-mask-size: 1em !important; +:root[lwtheme-brighttext="true"] .tabbrowser-tab:is([visuallyselected="true"], [multiselected])>.tab-stack>.tab-background { + box-shadow: 0 2px 4px rgba(0, 0, 0, 0.45), 0 0px 2px rgba(0, 0, 0, 0.2) !important; } -#tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:not([pinned]) .tab-content { - padding-inline: calc(var(--inline-tab-padding) - 4px) 0 !important; +:root[lwtheme-brighttext="true"] #titlebar { + box-shadow: 0 -3px 2px -3px rgba(0, 0, 0, 0.75) inset !important; +} + +#tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab[selected="true"] .tab-label-container { + --tab-label-mask-size: 0.5em !important; } .tab-content { padding-inline: var(--inline-tab-padding) 0 !important; } - -/* new private browsing indicator */ -:root[privatebrowsingmode="temporary"] #TabsToolbar .toolbar-items, -:root[privatebrowsingmode="temporary"] #TabsToolbar .titlebar-buttonbox-container { - position: relative; - z-index: 1; -} - -:root[privatebrowsingmode="temporary"] .titlebar-spacer[type="post-tabs"] { - display: none !important; -} - -#private-browsing-indicator-with-label { - position: relative !important; - isolation: isolate; - margin-inline: -16px -16px !important; - padding-inline: 32px 24px !important; - font-size: 12px; - color: var(--uc-private-browsing-indicator-text, var(--toolbar-bgcolor)) !important; - --uc-bg-color: var(--uc-private-browsing-indicator, var(--lwt-toolbarbutton-icon-fill-attention, var(--toolbarbutton-icon-fill-attention))); - --uc-gradient: linear-gradient(to right, transparent, var(--uc-bg-color) 35%); - --uc-gradient-alt: linear-gradient(to right, transparent, var(--uc-bg-color) 25%, var(--uc-bg-color) 75%, transparent); - background: var(--uc-gradient); -} - -@media (-moz-gtk-csd-available) { - :root[privatebrowsingmode] #fxa-toolbar-menu-button:not(:-moz-lwtheme) { - --uc-bg-color: -moz-accent-color !important; - color: -moz-accent-color-foreground !important; - } -} - -@media (-moz-platform: windows), -(-moz-gtk-csd-available) { - @media not (-moz-gtk-csd-reversed-placement) { - :root[tabsintitlebar] #toolbar-menubar:not([autohide="false"])~#TabsToolbar #private-browsing-indicator-with-label { - background: var(--uc-gradient-alt); - } - } -} - -#private-browsing-indicator-with-label .private-browsing-indicator-icon { - height: 24px !important; - width: 24px !important; -} - -:root, -:root[lang^="en"] { - --uc-string-private: "Private"; -} - -/* Change "Private Browsing" text to "Private" (English locale only) */ -:root:is([lang^="en"]) #private-browsing-indicator-with-label>label { - display: none !important; -} - -:root:is([lang^="en"]) #private-browsing-indicator-with-label::after { - content: var(--uc-string-private); - margin-block: 1px 2px; - margin-inline: 6px 5px; -} - -#tabbrowser-tabs[secondarytext-unsupported] .tab-icon-stack[indicator-replaces-favicon] > :not(.tab-icon-overlay) { - opacity: 1 !important; -} diff --git a/chrome/toolbar/urlbar.css b/chrome/toolbar/urlbar.css index d9871fc..b15994f 100644 --- a/chrome/toolbar/urlbar.css +++ b/chrome/toolbar/urlbar.css @@ -1,25 +1,21 @@ -/* Edge-Frfox - urlbar.css */ +/* EdgeFr-Fox by bmFtZQ - urlbar.css */ :root { - --urlbar-min-height: 30px !important; + --urlbar-min-height: 28px !important; --urlbarView-item-inline-padding: 14px !important; - --urlbar-icon-border-radius: calc(var(--toolbarbutton-border-radius) + 2px) !important; + --urlbar-icon-border-radius: var(--toolbarbutton-border-radius) !important; --urlbar-icon-padding: calc(var(--toolbarbutton-inner-padding) - 2px) !important; --uc-urlbar-icon-inline-padding: calc(var(--uc-toolbarbutton-inner-inline-padding) - 2px) !important; --identity-box-margin-inline: 2px !important; } -:root[style*="--lwt-accent-color: rgb(240, 240, 244)"] #urlbar[focused="true"]:not([suppress-focus-border])>#urlbar-background, -:root[style*="--lwt-accent-color: rgb(240, 240, 244)"] #searchbar:focus-within { - outline-color: color-mix(in srgb, var(--toolbar-field-focus-border-color) 50%, transparent) !important; +:root:not(:-moz-lwtheme) #urlbar { + --urlbar-box-bgcolor: unset !important; } -@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; - } +#urlbar[focused="true"]:not([suppress-focus-border])>#urlbar-background:not(:-moz-lwtheme), +#searchbar:not(:-moz-lwtheme):focus-within { + outline-color: color-mix(in srgb, var(--toolbar-field-focus-border-color) 50%, transparent) !important; } :root:not([lwtheme-brighttext="true"]) #urlbar-background { @@ -109,31 +105,24 @@ width: unset !important; } -#identity-icon-box, -#identity-permission-box, -.notification-anchor-icon { +#identity-icon-box { + padding-inline: var(--uc-urlbar-icon-inline-padding) !important; +} + +#identity-permission-box { padding-inline: var(--uc-urlbar-icon-inline-padding) !important; } #urlbar-background, #searchbar { - border-radius: var(--urlbar-icon-border-radius) !important; + border-radius: calc(var(--toolbarbutton-border-radius) + 2px) !important; } -#urlbar:hover:not([suppress-focus-border])>#urlbar-background, -#searchbar:hover { - outline: 1.5px solid var(--urlbar-hover-highlight-color); -} /* move tracking protection button */ #tracking-protection-icon-container, #page-action-buttons { -moz-box-ordinal-group: 2 !important; - order: 2 !important; -} - -#urlbar, #searchbar { - padding: 0 4px !important; } #urlbar-container:not(:hover) #tracking-protection-icon-container:not([open]) { @@ -150,9 +139,9 @@ #urlbar-container { min-width: 206px !important; } - + #nav-bar-customization-target:not(:hover) #downloads-button:not([open]) { - visibility: collapse !important; + visibility: collapse !important; } } @@ -169,79 +158,8 @@ fill: var(--toolbar-field-color) !important; } -#userContext-icons, -#urlbar-zoom-button { +#userContext-icons, #urlbar-zoom-button { padding-inline: var(--uc-urlbar-icon-inline-padding) !important; margin-block: 0 !important; margin-inline: 0 !important; } - -/* make urlbar icons opaque in default theme */ -#urlbar-input::placeholder, -.searchbar-textbox::placeholder { - opacity: 0.6 !important; -} - -:is(:root:not(:-moz-lwtheme), :root[style*="--lwt-accent-color: rgb(240, 240, 244)"]) #identity-icon-label { - opacity: var(--urlbar-icon-fill-opacity) !important; -} - -#notification-popup-box:hover { - background-color: var(--urlbar-box-hover-bgcolor) !important; -} - -#notification-popup-box:hover:active, -#notification-popup-box[open] { - background-color: var(--urlbar-box-active-bgcolor) !important; -} - -/* remove background from urlbar box */ -#identity-box[pageproxystate="valid"].notSecureText>.identity-box-button:not(:hover, [open]), -#identity-box[pageproxystate="valid"].chromeUI>.identity-box-button:not(:hover, [open]), -#identity-box[pageproxystate="valid"].extensionPage>.identity-box-button:not(:hover, [open]) { - background-color: transparent !important; -} - -:is(:root:not(:-moz-lwtheme), - :root[style*="--lwt-accent-color: rgb(240, 240, 244)"] #urlbar[focused="true"], - :root[lwt-default-theme-in-dark-mode="true"], - :root[style*="--lwt-accent-color: rgb(28, 27, 34)"]) #urlbar-search-mode-indicator { - background-color: var(--urlbar-box-hover-bgcolor) !important; -} - -/* increase space between icon and text */ -#identity-icon-label { - padding-inline-start: 8px !important; -} - -/* separator for urlbar box */ -#identity-box { - position: relative; -} - -:is(#identity-box[pageproxystate="valid"].notSecureText>.identity-box-button, - #identity-box[pageproxystate="valid"].chromeUI>.identity-box-button, - #identity-box[pageproxystate="valid"].extensionPage>.identity-box-button)::after { - content: ""; - position: absolute; - display: block; - height: 16px; - border-right: 1px solid currentColor; - right: 0; - top: calc((var(--urlbar-height) / 2 - 1px - var(--urlbar-container-padding)) - 8px); - opacity: 0; -} - -@media not (prefers-reduced-motion) { - :is(#identity-box[pageproxystate="valid"].notSecureText>.identity-box-button, - #identity-box[pageproxystate="valid"].chromeUI>.identity-box-button, - #identity-box[pageproxystate="valid"].extensionPage>.identity-box-button)::after { - transition: opacity 0.2s ease; - } -} - -:is(#identity-box[pageproxystate="valid"].notSecureText>.identity-box-button:not(:hover, [open]), - #identity-box[pageproxystate="valid"].chromeUI>.identity-box-button:not(:hover, [open]), - #identity-box[pageproxystate="valid"].extensionPage>.identity-box-button:not(:hover, [open]))::after { - opacity: 0.375; -} diff --git a/chrome/userChrome.css b/chrome/userChrome.css index a43d558..1053b75 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"); @@ -8,8 +8,3 @@ @import url("global/colors.css"); @import url("global/popup.css"); @import url("global/tweaks.css"); -@import url("global/browser.css"); -@import url("global/tree.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..1f835b8 100644 --- a/chrome/userContent.css +++ b/chrome/userContent.css @@ -1,3 +1,3 @@ -/* Edge-Frfox */ -@import url("content/common.css"); -@import url("content/newtab.css"); +/* EdgeFr-Fox by bmFtZQ */ +@import url(content/common.css); +@import url(content/newtab.css); diff --git a/screenshots/dark-mica-floating-tabs.png b/screenshots/dark-mica-floating-tabs.png new file mode 100644 index 0000000..bd47f05 Binary files /dev/null and b/screenshots/dark-mica-floating-tabs.png differ diff --git a/screenshots/dark-mica.png b/screenshots/dark-mica.png new file mode 100644 index 0000000..d64f80a Binary files /dev/null and b/screenshots/dark-mica.png differ diff --git a/screenshots/force-tab-colour.svg b/screenshots/force-tab-colour.svg deleted file mode 100644 index 440b26d..0000000 --- a/screenshots/force-tab-colour.svg +++ /dev/null @@ -1,35 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/screenshots/gtk-dark.png b/screenshots/gtk-dark.png deleted file mode 100644 index ae69701..0000000 Binary files a/screenshots/gtk-dark.png and /dev/null differ diff --git a/screenshots/gtk-light.png b/screenshots/gtk-light.png deleted file mode 100644 index fb76432..0000000 Binary files a/screenshots/gtk-light.png and /dev/null differ diff --git a/screenshots/light-mica-floating-tabs.png b/screenshots/light-mica-floating-tabs.png new file mode 100644 index 0000000..594a44c Binary files /dev/null and b/screenshots/light-mica-floating-tabs.png differ diff --git a/screenshots/light-mica.png b/screenshots/light-mica.png new file mode 100644 index 0000000..2deca54 Binary files /dev/null and b/screenshots/light-mica.png differ