From 9fd66c5cbb2f552b3ae17ac65470d094ec06ddd1 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andr=C3=A9=20Fernandes?= Date: Tue, 24 Sep 2024 19:55:23 +0100 Subject: [PATCH 1/4] Fixed typo --- tweaks.sh | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/tweaks.sh b/tweaks.sh index d252f326..ae4e5341 100755 --- a/tweaks.sh +++ b/tweaks.sh @@ -161,7 +161,7 @@ while [[ $# -gt 0 ]]; do shift ;; alt) window="alt" - prompt -i "Alt windnows button version...\n" + prompt -i "Alt windows button version...\n" shift ;; adaptive) adaptive="-adaptive" From 3589f39ea7a6c65463f036059041f145eeed3e53 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andr=C3=A9=20Fernandes?= Date: Sun, 29 Sep 2024 01:56:04 +0100 Subject: [PATCH 2/4] Added darker Firefox theme option Closes #983 --- shell/lib-install.sh | 6 +- src/other/firefox/Monterey/colors/darker.css | 171 +++++++++++++++++ .../firefox/Monterey/theme-alt-darker.css | 36 ++++ src/other/firefox/Monterey/theme-darker.css | 36 ++++ src/other/firefox/WhiteSur/colors/darker.css | 172 ++++++++++++++++++ src/other/firefox/WhiteSur/parts/tabsbar.css | 1 + src/other/firefox/WhiteSur/theme-darker.css | 36 ++++ .../userChrome-Monterey-alt-darker.css | 42 +++++ .../firefox/userChrome-Monterey-darker.css | 58 ++++++ .../firefox/userChrome-WhiteSur-darker.css | 42 +++++ .../firefox/userContent-Monterey-darker.css | 7 + .../firefox/userContent-WhiteSur-darker.css | 7 + tweaks.sh | 18 +- 13 files changed, 626 insertions(+), 6 deletions(-) create mode 100644 src/other/firefox/Monterey/colors/darker.css create mode 100644 src/other/firefox/Monterey/theme-alt-darker.css create mode 100644 src/other/firefox/Monterey/theme-darker.css create mode 100644 src/other/firefox/WhiteSur/colors/darker.css create mode 100644 src/other/firefox/WhiteSur/theme-darker.css create mode 100644 src/other/firefox/userChrome-Monterey-alt-darker.css create mode 100644 src/other/firefox/userChrome-Monterey-darker.css create mode 100644 src/other/firefox/userChrome-WhiteSur-darker.css create mode 100644 src/other/firefox/userContent-Monterey-darker.css create mode 100644 src/other/firefox/userContent-WhiteSur-darker.css diff --git a/shell/lib-install.sh b/shell/lib-install.sh index 09c146f2..952516a1 100755 --- a/shell/lib-install.sh +++ b/shell/lib-install.sh @@ -688,12 +688,12 @@ install_firefox_theme() { cp -rf "${FIREFOX_SRC_DIR}"/common/*.css "${TARGET_DIR}/${theme_name}" cp -rf "${FIREFOX_SRC_DIR}"/common/parts/*.css "${TARGET_DIR}/${theme_name}"/parts [[ -f "${TARGET_DIR}"/userChrome.css ]] && mv "${TARGET_DIR}"/userChrome.css "${TARGET_DIR}"/userChrome.css.bak - cp -rf "${FIREFOX_SRC_DIR}"/userChrome-"${theme_name}${adaptive}".css "${TARGET_DIR}"/userChrome.css + cp -rf "${FIREFOX_SRC_DIR}"/userChrome-"${theme_name}${darker}${adaptive}".css "${TARGET_DIR}"/userChrome.css [[ -f "${TARGET_DIR}"/userContent.css ]] && mv "${TARGET_DIR}"/userContent.css "${TARGET_DIR}"/userContent.css.bak - cp -rf "${FIREFOX_SRC_DIR}"/userContent-"${theme_name}${adaptive}".css "${TARGET_DIR}"/userContent.css + cp -rf "${FIREFOX_SRC_DIR}"/userContent-"${theme_name}${darker}${adaptive}".css "${TARGET_DIR}"/userContent.css if [[ "${firefoxtheme}" == 'Flat' && "${theme_name}" == 'Monterey' ]]; then - cp -rf "${FIREFOX_SRC_DIR}"/userChrome-Monterey-alt"${adaptive}".css "${TARGET_DIR}"/userChrome.css + cp -rf "${FIREFOX_SRC_DIR}"/userChrome-Monterey-alt"${darker}${adaptive}".css "${TARGET_DIR}"/userChrome.css cp -rf "${FIREFOX_SRC_DIR}"/WhiteSur/parts/headerbar-urlbar.css "${TARGET_DIR}"/Monterey/parts/headerbar-urlbar-alt.css fi diff --git a/src/other/firefox/Monterey/colors/darker.css b/src/other/firefox/Monterey/colors/darker.css new file mode 100644 index 00000000..6aee5e72 --- /dev/null +++ b/src/other/firefox/Monterey/colors/darker.css @@ -0,0 +1,171 @@ +@namespace xul url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); + +/* Variables that start with --gnome- are added by me and are assigned + * to elements somewhere in this code. The rest of the variables are + * built-in in Firefox, so you need to add an !important if you wanna + * override them. */ + +@media (prefers-color-scheme: dark) { + :root { + /* Browser area before a page starts loading */ + --gnome-browser-before-load-background: #1f1f1f; + --gnome-browser-content-box-background: #323232; + --theme-primary-color: #315bef; + --theme-primary-hover-color: #5073f1; + --theme-primary-active-color: #6584f3; + + /* Toolbars */ + --gnome-toolbar-background: #1e1e1e; + --gnome-tabstoolbar-background: #1e1e1e; + --gnome-findbar-background: #282828; + --gnome-toolbar-color: #ffffff; + --gnome-toolbar-icon-fill: #ffffff; + --gnome-toolbar-border-color: #070707; + --gnome-inactive-toolbar-color: rgba(255, 255, 255, 0.35); + --gnome-inactive-toolbar-background: #1e1e1e; + --gnome-inactive-toolbar-border-color: #121212; + + /* Sidebar */ + --gnome-sidebar-background: #1e1e1e; + --gnome-inactive-sidebar-background: #3f3f3f; + --gnome-sidebar-border-color: color-mix(in srgb, #ffffff 12%, var(--gnome-sidebar-background)); + + /* Popups */ + --gnome-menu-background: rgba(40, 40, 40, 0.95); + --gnome-menu-border-color: rgba(0, 0, 0, 0.75); + --gnome-popover-background: rgba(40, 40, 40, 0.95); + --gnome-popover-border-color: rgba(0, 0, 0, 0.75); + --gnome-popover-shadow: 0 5px 8px rgba(0, 0, 0, 0.3); + --gnome-popover-button-hover-background: rgba(255, 255, 255, 0.1); + --gnome-popover-button-active-background: rgba(255, 255, 255, 0.15); + --gnome-popover-separator-color: rgba(255, 255, 255, 0.08); + + /* Header bar */ + --gnome-headerbar-background: #1e1e1e; + --gnome-headerbar-border-color: #070707; + --gnome-headerbar-box-shadow: inset 0 1px rgba(255, 255, 255, 0.15); + --gnome-inactive-headerbar-background: #1e1e1e; + --gnome-inactive-headerbar-border-color: #202020; + --gnome-inactive-headerbar-box-shadow: inset 0 1px rgba(255, 255, 255, 0.08); + + /* Buttons */ + --gnome-button-background: #2a2a2a; + --gnome-button-border-color: #282828; + --gnome-button-border-bottom-color: #282828; + --gnome-button-box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); + --gnome-button-hover-color: rgba(255, 255, 255, 0.1); + --gnome-button-active-color: rgba(255, 255, 255, 0.2); + --gnome-button-hover-background: linear-gradient(to top, #242424 0%, #282828 100%); + --gnome-button-active-background: #282828; + --gnome-button-active-border-color: #1b1b1b; + --gnome-button-active-border-bottom-color: #1b1b1b; + --gnome-button-active-box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); + --gnome-button-disabled-background: linear-gradient(to top, #242424 0%, #494949 100%); + --gnome-button-disabled-border-color: #282828; + --gnome-button-disabled-box-shadow: inset 0 1px rgba(255, 255, 255, 0.03); + --gnome-inactive-button-background: #2a2a2a; + --gnome-inactive-button-border-color: #282828; + --gnome-inactive-button-box-shadow: inset 0 1px rgba(255, 255, 255, 0.0); + --gnome-button-suggested-action-background: linear-gradient(to top, #155099 2px, #15539e); + --gnome-button-suggested-action-border-color: rgba(0, 0, 0, 0.2); + --gnome-button-suggested-action-border-bottom-color: rgba(0, 0, 0, 0.3); + --gnome-button-suggested-action-box-shadow: inset 0 1px rgba(255, 255, 255, 0.08); + --gnome-button-suggested-action-hover-background: linear-gradient(to top, #155099, #1655a2 1px); + --gnome-button-suggested-action-active-background: linear-gradient(to top, #103e75, #103e75 1px); + --gnome-button-suggested-action-active-border-color: rgba(0, 0, 0, 0.3); + --gnome-button-suggested-action-active-box-shadow: inset 0 1px rgba(255, 255, 255, 0.05); + --gnome-button-destructive-action-background: linear-gradient(to top, #ae151c 2px, #b2161d); + --gnome-button-destructive-action-border-color: rgba(0, 0, 0, 0.2); + --gnome-button-destructive-action-border-bottom-color: rgba(0, 0, 0, 0.3); + --gnome-button-destructive-action-box-shadow: inset 0 1px rgba(255, 255, 255, 0.02), 0 1px 2px rgba(0, 0, 0, 0.07); + --gnome-button-destructive-action-hover-background: linear-gradient(to top, #ae151c, #b7161d 1px); + --gnome-button-destructive-action-active-background: linear-gradient(to top, #8a1116, #8a1116 1px); + --gnome-button-destructive-action-active-border-color: rgba(0, 0, 0, 0.3); + --gnome-button-destructive-action-active-box-shadow: inset 0 1px rgba(255, 255, 255, 0); + + --gnome-headerbar-button-combined-background: rgba(255, 255, 255, 0.05); + --gnome-headerbar-button-hover-background: rgba(255, 255, 255, 0.1); + --gnome-headerbar-button-active-background: rgba(255, 255, 255, 0.15); + + /* URL bar */ + --gnome-urlbar-background: #2a2a2a; + --gnome-urlbar-border-color: #282828; + --gnome-urlbar-box-shadow: 0 3px 6px 1px rgba(0,0,0, .2), 0 5px 16px 3px rgba(0,0,0, .15), 0 0 0 1px rgba(0, 0, 0, 0.75); + --gnome-urlbar-color: #ffffff; + --gnome-hover-urlbar-border-color: #585858; + --gnome-inactive-urlbar-background: #2a2a2a; + --gnome-inactive-urlbar-border-color: #282828; + --gnome-inactive-urlbar-box-shadow: none; + --gnome-inactive-urlbar-color: #d6d6d6; + --gnome-focused-urlbar-border-color: #338CBE; + --gnome-focused-urlbar-highlight-color: #006EA0; + --gnome-private-urlbar-background: #25003e; + + /* Tabs */ + --gnome-tabbar-tab-background: rgba(42, 42, 42, .25); + --gnome-tabbar-tab-color: rgb(141, 144, 145); + --gnome-tabbar-tab-hover-background: #282828; + --gnome-tabbar-tab-hover-border-bottom-color: #1b1b1b; + --gnome-tabbar-tab-hover-color: rgb(200, 200, 200); + --gnome-tabbar-tab-active-background: #2a2a2a; + --gnome-tabbar-tab-active-border-bottom-color: #15539e; + --gnome-tabbar-tab-active-color: #ffffff; + --gnome-tabbar-tab-active-hover-background: #525252; + --gnome-inactive-tabbar-tab-color: rgb(141, 144, 145); + --gnome-inactive-tabbar-tab-background: var(--gnome-tabbar-tab-background); + --gnome-inactive-tabbar-tab-active-background: rgb(50, 50, 50); + --gnome-inactive-tabbar-tab-active-border-bottom-color: var(--gnome-tabbar-tab-active-border-bottom-color); + --gnome-inactive-tabbar-tab-active-color: var(--gnome-inactive-tabbar-tab-color); + --gnome-tab-attention-icon-color: #718be8; + + /* Switch */ + --gnome-switch-background: #464646; + --gnome-switch-hover-background: #525252; + --gnome-switch-active-background: #606060; + --gnome-switch-border-color: transparent; + --gnome-switch-slider-background: #ffffff; + --gnome-switch-slider-border-color: transparent; + --gnome-switch-slider-box-shadow: inset 0 1px rgba(255, 255, 255, 0.02), 0 1px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.07); + --gnome-switch-pressed-background: #315bef; + --gnome-switch-pressed-hover-background: #5073f1; + --gnome-switch-pressed-active-background: #6584f3; + --gnome-switch-active-border-color: transparent; + --gnome-switch-active-slider-border-color: transparent; + + /* Dirty hacks for replaced symbolic icons, they load from + * /usr/share/icons// and on some systems they need to be + * inverted, on others they don't, adjusts the filters below to your + * needs (you may also adjust icon brightness here). */ + --gnome-convert-icon-to-symbolic-hack-filter: invert(100%) sepia(100%) grayscale(100%) brightness(200%) brightness(85%); + --gnome-icons-hack-filter: invert(100%) sepia(100%) grayscale(100%) brightness(200%) brightness(200%); /* without invert: none */ + --gnome-window-icons-hack-filter: invert(90%); /* without invert: none */ + + /* Private window colors */ + --gnome-private-accent: #78aeed; + + /* Toolbars */ + --gnome-private-toolbar-background: var(--gnome-headerbar-background); + --gnome-private-inactive-toolbar-background: var(--gnome-inactive-headerbar-background); + /* Menus */ + --gnome-private-menu-background: #1e1e1e; + /* Header bar */ + --gnome-private-headerbar-background: #252F49; + --gnome-private-inactive-headerbar-background: var(--gnome-private-toolbar-background); + /* Tabs */ + --gnome-private-tabbar-tab-hover-background: #343e56; /* Hardcoded color */ + --gnome-private-tabbar-tab-active-background: #343e56; /* Hardcoded color */ + --gnome-private-tabbar-tab-active-background-contrast: #495675; /* Hardcoded color */ + --gnome-private-tabbar-tab-active-hover-background: #414a61; /* Hardcoded color */ + --gnome-private-inactive-tabbar-tab-hover-background: #242c3f; /* Hardcoded color */ + --gnome-private-inactive-tabbar-tab-active-background: #272e41; /* Hardcoded color */ + + /* Text color for Firefox Logo in new private tab */ + --gnome-private-wordmark: #FBFBFE; + + /* New private tab background */ + --gnome-private-in-content-page-background: #1f1f1f; + + /* Private browsing info box */ + --gnome-private-text-primary-color: #FBFBFE; + } +} diff --git a/src/other/firefox/Monterey/theme-alt-darker.css b/src/other/firefox/Monterey/theme-alt-darker.css new file mode 100644 index 00000000..8d106962 --- /dev/null +++ b/src/other/firefox/Monterey/theme-alt-darker.css @@ -0,0 +1,36 @@ +@import "parts/toolbox-alt.css"; +@import "parts/buttons.css"; +@import "parts/entries.css"; +@import "parts/controls.css"; +@import "parts/headerbar-urlbar-alt.css"; +@import "parts/headerbar-private-urlbar.css"; +@import "parts/headerbar.css"; +@import "parts/csd.css"; +@import "parts/titlebutton-light.css"; +@import "parts/titlebutton-dark.css"; +@import "parts/popups.css"; +@import "parts/tabsbar-alt.css"; +@import "parts/findbar.css"; +@import "parts/sidebar.css"; +@import "parts/dialogs.css"; +@import "parts/notification.css"; +@import "parts/video-player.css"; +@import "parts/remove-white-flash.css"; +@import "parts/icons.css"; +@import "colors/light.css"; +@import "colors/darker.css"; +@namespace xul "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"; + +/* Set theme version text in customization panel */ +#customization-footer::before { + background: url(icons/icon.svg) no-repeat; + background-size: contain; + content: "Firefox Monterey theme"; + padding: 10px 10px 10px 50px; +} + +#customization-container { + background-color: var(--gnome-browser-before-load-background) !important; + color: var(--gnome-toolbar-color) !important; + background-image: none !important; +} diff --git a/src/other/firefox/Monterey/theme-darker.css b/src/other/firefox/Monterey/theme-darker.css new file mode 100644 index 00000000..0f0d2e54 --- /dev/null +++ b/src/other/firefox/Monterey/theme-darker.css @@ -0,0 +1,36 @@ +@import "parts/toolbox.css"; +@import "parts/buttons.css"; +@import "parts/entries.css"; +@import "parts/controls.css"; +@import "parts/headerbar-urlbar.css"; +@import "parts/headerbar-private-urlbar.css"; +@import "parts/headerbar.css"; +@import "parts/csd.css"; +@import "parts/titlebutton-light.css"; +@import "parts/titlebutton-dark.css"; +@import "parts/popups.css"; +@import "parts/tabsbar.css"; +@import "parts/findbar.css"; +@import "parts/sidebar.css"; +@import "parts/dialogs.css"; +@import "parts/notification.css"; +@import "parts/video-player.css"; +@import "parts/remove-white-flash.css"; +@import "parts/icons.css"; +@import "colors/light.css"; +@import "colors/darker.css"; +@namespace xul "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"; + +/* Set theme version text in customization panel */ +#customization-footer::before { + background: url(icons/icon.svg) no-repeat; + background-size: contain; + content: "Firefox Monterey theme"; + padding: 10px 10px 10px 50px; +} + +#customization-container { + background-color: var(--gnome-browser-before-load-background) !important; + color: var(--gnome-toolbar-color) !important; + background-image: none !important; +} diff --git a/src/other/firefox/WhiteSur/colors/darker.css b/src/other/firefox/WhiteSur/colors/darker.css new file mode 100644 index 00000000..c86ac329 --- /dev/null +++ b/src/other/firefox/WhiteSur/colors/darker.css @@ -0,0 +1,172 @@ +@namespace xul url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); + +/* Variables that start with --gnome- are added by me and are assigned + * to elements somewhere in this code. The rest of the variables are + * built-in in Firefox, so you need to add an !important if you wanna + * override them. */ + +@media (prefers-color-scheme: dark) { + :root { + /* Browser area before a page starts loading */ + --gnome-browser-before-load-background: #1f1f1f; + --theme-primary-color: #315bef; + --theme-primary-hover-color: #5073f1; + --theme-primary-active-color: #6584f3; + + /* Toolbars */ + --gnome-toolbar-background: #1e1e1e; + --gnome-tabstoolbar-background: #1e1e1e; + --gnome-findbar-background: #282828; + --gnome-toolbar-color: #ffffff; + --gnome-toolbar-icon-fill: #ffffff; + --gnome-toolbar-border-color: #070707; + --gnome-inactive-toolbar-color: rgba(255, 255, 255, 0.35); + --gnome-inactive-toolbar-background: #1e1e1e; + --gnome-inactive-toolbar-border-color: #121212; + + /* Sidebar */ + --sidebar-background-color: #323232 !important; + --gnome-sidebar-background: #1e1e1e; + --gnome-inactive-sidebar-background: #3f3f3f; + --gnome-sidebar-border-color: color-mix(in srgb, #000000 75%, var(--gnome-sidebar-background)); + + /* Popups */ + --gnome-menu-background: rgba(40, 40, 40, 0.95); + --gnome-menu-border-color: rgba(0, 0, 0, 0.75); + --gnome-popover-background: rgba(40, 40, 40, 0.95); + --gnome-popover-border-color: rgba(0, 0, 0, 0.75); + --gnome-popover-shadow: 0 5px 8px rgba(0, 0, 0, 0.3); + --gnome-popover-button-hover-background: rgba(255, 255, 255, 0.1); + --gnome-popover-button-active-background: rgba(255, 255, 255, 0.15); + --gnome-popover-separator-color: rgba(255, 255, 255, 0.08); + + /* Header bar */ + --gnome-headerbar-background: #1e1e1e; + --gnome-headerbar-border-color: #070707; + --gnome-headerbar-box-shadow: inset 0 1px rgba(255, 255, 255, 0.15); + --gnome-inactive-headerbar-background: #1e1e1e; + --gnome-inactive-headerbar-border-color: #202020; + --gnome-inactive-headerbar-box-shadow: inset 0 1px rgba(255, 255, 255, 0.08); + + /* Buttons */ + --gnome-button-background: #2a2a2a; + --gnome-button-border-color: rgba(0, 0, 0, 0.2); + --gnome-button-border-bottom-color: rgba(0, 0, 0, 0.25); + --gnome-button-box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); + --gnome-button-hover-color: rgba(255, 255, 255, 0.1); + --gnome-button-active-color: rgba(255, 255, 255, 0.2); + --gnome-button-hover-background: linear-gradient(to top, #242424 0%, #282828 100%); + --gnome-button-active-background: #282828; + --gnome-button-active-border-color: rgba(0, 0, 0, 0.25); + --gnome-button-active-border-bottom-color: rgba(0, 0, 0, 0.25); + --gnome-button-active-box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); + --gnome-button-disabled-background: linear-gradient(to top, #242424 0%, #494949 100%); + --gnome-button-disabled-border-color: rgba(0, 0, 0, 0.2); + --gnome-button-disabled-box-shadow: inset 0 1px rgba(255, 255, 255, 0.03); + --gnome-inactive-button-background: #2a2a2a; + --gnome-inactive-button-border-color: #282828; + --gnome-inactive-button-box-shadow: inset 0 1px rgba(255, 255, 255, 0.0); + --gnome-button-suggested-action-background: linear-gradient(to top, #155099 2px, #15539e); + --gnome-button-suggested-action-border-color: rgba(0, 0, 0, 0.2); + --gnome-button-suggested-action-border-bottom-color: rgba(0, 0, 0, 0.3); + --gnome-button-suggested-action-box-shadow: inset 0 1px rgba(255, 255, 255, 0.08); + --gnome-button-suggested-action-hover-background: linear-gradient(to top, #155099, #1655a2 1px); + --gnome-button-suggested-action-active-background: linear-gradient(to top, #103e75, #103e75 1px); + --gnome-button-suggested-action-active-border-color: rgba(0, 0, 0, 0.3); + --gnome-button-suggested-action-active-box-shadow: inset 0 1px rgba(255, 255, 255, 0.05); + --gnome-button-destructive-action-background: linear-gradient(to top, #ae151c 2px, #b2161d); + --gnome-button-destructive-action-border-color: rgba(0, 0, 0, 0.2); + --gnome-button-destructive-action-border-bottom-color: rgba(0, 0, 0, 0.3); + --gnome-button-destructive-action-box-shadow: inset 0 1px rgba(255, 255, 255, 0.02), 0 1px 2px rgba(0, 0, 0, 0.07); + --gnome-button-destructive-action-hover-background: linear-gradient(to top, #ae151c, #b7161d 1px); + --gnome-button-destructive-action-active-background: linear-gradient(to top, #8a1116, #8a1116 1px); + --gnome-button-destructive-action-active-border-color: rgba(0, 0, 0, 0.3); + --gnome-button-destructive-action-active-box-shadow: inset 0 1px rgba(255, 255, 255, 0); + + --gnome-headerbar-button-combined-background: rgba(255, 255, 255, 0.05); + --gnome-headerbar-button-hover-background: rgba(255, 255, 255, 0.1); + --gnome-headerbar-button-active-background: rgba(255, 255, 255, 0.15); + + /* URL bar */ + --gnome-urlbar-background: #2a2a2a; + --gnome-urlbar-border-color: rgba(0, 0, 0, 0.2); + --gnome-urlbar-box-shadow: 0 3px 6px 1px rgba(0,0,0, .2), 0 5px 16px 3px rgba(0,0,0, .15), 0 0 0 1px rgba(0, 0, 0, 0.75); + --gnome-urlbar-color: #ffffff; + --gnome-hover-urlbar-border-color: #585858; + --gnome-inactive-urlbar-background: #2a2a2a; + --gnome-inactive-urlbar-border-color: #282828; + --gnome-inactive-urlbar-box-shadow: none; + --gnome-inactive-urlbar-color: #d6d6d6; + --gnome-focused-urlbar-border-color: #338CBE; + --gnome-focused-urlbar-highlight-color: #006EA0; + --gnome-private-urlbar-background: #25003e; + + /* Tabs */ + --gnome-tabbar-tab-background: #2a2a2a; + --gnome-tabbar-tab-color: rgb(141, 144, 145); + --gnome-tabbar-tab-border-color: #1e1e1e; + --gnome-tabbar-tab-hover-background: #282828; + --gnome-tabbar-tab-hover-border-color: #1e1e1e; + --gnome-tabbar-tab-hover-color: rgb(200, 200, 200); + --gnome-tabbar-tab-active-background: #1e1e1e; + --gnome-tabbar-tab-active-border-color: #070707; + --gnome-tabbar-tab-active-color: #ffffff; + --gnome-tabbar-tab-active-hover-background: #1e1e1e; + --gnome-inactive-tabbar-tab-color: var(--gnome-tabbar-tab-color); + --gnome-inactive-tabbar-tab-background: var(--gnome-tabbar-tab-background); + --gnome-inactive-tabbar-tab-active-background: var(--gnome-tabbar-tab-active-background); + --gnome-inactive-tabbar-tab-active-border-color: var(--gnome-tabbar-tab-active-border-bottom-color); + --gnome-inactive-tabbar-tab-active-color: var(--gnome-inactive-tabbar-tab-color); + --gnome-tab-attention-icon-color: #718be8; + + /* Switch */ + --gnome-switch-background: #464646; + --gnome-switch-hover-background: #525252; + --gnome-switch-active-background: #606060; + --gnome-switch-border-color: transparent; + --gnome-switch-slider-background: #ffffff; + --gnome-switch-slider-border-color: transparent; + --gnome-switch-slider-box-shadow: inset 0 1px rgba(255, 255, 255, 0.02), 0 1px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.07); + --gnome-switch-pressed-background: #315bef; + --gnome-switch-pressed-hover-background: #5073f1; + --gnome-switch-pressed-active-background: #6584f3; + --gnome-switch-active-border-color: transparent; + --gnome-switch-active-slider-border-color: transparent; + + /* Dirty hacks for replaced symbolic icons, they load from + * /usr/share/icons// and on some systems they need to be + * inverted, on others they don't, adjusts the filters below to your + * needs (you may also adjust icon brightness here). */ + --gnome-convert-icon-to-symbolic-hack-filter: invert(100%) sepia(100%) grayscale(100%) brightness(200%) brightness(85%); + --gnome-icons-hack-filter: invert(100%) sepia(100%) grayscale(100%) brightness(200%) brightness(200%); /* without invert: none */ + --gnome-window-icons-hack-filter: invert(90%); /* without invert: none */ + + /* Private window colors */ + --gnome-private-accent: #78aeed; + + /* Toolbars */ + --gnome-private-toolbar-background: var(--gnome-headerbar-background); + --gnome-private-inactive-toolbar-background: var(--gnome-inactive-headerbar-background); + /* Menus */ + --gnome-private-menu-background: #1e1e1e; + /* Header bar */ + --gnome-private-headerbar-background: #252F49; + --gnome-private-inactive-headerbar-background: var(--gnome-private-toolbar-background); + /* Tabs */ + --gnome-private-tabbar-tab-hover-background: #343e56; /* Hardcoded color */ + --gnome-private-tabbar-tab-active-background: #343e56; /* Hardcoded color */ + --gnome-private-tabbar-tab-active-background-contrast: #495675; /* Hardcoded color */ + --gnome-private-tabbar-tab-active-hover-background: #414a61; /* Hardcoded color */ + --gnome-private-inactive-tabbar-tab-hover-background: #242c3f; /* Hardcoded color */ + --gnome-private-inactive-tabbar-tab-active-background: #272e41; /* Hardcoded color */ + + /* Text color for Firefox Logo in new private tab */ + --gnome-private-wordmark: #FBFBFE; + + /* New private tab background */ + --gnome-private-in-content-page-background: #1f1f1f; + + /* Private browsing info box */ + --gnome-private-text-primary-color: #FBFBFE; + } +} diff --git a/src/other/firefox/WhiteSur/parts/tabsbar.css b/src/other/firefox/WhiteSur/parts/tabsbar.css index 116c3ac6..965ab588 100644 --- a/src/other/firefox/WhiteSur/parts/tabsbar.css +++ b/src/other/firefox/WhiteSur/parts/tabsbar.css @@ -79,6 +79,7 @@ /* Tab labels */ tab { color: var(--gnome-tabbar-tab-color) !important; + background-color: var(--gnome-tabbar-tab-background) !important; } tab:hover { color: var(--gnome-tabbar-tab-hover-color) !important; diff --git a/src/other/firefox/WhiteSur/theme-darker.css b/src/other/firefox/WhiteSur/theme-darker.css new file mode 100644 index 00000000..6fd91d41 --- /dev/null +++ b/src/other/firefox/WhiteSur/theme-darker.css @@ -0,0 +1,36 @@ +@import "parts/toolbox.css"; +@import "parts/buttons.css"; +@import "parts/entries.css"; +@import "parts/controls.css"; +@import "parts/headerbar-urlbar.css"; +@import "parts/headerbar-private-urlbar.css"; +@import "parts/headerbar.css"; +@import "parts/csd.css"; +@import "parts/titlebutton-light.css"; +@import "parts/titlebutton-dark.css"; +@import "parts/popups.css"; +@import "parts/tabsbar.css"; +@import "parts/findbar.css"; +@import "parts/sidebar.css"; +@import "parts/dialogs.css"; +@import "parts/notification.css"; +@import "parts/video-player.css"; +@import "parts/remove-white-flash.css"; +@import "parts/icons.css"; +@import "colors/light.css"; +@import "colors/darker.css"; +@namespace xul "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"; + +/* Set theme version text in customization panel */ +#customization-footer::before { + background: url("icons/icon.svg") no-repeat; + background-size: contain; + content: "Firefox WhiteSur theme"; + padding: 10px 10px 10px 50px; +} + +#customization-container { + background-color: var(--gnome-browser-before-load-background) !important; + color: var(--gnome-toolbar-color) !important; + background-image: none !important; +} diff --git a/src/other/firefox/userChrome-Monterey-alt-darker.css b/src/other/firefox/userChrome-Monterey-alt-darker.css new file mode 100644 index 00000000..d99af502 --- /dev/null +++ b/src/other/firefox/userChrome-Monterey-alt-darker.css @@ -0,0 +1,42 @@ +/*------------------------USAGE---------------------------- + * Remove "/*" at the begining of "@import" line to ENABLE. + * Add "/*" at the begining of "@import" line to DISABLE. + */ + +@import "Monterey/theme-alt-darker.css"; /**/ + +/*--------------Configure common theme features--------------*/ + +/* Move tab close button to left. */ +/*@import "Monterey/left-tab-close-button.css"; /**/ + +/* Hide the tab bar when only one tab is open (GNOMISH) + * You should move the new tab button somewhere else for this to work, because by + * default it is on the tab bar too. */ +@import "Monterey/hide-single-tab.css"; /**/ + +/* Limit the URL bar's autocompletion popup's width to the URL bar's width (GNOMISH) + * This feature is included by default for Firefox 70+ */ +/*@import "Monterey/matching-autocomplete-width.css"; /**/ + +/* Rounded window even when it gets maximized */ +/*@import "Monterey/rounded-window-maximized.css"; /**/ + +/* Active tab high contrast */ +/*@import "Monterey/active-tab-contrast.css"; /**/ + +/* Use system theme icons instead of Adwaita icons included by theme [BUGGED] */ +/*@import "Monterey/system-icons.css"; /**/ + +/* Allow drag window from headerbar buttons (GNOMISH) [BUGGED] */ +/* It can activate button action, with unpleasant behavior. */ +/*@import "Monterey/drag-window-headerbar-buttons.css"; /**/ + +/* Make all tab icons look kinda like symbolic icons */ +/*@import "Monterey/symbolic-tab-icons.css"; /**/ + +/* Hide window buttons (close/min/max) in maximized windows */ +/*@import "Monterey/hide-window-buttons.css"; /**/ + +/* Import your custom stylesheet */ +@import "customChrome.css"; /**/ diff --git a/src/other/firefox/userChrome-Monterey-darker.css b/src/other/firefox/userChrome-Monterey-darker.css new file mode 100644 index 00000000..8ef811e0 --- /dev/null +++ b/src/other/firefox/userChrome-Monterey-darker.css @@ -0,0 +1,58 @@ +/*------------------------USAGE---------------------------- + * Remove "/*" at the begining of "@import" line to ENABLE. + * Add "/*" at the begining of "@import" line to DISABLE. + */ + +@import "Monterey/theme-darker.css"; /**/ + +/*--------------Configure your Monterey theme-------------- + * ONLY for Monterey theme + * Enable one of these options and disable the other ones. + */ + +/* How many buttons on left headerbar */ +@import "Monterey/left_header_button_3.css"; /**/ +/*@import "Monterey/left_header_button_4.css"; /**/ +/*@import "Monterey/left_header_button_5.css"; /**/ + +/* How many buttons on right headerbar */ +@import "Monterey/right_header_button_3.css"; /**/ +/*@import "Monterey/right_header_button_4.css"; /**/ +/*@import "Monterey/right_header_button_5.css"; /**/ + + +/*--------------Configure common theme features--------------*/ + +/* Move tab close button to left. */ +/*@import "Monterey/left-tab-close-button.css"; /**/ + +/* Hide the tab bar when only one tab is open (GNOMISH) + * You should move the new tab button somewhere else for this to work, because by + * default it is on the tab bar too. */ +/*@import "Monterey/hide-single-tab.css"; /**/ + +/* Limit the URL bar's autocompletion popup's width to the URL bar's width (GNOMISH) + * This feature is included by default for Firefox 70+ */ +/*@import "Monterey/matching-autocomplete-width.css"; /**/ + +/* Rounded window even when it gets maximized */ +/*@import "Monterey/rounded-window-maximized.css"; /**/ + +/* Active tab high contrast */ +/*@import "Monterey/active-tab-contrast.css"; /**/ + +/* Use system theme icons instead of Adwaita icons included by theme [BUGGED] */ +/*@import "Monterey/system-icons.css"; /**/ + +/* Allow drag window from headerbar buttons (GNOMISH) [BUGGED] */ +/* It can activate button action, with unpleasant behavior. */ +/*@import "Monterey/drag-window-headerbar-buttons.css"; /**/ + +/* Make all tab icons look kinda like symbolic icons */ +/*@import "Monterey/symbolic-tab-icons.css"; /**/ + +/* Hide window buttons (close/min/max) in maximized windows */ +/*@import "Monterey/hide-window-buttons.css"; /**/ + +/* Import your custom stylesheet */ +@import "customChrome.css"; /**/ diff --git a/src/other/firefox/userChrome-WhiteSur-darker.css b/src/other/firefox/userChrome-WhiteSur-darker.css new file mode 100644 index 00000000..b1d684c8 --- /dev/null +++ b/src/other/firefox/userChrome-WhiteSur-darker.css @@ -0,0 +1,42 @@ +/*------------------------USAGE---------------------------- + * Remove "/*" at the begining of "@import" line to ENABLE. + * Add "/*" at the begining of "@import" line to DISABLE. + */ + +@import "WhiteSur/theme-darker.css"; /**/ + +/*--------------Configure common theme features--------------*/ + +/* Move tab close button to left. */ +/*@import "WhiteSur/left-tab-close-button.css"; /**/ + +/* Hide the tab bar when only one tab is open (GNOMISH) + * You should move the new tab button somewhere else for this to work, because by + * default it is on the tab bar too. */ +/*@import "WhiteSur/hide-single-tab.css"; /**/ + +/* Limit the URL bar's autocompletion popup's width to the URL bar's width (GNOMISH) + * This feature is included by default for Firefox 70+ */ +/*@import "WhiteSur/matching-autocomplete-width.css"; /**/ + +/* Rounded window even when it gets maximized */ +/*@import "WhiteSur/rounded-window-maximized.css"; /**/ + +/* Active tab high contrast */ +/*@import "WhiteSur/active-tab-contrast.css"; /**/ + +/* Use system theme icons instead of Adwaita icons included by theme [BUGGED] */ +/*@import "WhiteSur/system-icons.css"; /**/ + +/* Allow drag window from headerbar buttons (GNOMISH) [BUGGED] */ +/* It can activate button action, with unpleasant behavior. */ +/*@import "WhiteSur/drag-window-headerbar-buttons.css"; /**/ + +/* Make all tab icons look kinda like symbolic icons */ +/*@import "WhiteSur/symbolic-tab-icons.css"; /**/ + +/* Hide window buttons (close/min/max) in maximized windows */ +/*@import "WhiteSur/hide-window-buttons.css"; /**/ + +/* Import your custom stylesheet */ +@import "customChrome.css"; /**/ diff --git a/src/other/firefox/userContent-Monterey-darker.css b/src/other/firefox/userContent-Monterey-darker.css new file mode 100644 index 00000000..06811c9c --- /dev/null +++ b/src/other/firefox/userContent-Monterey-darker.css @@ -0,0 +1,7 @@ +@import "Monterey/colors/light.css"; +@import "Monterey/colors/darker.css"; + +@import "Monterey/pages/common.css"; +@import "Monterey/pages/newtab.css"; +@import "Monterey/pages/reader.css"; +@import "Monterey/pages/privatebrowsing.css"; diff --git a/src/other/firefox/userContent-WhiteSur-darker.css b/src/other/firefox/userContent-WhiteSur-darker.css new file mode 100644 index 00000000..b7a54823 --- /dev/null +++ b/src/other/firefox/userContent-WhiteSur-darker.css @@ -0,0 +1,7 @@ +@import "WhiteSur/colors/light.css"; +@import "WhiteSur/colors/darker.css"; + +@import "Monterey/pages/common.css"; +@import "Monterey/pages/newtab.css"; +@import "Monterey/pages/reader.css"; +@import "Monterey/pages/privatebrowsing.css"; diff --git a/tweaks.sh b/tweaks.sh index ae4e5341..23671510 100755 --- a/tweaks.sh +++ b/tweaks.sh @@ -44,13 +44,14 @@ usage() { helpify "--nord, --nordcolor" "" " Install '${THEME_NAME}' Nord ColorScheme themes" "" helpify "" "" "[Others].." "options" - sec_title "-f, --firefox" " [(monterey/flat)|alt|adaptive]" " Without options default WhiteSur theme will install..." " Options:" + sec_title "-f, --firefox" " [(monterey/flat)|alt|darker|adaptive]" " Without options default WhiteSur theme will install..." " Options:" sec_helpify "1. monterey" " [3+3|3+4|3+5|4+3|4+4|4+5|5+3|5+4|5+5]" " Topbar buttons number: 'a+b'" " a: left side buttons number, b: right side buttons number" sec_helpify "2. flat" " Monterey alt version" "" " Flat round tabs..." sec_helpify "3. alt" " Alt windows button version" "" " Alt window button style like gtk theme" - sec_helpify "4. adaptive" " Adaptive color version" " You need install adaptive-tab-bar-colour plugin first" " https://addons.mozilla.org/firefox/addon/adaptive-tab-bar-colour/" + sec_helpify "4. darker" " Darker Firefox theme version" "" " Darker Firefox theme version" + sec_helpify "5. adaptive" " Adaptive color version" " You need install adaptive-tab-bar-colour plugin first" " https://addons.mozilla.org/firefox/addon/adaptive-tab-bar-colour/" - helpify "-e, --edit-firefox" "[(monterey/flat)|alt|adaptive]" " Edit '${THEME_NAME}' theme for Firefox settings and also connect the theme to the current Firefox profiles" "" + helpify "-e, --edit-firefox" "[(monterey/flat)|alt|darker|adaptive]" " Edit '${THEME_NAME}' theme for Firefox settings and also connect the theme to the current Firefox profiles" "" helpify "-F, --flatpak" "Support options: [-o, -c, -t...]" " Connect '${THEME_NAME}' theme to Flatpak" "Without options will only install default themes" @@ -163,6 +164,10 @@ while [[ $# -gt 0 ]]; do window="alt" prompt -i "Alt windows button version...\n" shift ;; + darker) + darker="-darker" + prompt -i "Darker Firefox theme version...\n" + shift ;; adaptive) adaptive="-adaptive" prompt -i "Firefox adaptive color version...\n" @@ -329,6 +334,13 @@ else fi if [[ "${firefox}" == 'true' || "${edit_firefox}" == 'true' ]]; then + + if [[ "${darker}" == '-darker' && "${adaptive}" == '-adaptive' ]]; then + prompt -w "FIREFOX: You can't use 'adaptive' and 'darker' at the same time. \n" + prompt -i "FIREFOX: Setting to adaptive only... \n" + darker='' + fi + if [[ "${firefox}" == 'true' && "${gdm}" != 'true' ]]; then prompt -i "Installing '${firefoxtheme}' Firefox theme... \n" install_firefox_theme From aeb18dde672c1743a74bb37ec6a228d1705ac7dd Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andr=C3=A9=20Fernandes?= Date: Sun, 29 Sep 2024 02:03:44 +0100 Subject: [PATCH 3/4] Update README.md --- README.md | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index 957a3135..f9835296 100644 --- a/README.md +++ b/README.md @@ -265,7 +265,9 @@ Usage: `./tweaks.sh [OPTIONS...]` 3. alt Alt windows button version Alt window button style like gtk theme - 4. adaptive Adaptive color version You need install adaptive-tab-bar-colour plugin first https://addons.mozilla.org/firefox/addon/adaptive-tab-bar-colour/ + 4. darker Darker Firefox theme version Darker theme according to darker gtk theme + + 5. adaptive Adaptive color version You need install adaptive-tab-bar-colour plugin first https://addons.mozilla.org/firefox/addon/adaptive-tab-bar-colour/ -e, --edit-firefox [(monterey/flat)|alt|adaptive] Edit 'WhiteSur' theme for Firefox settings and also connect the theme to the current Firefox profiles. From 49d278991632670bcc349c8df97de3f113f51128 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andr=C3=A9=20Fernandes?= Date: Sun, 29 Sep 2024 11:51:12 +0100 Subject: [PATCH 4/4] Update README.md --- README.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index f9835296..ff5804aa 100644 --- a/README.md +++ b/README.md @@ -257,19 +257,19 @@ Usage: `./tweaks.sh [OPTIONS...]` [Others]... options - -f, --firefox [(monterey/flat)|alt|adaptive] Without options default WhiteSur theme will install... Options: + -f, --firefox [(monterey/flat)|alt|darker|adaptive] Without options default WhiteSur theme will install... Options: 1. monterey [3+3|3+4|3+5|4+3|4+4|4+5|5+3|5+4|5+5] Topbar buttons number: 'a+b' a: left side buttons number, b: right side buttons number 2. flat Monterey alt version Flat round tabs... - 3. alt Alt windows button version Alt window button style like gtk theme + 3. alt Alt window control buttons version Alt window control buttons style like gtk theme 4. darker Darker Firefox theme version Darker theme according to darker gtk theme 5. adaptive Adaptive color version You need install adaptive-tab-bar-colour plugin first https://addons.mozilla.org/firefox/addon/adaptive-tab-bar-colour/ - -e, --edit-firefox [(monterey/flat)|alt|adaptive] + -e, --edit-firefox [(monterey/flat)|alt|darker|adaptive] Edit 'WhiteSur' theme for Firefox settings and also connect the theme to the current Firefox profiles. -F, --flatpak Support options: [-o, -c, -t...]