From ad970462e3988f3c9065646d5d48c0d2915dbabc Mon Sep 17 00:00:00 2001 From: QuietRobot <87845044+quietrobot@users.noreply.github.com> Date: Wed, 26 Aug 2026 22:46:17 -0300 Subject: [PATCH] fix(toolbar): update bookmark menu arrows, icons, and fix scroll issue --- chrome/icons/arrow-filled-down.svg | 5 ++- chrome/icons/arrow-filled-up.svg | 4 ++ chrome/icons/icons.css | 39 +++++++++++++++----- chrome/userChrome.css | 59 +++++++++++++++++++++++++++++- 4 files changed, 94 insertions(+), 13 deletions(-) create mode 100644 chrome/icons/arrow-filled-up.svg diff --git a/chrome/icons/arrow-filled-down.svg b/chrome/icons/arrow-filled-down.svg index ee09d02..c8b2fe2 100644 --- a/chrome/icons/arrow-filled-down.svg +++ b/chrome/icons/arrow-filled-down.svg @@ -1 +1,4 @@ - \ No newline at end of file + + + + \ No newline at end of file diff --git a/chrome/icons/arrow-filled-up.svg b/chrome/icons/arrow-filled-up.svg new file mode 100644 index 0000000..fa51177 --- /dev/null +++ b/chrome/icons/arrow-filled-up.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/chrome/icons/icons.css b/chrome/icons/icons.css index 73eb9f1..b551817 100644 --- a/chrome/icons/icons.css +++ b/chrome/icons/icons.css @@ -1586,16 +1586,23 @@ menuitem[data-l10n-id="origin-controls-options"] .menu-text::after { .menu-right { opacity: 0 !important; } + menu::after { - content: ""; - margin-right: -1px !important; + content: "" !important; + margin-block: auto !important; + display: flex !important; + align-items: center !important; + margin-right: -6px !important; color: var(--textSecondary) !important; font-size: 10px !important; + opacity: 1 !important; font-family: 'Segoe Fluent Icons', 'Segoe MDL2 Assets' !important; background-size: 10px !important; background-repeat: no-repeat !important; background-position: center center !important; + background-image: none !important; } + #protections-popup-mainView .subviewbutton-nav:not(.notFound), .widget-overflow-list .subviewbutton-nav, .PanelUI-subView .subviewbutton-nav { @@ -1612,13 +1619,6 @@ menu::after { padding: 0 0 4px 0 !important; } -#BMB_bookmarksPopup menu[container=true]{ - background-image: url(chevron-right.svg); - background-repeat: no-repeat; - background-size: 4.5px; - background-position: 94.5% 50%; -} - /* Tab scroll icons */ #scrollbutton-up:not(.menupopup-scrollbutton), #scrollbutton-down:not(.menupopup-scrollbutton) { list-style-image: none !important; @@ -1631,6 +1631,25 @@ menu::after { background-image: url(caret-right.svg) !important; } +/* Bookmarks toolbar scroll arrows */ + +#scrollbutton-up[part="scrollbutton-up"] { + background-image: var(--menu-arrow-icon-up, url(caret-left.svg)) !important; + background-repeat: no-repeat !important; + background-position: center center !important; + background-size: 8px !important; +} +#scrollbutton-down[part="scrollbutton-down"] { + background-image: var(--menu-arrow-icon-down, url(caret-right.svg)) !important; + background-repeat: no-repeat !important; + background-position: center center !important; + background-size: 8px !important; +} +.menupopup-arrowscrollbox { + --menu-arrow-icon-up: url(arrow-filled-up.svg); + --menu-arrow-icon-down: url(arrow-filled-down.svg); +} + /* Proper back icon inside panels */ .panel-header { & > .subviewbutton-back { @@ -2216,4 +2235,4 @@ menuitem[anonid="clear-search-history"] { .persistent-storage-icon { -webkit-mask-image: url("persistent-storage.svg") !important; } .persistent-storage-icon.blocked-permission-icon { -webkit-mask-image: url("persistent-storage-blocked.svg") !important; } .autoplay-media-icon { -webkit-mask-image: url("autoplay-media.svg") !important; } -.autoplay-media-icon.blocked-permission-icon { -webkit-mask-image: url("autoplay-media-blocked.svg") !important; } \ No newline at end of file +.autoplay-media-icon.blocked-permission-icon { -webkit-mask-image: url("autoplay-media-blocked.svg") !important; } diff --git a/chrome/userChrome.css b/chrome/userChrome.css index 238ef17..3f04a6c 100644 --- a/chrome/userChrome.css +++ b/chrome/userChrome.css @@ -4552,6 +4552,56 @@ menupopup menu[disabled="true"], menupopup menuitem[disabled="true"] { } } +/* ========== Bookmarks toolbar ========== */ + +#BMB_searchBookmarks, +#BMB_viewBookmarksSidebar { + position: relative !important; +} + +* { + --menu-clip-enable: 0; +} + +.menupopup-arrowscrollbox { + --menu-clip-enable: 1; +} + +scrollbox[part="scrollbox"] { + --clr-top: 0px; + --clr-bottom: 0px; + clip-path: inset(var(--clr-top) 0 var(--clr-bottom) 0) !important; + padding-top: var(--clr-top) !important; + padding-bottom: var(--clr-bottom) !important; +} + +toolbarbutton#scrollbutton-up:not([disabled]) ~ scrollbox[part="scrollbox"] { + --clr-top: calc(26px * var(--menu-clip-enable, 0)); +} + +scrollbox[part="scrollbox"]:has(~ toolbarbutton#scrollbutton-down:not([disabled])) { + --clr-bottom: calc(26px * var(--menu-clip-enable, 0)); +} + +.menupopup-arrowscrollbox { + --menu-scrollbtn-shift-x: 2px; + --menu-scrollbtn-shift-up-y: 10px; + --menu-scrollbtn-shift-down-y: 6px; +} + +#scrollbutton-up[part="scrollbutton-up"] { + position: relative; + z-index: 2; + top: calc(-8px + var(--menu-scrollbtn-shift-up-y, 0px)) !important; + left: calc(4px + var(--menu-scrollbtn-shift-x, 0px)) !important; +} +#scrollbutton-down[part="scrollbutton-down"] { + position: relative; + z-index: 2; + top: calc(-8px + var(--menu-scrollbtn-shift-down-y, 0px)) !important; + left: calc(4px + var(--menu-scrollbtn-shift-x, 0px)) !important; +} + /* ========== Dialog boxes ========== */ dialog:not(#window-modal-dialog) { @@ -8177,6 +8227,11 @@ tab-split-view-wrapper { margin-bottom: 0 !important; } +#tabbrowser-arrowscrollbox { + --menu-scrollbtn-shift-up-y: 1px; + --menu-scrollbtn-shift-down-y: 1px; +} + @media (-moz-platform: windows) and (not (-moz-windows-accent-color-in-titlebar)) { :root[sizemode="normal"][customtitlebar]:not([inFullscreen]) #navigator-toolbox { padding-top: 0 !important; @@ -8620,7 +8675,7 @@ tab-split-view-wrapper { /* Toolbar icons pinned to the tab area */ #TabsToolbar .toolbarbutton-1 { - margin-bottom: 6px !important; + margin-bottom: 5px !important; } /* Tab gap up and down */ @@ -11611,4 +11666,4 @@ tab-split-view-wrapper { } } } -} \ No newline at end of file +}