Firefox-UI-Fix/src/icons/_panel.scss

564 lines
18 KiB
SCSS

/*= Panel - Main =============================================================*/
#appMenu-proton-addon-banners > .addon-banner-item > .toolbarbutton-icon {
@include InlineBox(true);
margin-inline-start: var(--arrowpanel-menuicon-padding);
@include BoxOrder(0, true);
}
#appMenu-proton-update-banner::before {
content: url("../icons/whatsnew.svg");
}
#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 {
display: none;
}
#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;
background-size: 16px !important;
background-image: var(--avatar-image-url) !important;
}
#new-tab-button {
list-style-image: var(--uc-new-tab-icon) !important;
}
@include Option("userChrome.icon.panel_full", "userChrome.icon.panel_photon") {
#appMenu-new-tab-button2 {
list-style-image: var(--uc-new-tab-icon);
}
}
@include Option("userChrome.icon.panel_photon") {
#appMenu-save-file-button2,
#appMenu-find-button2,
#appMenu-more-button2 {
padding-top: var(--arrowpanel-menuitemblank-padding) !important;
padding-bottom: var(--arrowpanel-menuitemblank-padding) !important;
}
#appMenu-zoom-controls2, /* Legacy v104 */
#appMenu-zoom-controls {
padding-inline-start: var(--arrowpanel-menuimageblank-padding-horizontal) !important;
}
}
@include NotOption("userChrome.icon.panel_photon") {
@include NotOption("userChrome.icon.panel_full") {
#appMenu-new-tab-button2, /* Separate */
#appMenu-passwords-button, /* Separate */
#appMenu-extensions-themes-button,
#appMenu-save-file-button2, /* Separate */
#appMenu-find-button2,
#appMenu-more-button2, /* Separate */
#appMenu-help-button2,
#appMenu-quit-button2 /* Separate */ {
padding-top: var(--arrowpanel-menuitemblank-padding-block) !important;
padding-bottom: var(--arrowpanel-menuitemblank-padding-block) !important;
}
#appMenu-zoom-controls2, /* Legacy v104 */
#appMenu-zoom-controls {
padding-inline-start: var(--arrowpanel-menuimageblank-padding-horizontal) !important;
}
}
}
#appMenu-new-window-button2 {
list-style-image: url("chrome://browser/skin/window.svg");
}
#appMenu-new-private-window-button2 {
list-style-image: url("chrome://browser/skin/privateBrowsing.svg");
}
#appMenu-bookmarks-button {
list-style-image: url("chrome://browser/skin/bookmark.svg");
}
#appMenu-history-button {
list-style-image: url("chrome://browser/skin/history.svg");
}
#appMenu-downloads-button {
list-style-image: url("chrome://browser/skin/downloads/downloads.svg");
}
@include Option("userChrome.icon.panel_full", "userChrome.icon.panel_photon") {
#appMenu-passwords-button {
list-style-image: url("chrome://browser/skin/login.svg");
}
#appMenu-extensions-themes-button {
list-style-image: url("chrome://mozapps/skin/extensions/extension.svg");
}
}
#appMenu-print-button2 {
list-style-image: url("chrome://global/skin/icons/print.svg");
}
@include Option("userChrome.icon.panel_full") {
#appMenu-save-file-button2 {
list-style-image: url("../icons/toolbarButton-download.svg");
}
#appMenu-find-button2 {
list-style-image: url("chrome://global/skin/icons/search-glass.svg");
}
#appMenu-translate-button {
list-style-image: url("../icons/translations.svg");
}
#appMenu-zoom-controls2::before, /* Legacy v104 */
#appMenu-zoom-controls::before {
content: url("../icons/screenshot.svg");
}
}
#save-page-button {
// #496 #553
list-style-image: url("../icons/toolbarButton-download.svg") !important;
}
#open-file-button {
// #775
list-style-image: url("../icons/toolbarButton-upload.svg") !important;
}
#cut-button {
list-style-image: url("../icons/edit-cut.svg") !important;
}
#copy-button {
list-style-image: url("../icons/edit-copy.svg") !important;
}
#paste-button {
list-style-image: url("../icons/edit-paste.svg") !important;
}
#characterencoding-button {
list-style-image: url("../icons/characterEncoding.svg") !important;
}
#screenshot-button {
list-style-image: url("../icons/screenshot-1.svg") !important;
}
#email-link-button {
list-style-image: url("../icons/mail.svg") !important;
}
#panic-button {
list-style-image: url("../icons/forget.svg") !important;
}
#profiler-button-button > .toolbarbutton-icon {
list-style-image: url("../icons/performance.svg") !important;
}
#developer-button {
list-style-image: url("../icons/wrench-filled.svg") !important;
}
#appMenu-settings-button {
list-style-image: url("chrome://global/skin/icons/settings.svg");
}
@include Option("userChrome.icon.panel_full") {
#appMenu-more-button2 {
list-style-image: url("../icons/ion.svg");
}
}
@include Option("userChrome.icon.panel_full", "userChrome.icon.panel_photon") {
#appMenu-help-button2 {
list-style-image: url("chrome://global/skin/icons/help.svg");
}
#appMenu-quit-button2 {
list-style-image: url("../icons/quit.svg");
}
}
/*= Panel - Account ==========================================================*/
#PanelUI-fxa-menu-connect-device-button .toolbarbutton-icon,
#PanelUI-fxa-menu-account-signout-button .toolbarbutton-icon {
width: 16px !important;
height: 16px !important;
}
/* Default */
#fxa-manage-account-button::before {
content: "";
@include InlineBox;
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);
@include Option("userChrome.icon.account_image_to_right") {
@include BoxOrder(2, true);
}
}
@include Option("userChrome.icon.account_label_to_right") {
#fxa-menu-header-title, #fxa-menu-header-description {
text-align: right;
}
}
.syncNowBtn {
visibility: visible !important;
@include BoxOrder(0, true);
margin-inline-end: var(--arrowpanel-menuicon-padding);
}
#PanelUI-fxa-menu-setup-sync-button {
list-style-image: url("chrome://browser/skin/sync.svg");
}
#PanelUI-fxa-menu-connect-device-button {
list-style-image: url("../icons/add-device.svg");
}
#PanelUI-fxa-menu-sendtab-button {
list-style-image: url("../icons/send-to-device.svg");
}
#PanelUI-fxa-menu-sync-prefs-button {
list-style-image: url("chrome://global/skin/icons/settings.svg");
}
#PanelUI-fxa-menu-account-signout-button {
list-style-image: url("../icons/sign-out.svg");
}
#PanelUI-remotetabs-view-managedevices::before {
/* Box */
content: "";
padding-inline-end: 16px;
padding-block: 1px;
margin-inline-end: var(--arrowpanel-menuicon-padding);
/* Color */
fill: currentColor;
fill-opacity: var(--toolbarbutton-icon-fill-opacity);
-moz-context-properties: fill, fill-opacity, stroke;
background-size: 16px;
background-repeat: no-repeat;
background-position: left center;
background-image: url("chrome://global/skin/icons/settings.svg");
}
.PanelUI-remotetabs-notabsforclient-label {
margin-inline-start: calc(var(--arrowpanel-menuicon-padding) + var(--arrowpanel-menuitem-padding-inline)) !important;
padding-inline-start: var(--arrowpanel-menublank-padding) !important;
}
/* Change Separator */
#PanelUI-fxa-menu::before {
content: "";
@include Box;
border-bottom: 1px solid var(--panel-separator-color);
margin: var(--panel-separator-margin);
padding: 0;
}
#PanelUI-fxa-menu > :first-child {
@include BoxOrder(0);
}
#PanelUI-sign-out-separator {
display: none;
}
.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]), /* Legacy */
.sendToDevice-device.subviewbutton.sync-menuitem.sendtab-target:not([clientType]) {
list-style-image: url("chrome://global/skin/icons/settings.svg");
}
/*= Panel - Bookmark =========================================================*/
#panelMenuBookmarkThisPage {
list-style-image: url("chrome://browser/skin/bookmark-hollow.svg");
}
panelMenuBookmarkThisPage[starred] {
list-style-image: url("chrome://browser/skin/bookmark.svg");
}
#panelMenu_searchBookmarks {
list-style-image: url("chrome://global/skin/icons/search-glass.svg");
}
#panelMenu_viewBookmarksToolbar {
list-style-image: url("../icons/bookmarks-toolbar-alt.svg");
}
#panelMenu_showAllBookmarks {
list-style-image: url("chrome://browser/skin/bookmark-star-on-tray.svg");
}
/*= Panel - History ==========================================================*/
#appMenuRecentlyClosedTabs {
list-style-image: var(--uc-tab-icon);
}
#appMenuRecentlyClosedWindows {
list-style-image: url("chrome://browser/skin/window.svg");
}
#appMenuSearchHistory {
list-style-image: url("chrome://global/skin/icons/search-glass.svg");
}
#appMenuRestoreSession, /* Legacy - v103 */
#appMenu-restoreSession {
list-style-image: url("../icons/restore-session.svg");
}
#appMenuClearRecentHistory {
list-style-image: url("../icons/forget.svg");
}
#PanelUI-historyMore {
list-style-image: url("chrome://browser/skin/history.svg");
}
#appMenu-library-recentlyClosedTabs {
list-style-image: url("../icons/movetowindow-16.svg");
}
#appMenu-library-recentlyClosedWindows {
list-style-image: url("../icons/restore-session.svg");
}
/*= Panel - More tools =======================================================*/
#appmenu-moreTools-button {
list-style-image: url("chrome://browser/skin/customize.svg");
}
/* Web Developer Tools */
#appmenu-developer-tools-view .subviewbutton:nth-child(1),
#PanelUI-developer-tools-view .subviewbutton:nth-child(1) {
list-style-image: url("../icons/developer.svg");
}
/* Task Manager */
#appmenu-developer-tools-view .subviewbutton:nth-child(2),
#PanelUI-developer-tools-view .subviewbutton:nth-child(2) {
list-style-image: url("../icons/performance.svg");
}
/* Remote Debugging - Edge bug.svg */
#appmenu-developer-tools-view .subviewbutton:nth-child(3),
#PanelUI-developer-tools-view .subviewbutton:nth-child(3) {
list-style-image: url("../icons/bug.svg");
}
/* Browser Toolbox - Edge webdeveloper.svg */
#appmenu-developer-tools-view .subviewbutton:nth-child(4),
#PanelUI-developer-tools-view .subviewbutton:nth-child(4) {
list-style-image: url("../icons/window-dev-tools.svg");
}
/* Browser Content Toolbox */
#appmenu-developer-tools-view .subviewbutton:nth-child(5),
#PanelUI-developer-tools-view .subviewbutton:nth-child(5) {
list-style-image: url("../icons/command-frames.svg");
}
/* Browser Console */
#appmenu-developer-tools-view .subviewbutton:nth-last-child(5),
#PanelUI-developer-tools-view .subviewbutton:nth-last-child(5) {
list-style-image: url("../icons/command-console.svg");
}
/* Responsive Design Mode */
#appmenu-developer-tools-view .subviewbutton:nth-last-child(4),
#PanelUI-developer-tools-view .subviewbutton:nth-last-child(4) {
list-style-image: url("../icons/command-responsivemode.svg");
}
/* Eyedropper */
#appmenu-developer-tools-view .subviewbutton:nth-last-child(3),
#PanelUI-developer-tools-view .subviewbutton:nth-last-child(3) {
list-style-image: url("../icons/command-eyedropper.svg");
}
/* Page Source - Edge file-search.svg */
#appmenu-developer-tools-view .subviewbutton:nth-last-child(2),
#PanelUI-developer-tools-view .subviewbutton:nth-last-child(2) {
list-style-image: url("../icons/document-search.svg");
}
/* Extensions for Devel */
#appmenu-developer-tools-view .subviewbutton:nth-last-child(1),
#PanelUI-developer-tools-view .subviewbutton:nth-last-child(1) {
list-style-image: url("chrome://mozapps/skin/extensions/extension.svg");
}
#appmenu-developer-tools-view .subviewbutton:last-child {
margin-bottom: 6px !important;
}
/*= Panel - Help =============================================================*/
#appMenu_menu_openHelp {
list-style-image: url("chrome://global/skin/icons/help.svg");
}
#appMenu_feedbackPage {
list-style-image: url("../icons/send.svg");
}
#appMenu_helpSafeMode {
list-style-image: url("chrome://devtools/skin/images/debugging-workers.svg");
}
#appMenu_troubleShooting {
list-style-image: url("chrome://global/skin/icons/more.svg");
}
#appMenu-report-broken-site-button,
#appMenu_help_reportSiteIssue {
list-style-image: url("chrome://global/skin/icons/lightbulb.svg");
}
#appMenu_menu_HelpPopup_reportPhishingtoolmenu {
list-style-image: url("chrome://global/skin/icons/warning.svg");
}
#appMenu_helpSwitchDevice {
list-style-image: url("../icons/add-device.svg");
}
#appMenu_aboutName {
list-style-image: url("chrome://global/skin/icons/info.svg");
}
/*= Panel - Library ==========================================================*/
#appMenu-library-bookmarks-button {
list-style-image: url("chrome://browser/skin/bookmark.svg");
}
#appMenu-library-history-button {
list-style-image: url("chrome://browser/skin/history.svg");
}
#appMenu-library-downloads-button {
list-style-image: url("chrome://browser/skin/downloads/downloads.svg");
}
/*= Panel - Downloads ========================================================*/
#downloadsHistory {
list-style-image: url("chrome://browser/skin/downloads/downloads.svg");
}
#downloadsHistory .box-inherit.button-box {
@include InlineBox(true);
}
/*= Toolbar - Overflow Menu ==================================================*/
#overflowMenu-customize-button {
list-style-image: url("chrome://browser/skin/customize.svg");
}
/*= Tabbar - All Tab Menu ====================================================*/
#allTabsMenu-undoCloseTab {
list-style-image: url("../icons/undo.svg");
}
#allTabsMenu-searchTabs {
list-style-image: url("chrome://global/skin/icons/search-glass.svg");
}
#allTabsMenu-containerTabsButton {
list-style-image: url("../icons/container-openin-16.svg");
}
#allTabsMenu-hiddenTabsButton {
list-style-image: url("../icons/eye-hide.svg")
}
#allTabsMenu-containerTabsView .subviewbutton:last-child {
list-style-image: url("chrome://global/skin/icons/settings.svg");
}
/*= BMB_bookmarksPopup =======================================================*/
#BMB_viewBookmarksSidebar {
--menuitem-image: var(--uc-sidebar-icon);
&[data-l10n-args='{"isVisible":true}'] {
--menuitem-image: url("chrome://global/skin/icons/close.svg");
}
}
#BMB_searchBookmarks {
--menuitem-image: url("chrome://global/skin/icons/search-glass.svg");
}
#BMB_bookmarksShowAllTop,
#BMB_bookmarksShowAll {
--menuitem-image: url("chrome://browser/skin/bookmark-star-on-tray.svg");
}
#BMB_bookmarksToolbar {
--menuitem-image: url("../icons/bookmarks-toolbar-alt.svg");
}
@include OS($mac) {
#BMB_bookmarksShowAllTop {
list-style-image: url("chrome://browser/skin/bookmark-star-on-tray.svg") !important;
}
#BMB_bookmarksShowAllTop > .menu-iconic-left {
@include Box(true);
}
}
/* BMB_bookmarksToolbarPopup */
#BMB_viewBookmarksToolbar {
&[data-l10n-args='{"isVisible":true}'] {
--menuitem-image: url("../icons/eye-hide.svg")
}
&[data-l10n-args='{"isVisible":false}'] {
--menuitem-image: url("../icons/eye-show.svg")
}
}
/*= protections-popup ========================================================*/
#protections-popup-settings-button > .protections-popup-settings-icon,
#protections-popup-show-report-button > .protections-popup-show-report-icon {
-moz-context-properties: fill, fill-opacity, stroke;
fill: currentColor;
margin-inline-end: 1em;
}
#protections-popup-settings-button > .protections-popup-settings-icon,
#protections-popup-multiView .panel-subview-footer-button {
list-style-image: url("chrome://global/skin/icons/settings.svg");
}
#protections-popup-show-report-button > .protections-popup-show-report-icon {
/* chrome://browser/skin/controlcenter/dashboard.svg */
list-style-image: url("../icons/dashboard.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");
}
/*= sidebarMenu-popup ========================================================*/
@mixin _subviewMenuitem($icon, $selector: null) {
&.subviewbutton#{$selector} {
list-style-image: $icon;
}
&:is(menuitem)#{$selector} {
--menuitem-image: #{$icon};
}
}
#identity-popup-more-info {
@include _subviewMenuitem(url("chrome://global/skin/icons/info.svg"));
}
#sidebar-switcher-bookmarks {
@include _subviewMenuitem(url("chrome://browser/skin/bookmark.svg"));
}
#sidebar-switcher-history {
@include _subviewMenuitem(url("chrome://browser/skin/history.svg"));
}
#sidebar-switcher-tabs {
@include _subviewMenuitem(url("../icons/synced-tabs.svg"));
}
#sidebar-reverse-position {
@include _subviewMenuitem(var(--uc-sidebar-icon-reverse));
}
#sidebarMenu-popup > * {
@include _subviewMenuitem(
url("chrome://global/skin/icons/close.svg"),
"[data-l10n-id=\"sidebar-menu-close\"]"
);
}
/*= unified-extensions-view ===================================================*/
#unified-extensions-manage-extensions {
list-style-image: url("chrome://mozapps/skin/extensions/extension.svg");
}
/*= Compatibility ============================================================*/
// https://github.com/mozilla/gecko-dev/commit/d8ad6ecc983133a46a30cc998073d30a5e0e5f00
.sync-engine-tabs .checkbox-icon,
.sync-engine-tabs.sync-engine-image,
#sidebar-box[sidebarcommand="viewTabsSidebar"] > #sidebar-header > #sidebar-switcher-target > #sidebar-icon,
#sync-button {
list-style-image: url("../icons/synced-tabs.svg") !important;
}
/*= Tab Mix Plus =============================================================*/
#allTabsMenu_sortTabsButton {
list-style-image: url("../icons/text-sort-ascending.svg");
}