diff --git a/CREDITS b/CREDITS index e6181fa..ec643d9 100644 --- a/CREDITS +++ b/CREDITS @@ -89,6 +89,10 @@ N: 7k5x E: 7k5xlp0onfire@gmail.com W: https://github.com/7k5x +N: Ajith-stark +E: ajith.kum.12342@gmail.com +W: https://github.com/Ajith-stark + N: badprogramshere W: https://github.com/badprogramshere @@ -96,6 +100,10 @@ N: Burak Yigit Kaya E: ben@byk.im W: https://byk.im/ +N: dr460nf1r3 +E: njcrypted@protonmail.com +W: https://dr460nf1r3.me/ + N: hellojaccc E: kim@taekyeong.me W: https://github.com/hellojaccc diff --git a/icons/dismiss-filled.svg b/icons/dismiss-filled.svg new file mode 100644 index 0000000..d88e0a7 --- /dev/null +++ b/icons/dismiss-filled.svg @@ -0,0 +1,3 @@ + + + diff --git a/icons/movetowindow-16.svg b/icons/movetowindow-16.svg index 80181a3..0584677 100644 --- a/icons/movetowindow-16.svg +++ b/icons/movetowindow-16.svg @@ -1,7 +1,7 @@ - - - + + + diff --git a/icons/share.svg b/icons/share.svg index a143388..9793379 100644 --- a/icons/share.svg +++ b/icons/share.svg @@ -1,7 +1,7 @@ - - - - \ No newline at end of file + + + + diff --git a/userChrome.css b/userChrome.css index e932d40..ccdde24 100644 --- a/userChrome.css +++ b/userChrome.css @@ -6,7 +6,7 @@ } @media not all and ((-moz-os-version: windows-win7) or (-moz-os-version: windows-win8)) { /* Level 4 */ :root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"]) #navigator-toolbox { - background-color: var(--lwt-accent-color); + background-color: var(--lwt-accent-color) !important; } } @@ -23,6 +23,26 @@ border-radius: 4px; } + /*= Identity Poup Icon Crop ================================================*/ + .identity-popup-security-connection.identity-button { + padding-block: 1px; + } + + /*= Zoom in button's plus icon horizontal rate =============================*/ + #customization-palette-container #zoom-in-button > .toolbarbutton-icon, + #customization-panel-container #zoom-in-button > .toolbarbutton-icon, + #widget-overflow-mainView #zoom-in-button > .toolbarbutton-icon { + padding-inline-start: 0px !important; + } + + /*= Icon Fill Color ========================================================*/ + :root:-moz-lwtheme { + /* Auto create --lwt-toolbarbutton-icon-fill-attention, fix for nightly default theme + Default Color: rgb(0,97,224) -> rgb(0, 120, 215) for more light + */ + --lwt-toolbarbutton-icon-fill-attention: var(--button-primary-bgcolor, rgb(0, 120, 215)); + } + /*= Light Weight Theme =====================================================*/ /* Header Image */ :root[lwtheme-image] { @@ -294,13 +314,11 @@ --card-outline-color: var(--grey-60); --dialog-warning-text-color: var(--red-40); - - scrollbar-color: rgba(249,249,250,.4) rgba(20,20,25,.3); } } /*== Menu color ===========================================================*/ - menupopup { + html#main-window menupopup { /* is same as toolbar color https://github.com/mozilla/gecko-dev/blob/master/toolkit/themes/windows/global/global.css#L17-L67 */ --menu-color: var(--arrowpanel-color, var(--in-content-page-color)) !important; --menu-background-color: var(--arrowpanel-background, var(--in-content-button-background)) !important; @@ -312,23 +330,44 @@ --menuitem-disabled-hover-background-color: color-mix(in srgb, var(--menuitem-hover-background-color) 40%, transparent) !important; } + @media not all and (-moz-gtk-csd-available) { + window:is(#bookmarksPanel, #history-panel)[lwt-sidebar="true"] menupopup { + --panel-color: var(--lwt-sidebar-text-color, var(--menu-color)) !important; + --panel-background: var(--lwt-sidebar-background-color, var(--menu-background-color)) !important; + } + window:is(#bookmarksPanel, #history-panel)[lwt-sidebar="true"] menu[_moz-menuactive="true"]:not([disabled="true"]), + window:is(#bookmarksPanel, #history-panel)[lwt-sidebar="true"] menuitem[_moz-menuactive="true"]:not([disabled="true"]) { + --menuitem-hover-background-color: color-mix(in srgb, currentColor 17%, transparent); /* Looks like toolbar button */ + /* or var(--lwt-sidebar-highlight-background-color) + If this value is used, unset is required in the default theme. + */ + } + } + /* Fallback background */ menupopup:not(.cui-widget-panel.cui-widget-panelview, [placespopup="true"]) { background-color: var(--lwt-accent-color, var(--in-content-page-background)) !important; } /* Default theme color preservation */ - :root[lwtheme-mozlightdark] menupopup { - --menu-color: var(--toolbar-color) !important; - --menu-background-color: var(--toolbar-bgcolor) !important; + :root[lwtheme-mozlightdark] menupopup:not(#BMB_bookmarksPopup, [placespopup="true"]) { + --menu-color: var(--toolbar-color, var(--in-content-page-color)) !important; + --arrowpanel-background: var(--toolbar-bgcolor, var(--in-content-button-background)) !important; /* --menu-background-color */ + } + @media not all and (-moz-gtk-csd-available) { + window:is(#bookmarksPanel, #history-panel)[style*="--newtab-background-color: rgba(249, 249, 251, 1);"] menupopup, /* Default Light Mode */ + window:is(#bookmarksPanel, #history-panel)[style*="--newtab-background-color: rgba(43, 42, 51, 1);"] menupopup { /* Default Dark Mode */ + --panel-color: var(--menu-color) !important; + --panel-background: var(--menu-background-color) !important; + } } /* Fully Dark Mode **********************************************************/ /*= Remove White Flash =====================================================*/ #tabbrowser-tabbox, #tabbrowser-tabpanels, - browser[type=content-primary], - browser[type=content] > html { + browser[type="content-primary"], + browser[type="content"] > html { background: var(--in-content-page-background) !important; } @@ -445,7 +484,7 @@ /*= Root - Reduce Padding ==================================================*/ :root { /* Tab Bar */ - --proton-tab-block-margin: 0px !important; /* Original: 4px */ + --proton-tab-block-margin: 0px !important; /* Original: 4px, Legacy */ --tab-block-margin: 0px !important; /* New version of --proton-tab-block-margin */ --tab-border-radius: 0px !important; /* Original: 4px */ --inline-tab-padding: 6px !important; /* Original: 8px */ @@ -457,7 +496,7 @@ --arrowpanel-padding: 0.8em !important; /* Original: 16px or .cui-widget-panel, .cui-widget-panel::part(arrowcontent) => 4px 0 */ } - :root[uidensity=compact] { + :root[uidensity="compact"] { /* Tool Bar */ --toolbarbutton-outer-padding: 2px !important; /* Original: 3px, General is 2px */ @@ -465,7 +504,7 @@ --arrowpanel-menuitem-padding: 3px !important; /* Original: 8px */ } - :root[uidensity=touch] { + :root[uidensity="touch"] { /* Tab Bar - Like Original */ --proton-tab-block-margin: 4px !important; /* Original: 4px */ --tab-block-margin: 4px !important; /* New version of --proton-tab-block-margin */ @@ -509,7 +548,7 @@ margin-inline-start: 0 !important; } - :root:not([uidensity=touch]) #tabbrowser-arrowscrollbox { + :root:not([uidensity="touch"]) #tabbrowser-arrowscrollbox { --scrollbtn-inner-padding: 1px; --scrollbtn-outer-padding: 3px; } @@ -522,7 +561,7 @@ padding-right: var(--scrollbtn-inner-padding, 4px) !important; } - :root:not([uidensity=touch]) #new-tab-button, #alltabs-button { + :root:not([uidensity="touch"]) #new-tab-button, #alltabs-button { --toolbarbutton-outer-padding: 1px; /* Original: 2px*/ } @@ -579,24 +618,24 @@ border-radius: var(--scrollbtn-border-radius, calc(var(--tab-border-radius) + 4px)) !important; } - :root[tabsintitlebar]:not([uidensity=compact]) #toolbar-menubar[autohide="true"] { + :root[tabsintitlebar]:not([uidensity="compact"]) #toolbar-menubar[autohide="true"] { height: calc(var(--tab-min-height) - var(--tabs-navbar-shadow-size) - 2px); /* Compact: 28px, Normal: 33px, Touch: 38px */ } /* Pinned Tab - Titlechanged Indicator position fix */ - :root:not([uidensity=touch]) .tabbrowser-tab:is([image], [pinned]) > .tab-stack > .tab-content[attention]:not([selected="true"]), - :root:not([uidensity=touch]) .tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) { + :root:not([uidensity="touch"]) .tabbrowser-tab:is([image], [pinned]) > .tab-stack > .tab-content[attention]:not([selected="true"]), + :root:not([uidensity="touch"]) .tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) { /* Original: center bottom calc(6.5px + var(--tabs-navbar-shadow-size)); */ background-position-y: bottom calc(4.5px + var(--tabs-navbar-shadow-size)) !important; } - :root[uidensity=compact] .tabbrowser-tab:is([image], [pinned]) > .tab-stack > .tab-content[attention]:not([selected="true"]), - :root[uidensity=compact] .tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) { + :root[uidensity="compact"] .tabbrowser-tab:is([image], [pinned]) > .tab-stack > .tab-content[attention]:not([selected="true"]), + :root[uidensity="compact"] .tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) { /* Original: center bottom calc(6.5px + var(--tabs-navbar-shadow-size)); */ background-position-y: bottom calc(.5px + var(--tabs-navbar-shadow-size)) !important; } /*= URL Bar - Reduce Padding ===============================================*/ - :root:not([uidensity=touch]) #urlbar-container, #search-container { + :root:not([uidensity="touch"]) #urlbar-container, #search-container { padding-block: 2px; /* Original: 4px */ margin-inline: 5px; /* Original: 5px */ } @@ -605,19 +644,19 @@ :root:not([uidensity]) .urlbarView-row { padding-block: 1px; /* Original: 2px */ } - :root[uidensity=compact] .urlbarView-row { + :root[uidensity="compact"] .urlbarView-row { padding-block: 0px; } :root:not([uidensity]) #urlbar .search-one-offs:not([hidden]) { padding-block: 8px; /* Original: 10px */ } - :root[uidensity=compact] #urlbar .search-one-offs:not([hidden]) { + :root[uidensity="compact"] #urlbar .search-one-offs:not([hidden]) { padding-block: 2px; } /*= BookMark Bar - Reduce Height ===========================================*/ - :root[uidensity=compact] #PersonalToolbar toolbarbutton { + :root[uidensity="compact"] #PersonalToolbar toolbarbutton { margin-top: 0px; /* Original: 2px */ } @@ -625,10 +664,10 @@ :root:not([uidensity]) #tab-notification-deck { --infobar-message-margin: 0 4px 3px; } - :root[uidensity=compact] #tab-notification-deck { + :root[uidensity="compact"] #tab-notification-deck { --infobar-message-margin: 0 4px 2px; } - #tab-notification-deck notification-message[message-bar-type="infobar"] { + #tab-notification-deck notification-message[message-bar-type="infobar"]:not([style*="margin-top"]) { margin: var(--infobar-message-margin, 0 4px 4px) !important; } @@ -636,7 +675,7 @@ --infobar-vertical-margin: 7px; --infobar-button-vertical-margin: 3px; } - :root[uidensity=compact] notification-message[message-bar-type="infobar"] { + :root[uidensity="compact"] notification-message[message-bar-type="infobar"] { --infobar-vertical-margin: 6px; --infobar-button-vertical-margin: 2px; } @@ -671,10 +710,10 @@ :root { --menu-padding: 0.35em; /* Win7, 8: 0px */ } - :root[uidensity=compact] { + :root[uidensity="compact"] { --menu-padding: 0.25em; } - :root[uidensity=touch] { + :root[uidensity="touch"] { --menu-padding: 0.5em; } menupopup > menuitem, @@ -687,26 +726,23 @@ } @supports not -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { - :root:not([uidensity=touch]) .menu-text, .menu-iconic-text { + :root:not([uidensity="touch"]) .menu-text, + :root:not([uidensity="touch"]) .menu-iconic-text { padding-inline-end: 0 !important; /* Original: 2px */ } - :root:not([uidensity=touch]) .menupopup-arrowscrollbox { + :root:not([uidensity="touch"]) .menupopup-arrowscrollbox { padding-block: 1px !important; /* Original: 4px*/ } - :root:not([uidensity=touch]) #context-navigation:not([hidden]) { + :root:not([uidensity="touch"]) #context-navigation:not([hidden]) { padding: 0 0 1px !important; /* Original: 0 0 4px*/ } - :root:not([uidensity=touch]) .menu-right { + :root:not([uidensity="touch"]) .menu-right { margin-right: 6px !important; /* Original: 12px */ } } /* Arrow Icon Align to Right */ - .subviewbutton.subviewbutton-nav, - .bookmark-item.subviewbutton { - padding-inline-end: 0 !important; - } - .bookmark-item.subviewbutton { + .bookmark-item.subviewbutton > .menu-right { margin-inline-end: 0 !important; } @@ -715,8 +751,8 @@ --bookmark-menu-padding: 0.2em; --bookmark-seperator-margin: 1px 0.5em; } - :root[uidensity=compact] { - --bookmark-menu-padding: 2px; + :root[uidensity="compact"] { + --bookmark-menu-padding: 1px; --bookmark-seperator-margin: 0px 0.5em; } @@ -747,41 +783,40 @@ /** Popup panel - Compact mode */ /* Footer Button Height */ - :root[uidensity=compact] .panel-footer.panel-footer-menulike > button { + :root[uidensity="compact"] .panel-footer.panel-footer-menulike > button { padding: 3px 8px !important; } /* Footer Button Height */ - :root[uidensity=compact] #protections-popup-trackersView-settings-button { + :root[uidensity="compact"] #protections-popup-trackersView-settings-button { margin: 4px 8px 0 !important; } /* not cut off for Protection popup Footer on windows */ - :root[uidensity=compact] #protections-popup-multiView #protections-popup-footer { + :root[uidensity="compact"] #protections-popup-multiView #protections-popup-footer { padding: 3px 0 20px !important; } /* Button and disabed category in Protection popup */ - :root[uidensity=compact] #protections-popup-multiView .protections-popup-footer-button, - :root[uidensity=compact] #protections-popup-multiView .protections-popup-category { + :root[uidensity="compact"] #protections-popup-multiView .protections-popup-footer-button, + :root[uidensity="compact"] #protections-popup-multiView .protections-popup-category { height: 20px !important; min-height: 20px !important; } /* Footer Button in Tracking Content Panel */ - :root[uidensity=compact] #protections-popup-multiView .panel-footer.panel-footer-menulike { + :root[uidensity="compact"] #protections-popup-multiView .panel-footer.panel-footer-menulike { margin: 0 0 3px !important; } /* Identity popup header padding */ - :root[uidensity=compact] #identity-popup-multiView #identity-popup-mainView-panel-header { + :root[uidensity="compact"] #identity-popup-multiView #identity-popup-mainView-panel-header { padding: 2px 5px !important; } /* Text When There is no trackers */ - :root[uidensity=compact] #protections-popup-no-trackers-found-description { + :root[uidensity="compact"] #protections-popup-no-trackers-found-description { margin: 2em 4em !important; } /* Download Item margin */ - :root[uidensity=compact] #downloadsListBox { + :root[uidensity="compact"] #downloadsListBox { margin: 0 !important; } - /** Tab Bar - Connect to window *********************************************/ .tab-background { border-radius: var(--tab-border-radius) var(--tab-border-radius) 0px 0px !important; @@ -849,6 +884,7 @@ border-radius: var(--tab-border-radius, 4px) var(--tab-border-radius, 4px) 0 0 !important; } +<<<<<<< HEAD .tabbrowser-tab:is([selected], [multiselected]) .tab-context-line { /* Photon like color Default: var(--tab-line-color, rgb(10, 132, 255)) @@ -871,6 +907,64 @@ } .tabbrowser-tab:not([selected="true"], [multiselected]) .tab-context-line { transition: transform 250ms var(--animation-easing-function), opacity 250ms var(--animation-easing-function) !important; /* --animation-easing-function: cubic-bezier(.07, .95, 0, 1); */ +======= + /** Selected Tab - Bottom Rounded Corner ************************************/ + #tabbrowser-tabs { + --tab-corner-rounding: 4px; /* 10px looks about like chromium - 17px looks close to Australis tabs */ + --tab-corner-padding: 1px; + --tab-corner-position: calc(var(--tab-corner-padding) - var(--tab-corner-rounding)); + } + + :root:not([customizing="true"]) tab[visuallyselected] > stack::before, + :root:not([customizing="true"]) tab[visuallyselected] > stack::after { + /* Box */ + display: block !important; + position: absolute !important; + z-index: 1 !important; + + /* Shape */ + width: var(--tab-corner-rounding) !important; + height: 100% !important; + + /* Color */ + fill: var(--toolbar-bgcolor) !important; + stroke: var(--tabs-border-color, transparent) !important; + -moz-context-properties: fill, stroke !important; + + /* Image */ + background-size: var(--tab-corner-rounding); + background-repeat: no-repeat; + background-position-y: bottom; + } + + tab[visuallyselected] > stack::before { + left: var(--tab-corner-position) !important; + background-image: url(./icons/tab-bottom-corner-left.svg); + } + tab[visuallyselected] > stack::after { + left: auto; + right: var(--tab-corner-position); + background-image: url(./icons/tab-bottom-corner-right.svg); + } + + @media (-moz-gtk-csd-available) { + /* Don't enabled at GTK */ + :root:not([customizing="true"])[lwtheme="true"] tab[visuallyselected] > stack::before, + :root:not([customizing="true"])[lwtheme="true"] tab[visuallyselected] > stack::after { + content: "" !important; + } + } + @media not all and (-moz-gtk-csd-available) { + :root:not([customizing="true"]) tab[visuallyselected] > stack::before, + :root:not([customizing="true"]) tab[visuallyselected] > stack::after { + content: "" !important; + } + } + + /** Unselected Tab - Divide line ********************************************/ + #tabbrowser-arrowscrollbox { + position: absolute; +>>>>>>> master } /* Remove side's background color border */ @@ -944,17 +1038,17 @@ } /** Clipped tabs - Letters cleary *******************************************/ - #tabbrowser-tabs[closebuttons=activetab] .tab-content:not([pinned]) { + #tabbrowser-tabs[closebuttons="activetab"] .tab-content:not([pinned]) { padding-inline-start: 8px !important; } - #tabbrowser-tabs[closebuttons=activetab] .tab-label-container[textoverflow][labeldirection="ltr"]:not([pinned]), - #tabbrowser-tabs[closebuttons=activetab] .tab-label-container[textoverflow]:not([labeldirection]):-moz-locale-dir(ltr):not([pinned]) { + #tabbrowser-tabs[closebuttons="activetab"] .tab-label-container[textoverflow][labeldirection="ltr"]:not([pinned]), + #tabbrowser-tabs[closebuttons="activetab"] .tab-label-container[textoverflow]:not([labeldirection]):-moz-locale-dir(ltr):not([pinned]) { mask-image: linear-gradient(to right, black 70%, transparent) !important; } - #tabbrowser-tabs[closebuttons=activetab] .tab-label-container[textoverflow][labeldirection="rtl"]:not([pinned]), - #tabbrowser-tabs[closebuttons=activetab] .tab-label-container[textoverflow]:not([labeldirection]):-moz-locale-dir(rtl):not([pinned]) { + #tabbrowser-tabs[closebuttons="activetab"] .tab-label-container[textoverflow][labeldirection="rtl"]:not([pinned]), + #tabbrowser-tabs[closebuttons="activetab"] .tab-label-container[textoverflow]:not([labeldirection]):-moz-locale-dir(rtl):not([pinned]) { mask-image: linear-gradient(to left, black 70%, transparent) !important; } @@ -963,10 +1057,36 @@ display: -moz-inline-box !important; } - #tabbrowser-tabs[closebuttons=activetab] .tabbrowser-tab:not([visuallyselected], :hover) .tab-close-button { + #tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:not([visuallyselected], :hover) .tab-close-button { visibility: collapse !important; } + /* Closed Button's icon thicker */ + .tabbrowser-tab .tab-content > .close-icon { + list-style-image: url(./icons/dismiss-filled.svg) !important; + } + + /* Closed Button's icon larger */ + .tab-close-button { + padding: 6px !important; /* Original: 7px */ + } + .tabbrowser-tab:not(:hover) > .tab-stack > .tab-content > .tab-close-button { + padding-inline-start: 1px !important; /* Original: 0px */ + width: 19px !important; /* Original: 17px */ + } + + /* Closed Button's padding reduce */ + #tabbrowser-tabs[closebuttons="activetab"] .tab-content > .tab-close-button { + margin-inline-end: calc((var(--inline-tab-padding) / -2) + 2px) !important; /* Original: calc(var(--inline-tab-padding) / -2)*/ + padding: 4px !important; /* Original: 7px */ + width: 20px !important; /* Original: 24px */ + height: 20px !important; /* Original: 24px */ + } + #tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:not(:hover) > .tab-stack > .tab-content > .tab-close-button { + padding-inline-start: 3px !important; /* Original: 0px */ + width: 19px !important; /* Redefine from 19px !important, Original: 17px = (width - padding) */ + } + /** Sound Tab - Hide Label **************************************************/ .tab-secondary-label:is([soundplaying], [muted], [activemedia-blocked], [pictureinpicture]){ display: none !important; @@ -1133,8 +1253,8 @@ background-image: var(--dotted-identity-image), var(--dotted-identity-image), var(--dotted-identity-image) !important; background-position-x: 32%, 50%, 70% !important; } - :root[uidensity=compact] .tabbrowser-tab:is([image], [pinned])[usercontextid] > .tab-stack > .tab-content[attention]:not([selected="true"]), - :root[uidensity=compact] .tabbrowser-tab[usercontextid] > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) { + :root[uidensity="compact"] .tabbrowser-tab:is([image], [pinned])[usercontextid] > .tab-stack > .tab-content[attention]:not([selected="true"]), + :root[uidensity="compact"] .tabbrowser-tab[usercontextid] > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) { /* Original: radial-gradient(circle, var(--attention-icon-color), var(--attention-icon-color) 2px, transparent 2px); */ background-position-x: 30%, 50%, 70% !important; } @@ -1144,8 +1264,8 @@ .tabbrowser-tab[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) { background-position-x: calc(32% - 1px), calc(50% - 1px), calc(70% - 1px) !important; } - :root[uidensity=compact] .tabbrowser-tab:is([image], [pinned])[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) > .tab-stack > .tab-content[attention]:not([selected="true"]), - :root[uidensity=compact] .tabbrowser-tab[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) { + :root[uidensity="compact"] .tabbrowser-tab:is([image], [pinned])[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) > .tab-stack > .tab-content[attention]:not([selected="true"]), + :root[uidensity="compact"] .tabbrowser-tab[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) { background-position-x: calc(30% - 1px), calc(50% - 1px), calc(70% - 1px) !important; } @@ -1190,8 +1310,8 @@ .toolbaritem-combined-buttons > .subviewbutton:not(.subviewbutton-iconic) > .toolbarbutton-text { padding-inline-start: 0 !important; } - #panelMenu_bookmarksMenu .subviewbutton[disabled=true] .toolbarbutton-text, - #appMenu_historyMenu .subviewbutton[disabled=true] .toolbarbutton-text { + #panelMenu_bookmarksMenu .subviewbutton[disabled="true"] .toolbarbutton-text, + #appMenu_historyMenu .subviewbutton[disabled="true"] .toolbarbutton-text { padding-inline-start: var(--arrowpanel-menublank-padding) !important; } #appMenu-proton-update-banner .toolbarbutton-text { @@ -1202,8 +1322,8 @@ #appMenu-proton-update-banner::before { display: -moz-inline-box; margin-inline-end: var(--arrowpanel-menuicon-padding); - width: 16px !important; - height: 16px !important; + width: 16px; + height: 16px; } #appMenu-proton-update-banner { margin-bottom: 2px !important; @@ -1221,7 +1341,7 @@ margin-inline-end: 0 !important; } - .subviewbutton[type="checkbox"]:not([checked=true]) > .toolbarbutton-text { + .subviewbutton[type="checkbox"]:not([checked="true"]) > .toolbarbutton-text { margin-left: 16px !important; } @@ -1243,7 +1363,7 @@ stroke: var(--button-hover-bgcolor) !important; } - .subviewbutton[disabled=true] > image { + .subviewbutton[disabled="true"] > image { /* Ghost icons when disabled */ opacity: 0.4; } @@ -1261,10 +1381,10 @@ #appMenu-fxa-status2::before { /* Don't exist img tag */ content: url(chrome://browser/skin/fxa/avatar-empty.svg); } - #appMenu-fxa-status2:is([fxastatus=signedin], [fxastatus=unverified], [fxastatus=login-failed])::before { + #appMenu-fxa-status2:is([fxastatus="signedin"], [fxastatus="unverified"], [fxastatus="login-failed"])::before { display: none; } - #appMenu-fxa-status2:is([fxastatus=signedin], [fxastatus=unverified], [fxastatus=login-failed]) #appMenu-fxa-label2::before { + #appMenu-fxa-status2:is([fxastatus="signedin"], [fxastatus="unverified"], [fxastatus="login-failed"]) #appMenu-fxa-label2::before { /* url("https://profile.accounts.firefox.com/v1/avatar/a") */ content: ''; border-radius: 50% !important; @@ -1321,8 +1441,14 @@ } /* Default */ - #fxa-menu-avatar { - display: -moz-inline-box !important; + #fxa-manage-account-button::before { + content: ''; + display: -moz-inline-box; + width: 32px !important; + height: 32px !important; + border-radius: 50%; + background-size: 32px; + background-image: var(--avatar-image-url); margin-inline-end: var(--arrowpanel-menuicon-padding); } @@ -1368,10 +1494,12 @@ #PanelUI-sign-out-separator { display: none; } - .pageAction-sendToDevice-device.subviewbutton.sync-menuitem.sendtab-target[clientType=""] { + .pageAction-sendToDevice-device.subviewbutton.sync-menuitem.sendtab-target[clientType=""], /* Legacy */ + .sendToDevice-device.subviewbutton.sync-menuitem.sendtab-target[clientType=""] { list-style-image: url(./icons/send-to-device.svg); } - .pageAction-sendToDevice-device.subviewbutton.sync-menuitem.sendtab-target:not([clientType]) { + .pageAction-sendToDevice-device.subviewbutton.sync-menuitem.sendtab-target:not([clientType]), /* Legacy */ + .sendToDevice-device.subviewbutton.sync-menuitem.sendtab-target:not([clientType]) { list-style-image: url(chrome://global/skin/icons/settings.svg); } @@ -1535,6 +1663,24 @@ --menuitem-image: url(chrome://browser/skin/bookmarks-toolbar.svg); } + /*= identity-popup =========================================================*/ + #identity-popup-clear-sitedata-button, + #identity-popup-more-info { + padding-inline: 5px !important; + } + + #identity-popup-securityView-body { + margin-inline-start: 32px !important; /* Original: 10px */ + } + + #identity-popup-clear-sitedata-button { + list-style-image: url(./icons/broom.svg); + } + + #identity-popup-more-info { + list-style-image: url(chrome://global/skin/icons/info.svg); + } + /** Context Menu - Icons ****************************************************/ /*= Layout =================================================================*/ menupopup menuitem:not([type="checkbox"], [type="radio"]), @@ -1605,7 +1751,6 @@ :root { --context-menu-background-padding: 1em; --menu-background-padding-default: calc(var(--context-menu-background-padding) + var(--context-menu-text-padding)); - --bookmark-menu-margin: 2px; } :not(menu, #ContentSelectDropdown, #context-navigation) > menupopup > menuitem:not(.menuitem-iconic, [type="checkbox"], [checked="true"], .in-menulist), @@ -1614,10 +1759,11 @@ padding-inline-start: var(--menu-background-padding-default) !important; margin-left: 0 !important; } - menupopup:is(#BMB_bookmarksPopup) > menuitem:not(.menuitem-iconic), - menupopup:is(#BMB_bookmarksPopup) > menu:not(.menu-iconic) { - padding-inline-start: calc(var(--menu-background-padding-default) - var(--bookmark-menu-margin)) !important; - margin-left: var(--bookmark-menu-margin) !important; + menupopup:is(#BMB_bookmarksPopup, [placespopup="true"]) > menuitem:not(.menuitem-iconic, [disabled="true"]), + menupopup:is(#BMB_bookmarksPopup, [placespopup="true"]) > menu:not(.menu-iconic) { + margin-inline: var(--arrowpanel-menuicon-padding) !important; + padding-inline-start: calc(var(--menu-background-padding-default) - var(--arrowpanel-menuicon-padding)) !important; + background-position: left calc(var(--arrowpanel-menuitem-padding) + 1px) center !important; } } @@ -1655,7 +1801,7 @@ #context_reloadTab, #context_reloadSelectedTabs { - --menuitem-image: url(chrome://browser/skin/reload.svg); + /* --menuitem-image: url("chrome://global/skin/icons/reload.svg"); */ } #context_toggleMuteTab, #context_toggleMuteSelectedTabs { @@ -1688,7 +1834,9 @@ #context_sendTabToDevice { --menuitem-image: url(./icons/send-to-device.svg); } - #context_shareTabURL { /* At windows */ + + #context_sendTabToDevice:is([disabled="true"]) + #context_shareTabURL, /* Legacy */ + #context_sendTabToDevice:is([disabled="true"]) + menuitem.share-tab-url-item { /* At windows */ --menuitem-image: url(./icons/share.svg); } #context_reopenInContainer { @@ -2112,7 +2260,8 @@ --menuitem-image: url(chrome://browser/skin/bookmark-star-on-tray.svg); } - menupopup[context="placesContext"] > .openintabs-menuitem { + menupopup[context="placesContext"] > .openintabs-menuitem, + menuitem.openintabs-menuitem.subviewbutton { --menuitem-image: url(./icons/movetowindow-16.svg); } diff --git a/userContent.css b/userContent.css index fec4d99..01591a1 100644 --- a/userContent.css +++ b/userContent.css @@ -274,8 +274,6 @@ --card-outline-color: var(--grey-60); --dialog-warning-text-color: var(--red-40); - - scrollbar-color: rgba(249,249,250,.4) rgba(20,20,25,.3); } /*= Addons.org =============================================================*/ @@ -311,8 +309,10 @@ color: var(--in-content-text-color) !important; } .AutoSearchInput-suggestions-item:is(:active, :focus, :hover), + .AutoSearchInput-suggestions-item--highlighted, .SecondaryHero-message-link, .SecondaryHero-module-link, + .Card-contents a:not(.Button), .Card-footer-link a, .Card-shelf-footer-in-header a, .SearchResult-link:is(:active, :focus, :hover), @@ -493,10 +493,12 @@ --color-inverse-bg: var(--in-content-page-color) !important; --color-inverse: var(--in-content-page-background) !important; --color-text: var(--in-content-page-color) !important; + --color-moz-text: var(--in-content-page-color) !important; + --color-moz-heading: var(--in-content-page-color) !important; --color-text-light: var(--in-content-deemphasized-text) !important; --color-link: var(--in-content-link-color) !important; - --color-success: var(--green-60) !important; - --color-warning: var(--yellow-60) !important; + --color-success: var(--green-70) !important; + --color-warning: var(--yellow-70) !important; --color-error: var(--red-60) !important; --color-error-hover: var(--red-50) !important; --color-moz-heading: #fff; @@ -553,7 +555,7 @@ .sumo-nav--logo, .sumo-nav--search-button, .sumo-nav--toggle-button, - .card--icon-sm, + .card:not(.is-inverse) .card--icon-sm, .mzp-c-menu-item-icon, .mzp-c-menu-button-close, .topic-article--icon, @@ -562,6 +564,13 @@ } /* Others */ + .support-callouts > .card.is-inverse { + background: #20133a !important; + } + .support-callouts > .card.is-inverse :is(h1, h2, h3, h4, h5, h6, li, p) { + color: var(--in-content-page-color) !important; + } + .sumo-button.secondary-button { border-color: none !important; } @@ -610,6 +619,7 @@ .cta-neutral:hover { color: var(--in-content-page-color) !important; } + #main-content.panel a, .links a, .link-blue, .text-blue-500 { @@ -618,6 +628,12 @@ .link-blue:hover { color: var(--in-content-link-color-hover) !important; } + + .signed-in-email-message, + .verification-email-message, + .verification-message, + .verification-recovery-code-message, + .verification-totp-message, .input-row input[type="email"], .input-row input[type="number"], .input-row input[type="password"], @@ -637,13 +653,13 @@ background-color: unset !important; } #main-content, + .modal, .firefox-family-services, .input-row input[type="email"], .input-row input[type="number"], .input-row input[type="password"], .input-row input[type="tel"], .input-row input[type="text"], - .password-row .show-password-label, header, .bg-white:not(nav) { background: var(--in-content-box-background) !important;