black7375 / Firefox-UI-Fix

🦊 I respect proton UI and aim to improve it.
Mozilla Public License 2.0
5.24k stars 183 forks source link

The three dots button outline is barely visible on new tab page tiles items #913

Open Aleksandra0056 opened 2 weeks ago

Aleksandra0056 commented 2 weeks ago

Describe the bug

The three dots (...) button isn't well visible on the outline of new tab page tiles (especially on higher contrast) on the system default & light themes (it is much more visible on the dark theme).

Expected behavior

Change the shade of the three dots button outline to be darker and/or change the shade of the NTP tiles outline to be lighter.

Screenshots

Here is a screenshot of the new tab tile & three dots button: The three dots button isn't well visible on new tab tiles outline

OS

Windows 10

OS - Others

No response

Firefox Version

v127.0.0 (64-bit)

Distribution

Theme

Theme - More Info

No response

user.js setup

user.js setup
```javascript // ** Theme Default Options **************************************************** // userchrome.css usercontent.css activate user_pref("toolkit.legacyUserProfileCustomizations.stylesheets", true); // Fill SVG Color user_pref("svg.context-properties.content.enabled", true); // Restore Compact Mode - 89 Above user_pref("browser.compactmode.show", true); // about:home Search Bar - 89 Above user_pref("browser.newtabpage.activity-stream.improvesearch.handoffToAwesomebar", false); // CSS's `:has()` selector #457 - 103 Above user_pref("layout.css.has-selector.enabled", true); // Browser Theme Based Scheme - Will be activate 95 Above // user_pref("layout.css.prefers-color-scheme.content-override", 3); // ** Theme Related Options **************************************************** // == Theme Distribution Settings ============================================== // The rows that are located continuously must be changed `true`/`false` explicitly because there is a collision. // https://github.com/black7375/Firefox-UI-Fix/wiki/Options#important user_pref("userChrome.tab.connect_to_window", true); // Original, Photon user_pref("userChrome.tab.color_like_toolbar", true); // Original, Photon user_pref("userChrome.tab.lepton_like_padding", true); // Original user_pref("userChrome.tab.photon_like_padding", false); // Photon user_pref("userChrome.tab.dynamic_separator", true); // Original, Proton user_pref("userChrome.tab.static_separator", false); // Photon user_pref("userChrome.tab.static_separator.selected_accent", false); // Just option user_pref("userChrome.tab.bar_separator", false); // Just option user_pref("userChrome.tab.newtab_button_like_tab", true); // Original user_pref("userChrome.tab.newtab_button_smaller", false); // Photon user_pref("userChrome.tab.newtab_button_proton", false); // Proton user_pref("userChrome.icon.panel_full", true); // Original, Proton user_pref("userChrome.icon.panel_photon", false); // Photon // Original Only user_pref("userChrome.tab.box_shadow", true); user_pref("userChrome.tab.bottom_rounded_corner", true); // Photon Only user_pref("userChrome.tab.photon_like_contextline", false); user_pref("userChrome.rounding.square_tab", false); // == Theme Compatibility Settings ============================================= // user_pref("userChrome.compatibility.accent_color", true); // Firefox v103 Below // user_pref("userChrome.compatibility.covered_header_image", true); // user_pref("userChrome.compatibility.panel_cutoff", true); // user_pref("userChrome.compatibility.navbar_top_border", true); // user_pref("userChrome.compatibility.dynamic_separator", true); // Need dynamic_separator // user_pref("userChrome.compatibility.os.linux_non_native_titlebar_button", true); // user_pref("userChrome.compatibility.os.windows_maximized", true); // user_pref("userChrome.compatibility.os.win11", true); // == Theme Custom Settings ==================================================== // -- User Chrome -------------------------------------------------------------- // user_pref("userChrome.theme.private", true); // user_pref("userChrome.theme.proton_color.dark_blue_accent", true); // user_pref("userChrome.theme.monospace", true); // user_pref("userChrome.theme.transparent.frame", true); // user_pref("userChrome.theme.transparent.menu", true); // user_pref("userChrome.theme.transparent.panel", true); // user_pref("userChrome.theme.non_native_menu", true); // only for linux // user_pref("userChrome.decoration.disable_panel_animate", true); // user_pref("userChrome.decoration.disable_sidebar_animate", true); // user_pref("userChrome.decoration.panel_button_separator", true); // user_pref("userChrome.decoration.panel_arrow", true); // user_pref("userChrome.autohide.tab", true); // user_pref("userChrome.autohide.tab.opacity", true); // user_pref("userChrome.autohide.tab.blur", true); // user_pref("userChrome.autohide.tabbar", true); // user_pref("userChrome.autohide.navbar", true); // user_pref("userChrome.autohide.bookmarkbar", true); // user_pref("userChrome.autohide.sidebar", true); // user_pref("userChrome.autohide.fill_urlbar", true); // user_pref("userChrome.autohide.back_button", true); // user_pref("userChrome.autohide.forward_button", true); // user_pref("userChrome.autohide.page_action", true); // user_pref("userChrome.autohide.toolbar_overlap", true); // user_pref("userChrome.autohide.toolbar_overlap.allow_layout_shift", true); // user_pref("userChrome.hidden.tab_icon", true); // user_pref("userChrome.hidden.tab_icon.always", true); // user_pref("userChrome.hidden.tabbar", true); // user_pref("userChrome.hidden.navbar", true); // user_pref("userChrome.hidden.private_indicator", true); // user_pref("userChrome.hidden.titlebar_container", true); // user_pref("userChrome.hidden.sidebar_header", true); // user_pref("userChrome.hidden.sidebar_header.vertical_tab_only", true); // user_pref("userChrome.hidden.urlbar_iconbox", true); // user_pref("userChrome.hidden.urlbar_iconbox.label_only", true); // user_pref("userChrome.hidden.bookmarkbar_icon", true); // user_pref("userChrome.hidden.bookmarkbar_label", true); // user_pref("userChrome.hidden.disabled_menu", true); // user_pref("userChrome.centered.tab", true); // user_pref("userChrome.centered.tab.label", true); // user_pref("userChrome.centered.urlbar", true); // user_pref("userChrome.centered.bookmarkbar", true); // user_pref("userChrome.counter.tab", true); // user_pref("userChrome.counter.bookmark_menu", true); // user_pref("userChrome.combined.nav_button", true); // user_pref("userChrome.combined.nav_button.home_button", true); // user_pref("userChrome.combined.urlbar.nav_button", true); // user_pref("userChrome.combined.urlbar.home_button", true); // user_pref("userChrome.combined.urlbar.reload_button", true); // user_pref("userChrome.combined.sub_button.none_background", true); // user_pref("userChrome.combined.sub_button.as_normal", true); // user_pref("userChrome.rounding.square_button", true); // user_pref("userChrome.rounding.square_dialog", true); // user_pref("userChrome.rounding.square_panel", true); // user_pref("userChrome.rounding.square_panelitem", true); // user_pref("userChrome.rounding.square_menupopup", true); // user_pref("userChrome.rounding.square_menuitem", true); // user_pref("userChrome.rounding.square_infobox", true); // user_pref("userChrome.rounding.square_toolbar", true); // user_pref("userChrome.rounding.square_field", true); // user_pref("userChrome.rounding.square_urlView_item", true); // user_pref("userChrome.rounding.square_checklabel", true); // user_pref("userChrome.padding.first_tab", true); // user_pref("userChrome.padding.first_tab.always", true); // user_pref("userChrome.padding.drag_space", true); // user_pref("userChrome.padding.drag_space.maximized", true); // user_pref("userChrome.padding.toolbar_button.compact", true); // user_pref("userChrome.padding.menu_compact", true); // user_pref("userChrome.padding.bookmark_menu.compact", true); // user_pref("userChrome.padding.urlView_expanding", true); // user_pref("userChrome.padding.urlView_result", true); // user_pref("userChrome.padding.panel_header", true); // user_pref("userChrome.urlbar.iconbox_with_separator", true); // user_pref("userChrome.urlView.as_commandbar", true); // user_pref("userChrome.urlView.full_width_padding", true); // user_pref("userChrome.urlView.always_show_page_actions", true); // user_pref("userChrome.urlView.move_icon_to_left", true); // user_pref("userChrome.urlView.go_button_when_typing", true); // user_pref("userChrome.urlView.focus_item_border", true); // user_pref("userChrome.tabbar.as_titlebar", true); // user_pref("userChrome.tabbar.fill_width", true); // user_pref("userChrome.tabbar.multi_row", true); // user_pref("userChrome.tabbar.unscroll", true); // user_pref("userChrome.tabbar.on_bottom", true); // user_pref("userChrome.tabbar.on_bottom.above_bookmark", true); // Need on_bottom // user_pref("userChrome.tabbar.on_bottom.menubar_on_top", true); // Need on_bottom // user_pref("userChrome.tabbar.on_bottom.hidden_single_tab", true); // Need on_bottom // user_pref("userChrome.tabbar.one_liner", true); // user_pref("userChrome.tabbar.one_liner.combine_navbar", true); // Need one_liner // user_pref("userChrome.tabbar.one_liner.tabbar_first", true); // Need one_liner // user_pref("userChrome.tabbar.one_liner.responsive", true); // Need one_liner // user_pref("userChrome.tab.bottom_rounded_corner.all", true); // user_pref("userChrome.tab.bottom_rounded_corner.australis", true); // user_pref("userChrome.tab.bottom_rounded_corner.edge", true); // user_pref("userChrome.tab.bottom_rounded_corner.chrome", true); // user_pref("userChrome.tab.bottom_rounded_corner.chrome_legacy", true); // user_pref("userChrome.tab.bottom_rounded_corner.wave", true); // user_pref("userChrome.tab.always_show_tab_icon", true); // user_pref("userChrome.tab.close_button_at_pinned", true); // user_pref("userChrome.tab.close_button_at_pinned.always", true); // user_pref("userChrome.tab.close_button_at_pinned.background", true); // user_pref("userChrome.tab.close_button_at_hover.always", true); // Need close_button_at_hover // user_pref("userChrome.tab.close_button_at_hover.with_selected", true); // Need close_button_at_hover // user_pref("userChrome.tab.sound_show_label", true); // Need remove sound_hide_label // user_pref("userChrome.tab.container.on_top", true); // user_pref("userChrome.tab.container.always_long", true); // user_pref("userChrome.tab.sound_with_favicons.on_center", true); // user_pref("userChrome.tab.selected_bold", true); // user_pref("userChrome.navbar.as_sidebar", true); // user_pref("userChrome.bookmarkbar.multi_row", true); // user_pref("userChrome.findbar.floating_on_top", true); // user_pref("userChrome.panel.remove_strip", true); // user_pref("userChrome.panel.full_width_separator", true); // user_pref("userChrome.panel.full_width_padding", true); // user_pref("userChrome.sidebar.overlap", true); // user_pref("userChrome.icon.disabled", true); // user_pref("userChrome.icon.account_image_to_right", true); // user_pref("userChrome.icon.account_label_to_right", true); // user_pref("userChrome.icon.menu.full", true); // user_pref("userChrome.icon.global_menu.mac", true); // -- User Content ------------------------------------------------------------- // user_pref("userContent.player.ui.twoline", true); // user_pref("userContent.newTab.hidden_logo", true); // user_pref("userContent.newTab.background_image", true); // Need wallpaper image to `userContent.css`. :root { --uc-newTab-wallpaper: url("../icons/background_image.png"); } // user_pref("userContent.page.proton_color.dark_blue_accent", true); // user_pref("userContent.page.proton_color.system_accent", true); // user_pref("userContent.page.dark_mode.pdf", true); // user_pref("userContent.page.monospace", true); // == Theme Default Settings =================================================== // -- User Chrome -------------------------------------------------------------- user_pref("userChrome.compatibility.theme", true); user_pref("userChrome.compatibility.os", true); user_pref("userChrome.theme.built_in_contrast", true); user_pref("userChrome.theme.system_default", true); user_pref("userChrome.theme.proton_color", true); user_pref("userChrome.theme.proton_chrome", true); // Need proton_color user_pref("userChrome.theme.fully_color", true); // Need proton_color user_pref("userChrome.theme.fully_dark", true); // Need proton_color user_pref("userChrome.decoration.cursor", true); user_pref("userChrome.decoration.field_border", true); user_pref("userChrome.decoration.download_panel", true); user_pref("userChrome.decoration.animate", true); user_pref("userChrome.padding.tabbar_width", true); user_pref("userChrome.padding.tabbar_height", true); user_pref("userChrome.padding.toolbar_button", true); user_pref("userChrome.padding.navbar_width", true); user_pref("userChrome.padding.urlbar", true); user_pref("userChrome.padding.bookmarkbar", true); user_pref("userChrome.padding.infobar", true); user_pref("userChrome.padding.menu", true); user_pref("userChrome.padding.bookmark_menu", true); user_pref("userChrome.padding.global_menubar", true); user_pref("userChrome.padding.panel", true); user_pref("userChrome.padding.popup_panel", true); user_pref("userChrome.tab.multi_selected", true); user_pref("userChrome.tab.unloaded", true); user_pref("userChrome.tab.letters_cleary", true); user_pref("userChrome.tab.close_button_at_hover", true); user_pref("userChrome.tab.sound_hide_label", true); user_pref("userChrome.tab.sound_with_favicons", true); user_pref("userChrome.tab.pip", true); user_pref("userChrome.tab.container", true); user_pref("userChrome.tab.crashed", true); user_pref("userChrome.fullscreen.overlap", true); user_pref("userChrome.fullscreen.show_bookmarkbar", true); user_pref("userChrome.icon.library", true); user_pref("userChrome.icon.panel", true); user_pref("userChrome.icon.menu", true); user_pref("userChrome.icon.context_menu", true); user_pref("userChrome.icon.global_menu", true); user_pref("userChrome.icon.global_menubar", true); user_pref("userChrome.icon.1-25px_stroke", true); // -- User Content ------------------------------------------------------------- user_pref("userContent.player.ui", true); user_pref("userContent.player.icon", true); user_pref("userContent.player.noaudio", true); user_pref("userContent.player.size", true); user_pref("userContent.player.click_to_play", true); user_pref("userContent.player.animate", true); user_pref("userContent.newTab.full_icon", true); user_pref("userContent.newTab.animate", true); user_pref("userContent.newTab.pocket_to_last", true); user_pref("userContent.newTab.searchbar", true); user_pref("userContent.page.field_border", true); user_pref("userContent.page.illustration", true); user_pref("userContent.page.proton_color", true); user_pref("userContent.page.dark_mode", true); // Need proton_color user_pref("userContent.page.proton", true); // Need proton_color // ** Useful Options *********************************************************** // Tab preview // https://blog.nightly.mozilla.org/2024/02/06/a-preview-of-tab-previews-these-weeks-in-firefox-issue-153/ user_pref("browser.tabs.cardPreview.enabled", true); // Paste suggestion at urlbar // https://blog.nightly.mozilla.org/2023/12/04/url-gonna-want-to-check-this-out-these-weeks-in-firefox-issue-150/ user_pref("browser.urlbar.clipboard.featureGate", true); // Integrated calculator at urlbar user_pref("browser.urlbar.suggest.calculator", true); // Integrated unit convertor at urlbar // user_pref("browser.urlbar.unitConversion.enabled", true); // Draw in Titlebar // user_pref("browser.tabs.drawInTitlebar", true); // user_pref("browser.tabs.inTitlebar", 1); // Nightly, 96 Above // Searchbar, Removed from settings starting with FF v122 // user_pref("browser.search.widget.inNavBar", true); // Firefox view search // https://blog.nightly.mozilla.org/2023/12/14/better-searching-in-firefox-to-close-out-2023-these-weeks-in-firefox-issue-151/ // user_pref("browser.firefox-view.search.enabled", true); // user_pref("browser.firefox-view.virtual-list.enabled", true); // Firefox screenshot // https://blog.nightly.mozilla.org/2024/01/22/happy-new-year-these-weeks-in-firefox-issue-152/ // user_pref("screenshots.browser.component.enabled", true); // ** Scrolling Settings ******************************************************* // == Only Sharpen Scrolling =================================================== // Pref Value Original /* user_pref("mousewheel.min_line_scroll_amount", 10); // 5 user_pref("general.smoothScroll.mouseWheel.durationMinMS", 80); // 50 user_pref("general.smoothScroll.currentVelocityWeighting", "0.15"); // "0.25" user_pref("general.smoothScroll.stopDecelerationWeighting", "0.6"); // "0.4" */ // == Smooth Scrolling ========================================================== // ** Scrolling Options ******************************************************** // based on natural smooth scrolling v2 by aveyo // this preset will reset couple extra variables for consistency // Pref Value Original /* user_pref("apz.allow_zooming", true); /// true user_pref("apz.force_disable_desktop_zooming_scrollbars", false); /// false user_pref("apz.paint_skipping.enabled", true); /// true user_pref("apz.windows.use_direct_manipulation", true); /// true user_pref("dom.event.wheel-deltaMode-lines.always-disabled", true); /// false user_pref("general.smoothScroll.currentVelocityWeighting", "0.12"); /// "0.25" <- 1. If scroll too slow, set to "0.15" user_pref("general.smoothScroll.durationToIntervalRatio", 1000); /// 200 user_pref("general.smoothScroll.lines.durationMaxMS", 100); /// 150 user_pref("general.smoothScroll.lines.durationMinMS", 0); /// 150 user_pref("general.smoothScroll.mouseWheel.durationMaxMS", 100); /// 200 user_pref("general.smoothScroll.mouseWheel.durationMinMS", 0); /// 50 user_pref("general.smoothScroll.mouseWheel.migrationPercent", 100); /// 100 user_pref("general.smoothScroll.msdPhysics.continuousMotionMaxDeltaMS", 12); /// 120 user_pref("general.smoothScroll.msdPhysics.enabled", true); /// false user_pref("general.smoothScroll.msdPhysics.motionBeginSpringConstant", 200); /// 1250 user_pref("general.smoothScroll.msdPhysics.regularSpringConstant", 200); /// 1000 user_pref("general.smoothScroll.msdPhysics.slowdownMinDeltaMS", 10); /// 12 user_pref("general.smoothScroll.msdPhysics.slowdownMinDeltaRatio", "1.20"); /// "1.3" user_pref("general.smoothScroll.msdPhysics.slowdownSpringConstant", 1000); /// 2000 user_pref("general.smoothScroll.other.durationMaxMS", 100); /// 150 user_pref("general.smoothScroll.other.durationMinMS", 0); /// 150 user_pref("general.smoothScroll.pages.durationMaxMS", 100); /// 150 user_pref("general.smoothScroll.pages.durationMinMS", 0); /// 150 user_pref("general.smoothScroll.pixels.durationMaxMS", 100); /// 150 user_pref("general.smoothScroll.pixels.durationMinMS", 0); /// 150 user_pref("general.smoothScroll.scrollbars.durationMaxMS", 100); /// 150 user_pref("general.smoothScroll.scrollbars.durationMinMS", 0); /// 150 user_pref("general.smoothScroll.stopDecelerationWeighting", "0.6"); /// "0.4" user_pref("layers.async-pan-zoom.enabled", true); /// true user_pref("layout.css.scroll-behavior.spring-constant", "250.0"); /// "250.0" user_pref("mousewheel.acceleration.factor", 3); /// 10 user_pref("mousewheel.acceleration.start", -1); /// -1 user_pref("mousewheel.default.delta_multiplier_x", 100); /// 100 user_pref("mousewheel.default.delta_multiplier_y", 100); /// 100 user_pref("mousewheel.default.delta_multiplier_z", 100); /// 100 user_pref("mousewheel.min_line_scroll_amount", 0); /// 5 user_pref("mousewheel.system_scroll_override.enabled", true); /// true <- 2. If scroll too fast, set to false user_pref("mousewheel.system_scroll_override_on_root_content.enabled", false); /// true user_pref("mousewheel.transaction.timeout", 1500); /// 1500 user_pref("toolkit.scrollbox.horizontalScrollDistance", 4); /// 5 user_pref("toolkit.scrollbox.verticalScrollDistance", 3); /// 3 */ ```

Additional context

No response