From 51d1ad8f47f363a617ac5d375cda3b87624c88fb Mon Sep 17 00:00:00 2001 From: Mauro Balades Date: Sat, 13 Apr 2024 18:29:48 +0200 Subject: [PATCH] Changed UI for extensions popup --- .../content/panelUI-inc-xhtml.patch | 17 +++++++ .../en-US/browser/unifiedExtensions-ftl.patch | 13 +++++ src/toolkit/themes/shared/popup-css.patch | 5 +- src/toolkit/themes/shared/zen-popup.css | 51 +++++++++++++++++-- 4 files changed, 80 insertions(+), 6 deletions(-) create mode 100644 src/browser/components/customizableui/content/panelUI-inc-xhtml.patch create mode 100644 src/browser/locales/en-US/browser/unifiedExtensions-ftl.patch diff --git a/src/browser/components/customizableui/content/panelUI-inc-xhtml.patch b/src/browser/components/customizableui/content/panelUI-inc-xhtml.patch new file mode 100644 index 000000000..8e845316c --- /dev/null +++ b/src/browser/components/customizableui/content/panelUI-inc-xhtml.patch @@ -0,0 +1,17 @@ +diff --git a/browser/components/customizableui/content/panelUI.inc.xhtml b/browser/components/customizableui/content/panelUI.inc.xhtml +index 956a6ae45d7adbec1513c5af528ebb687a4b7d0d..83b23e84cb6895497c1346f7c4aff15173e67b5c 100644 +--- a/browser/components/customizableui/content/panelUI.inc.xhtml ++++ b/browser/components/customizableui/content/panelUI.inc.xhtml +@@ -81,9 +81,10 @@ + + + +- ++ ++#if 0 + +- ++#endif + + + diff --git a/src/browser/locales/en-US/browser/unifiedExtensions-ftl.patch b/src/browser/locales/en-US/browser/unifiedExtensions-ftl.patch new file mode 100644 index 000000000..b7881c8c2 --- /dev/null +++ b/src/browser/locales/en-US/browser/unifiedExtensions-ftl.patch @@ -0,0 +1,13 @@ +diff --git a/browser/locales/en-US/browser/unifiedExtensions.ftl b/browser/locales/en-US/browser/unifiedExtensions.ftl +index 8db0d9488ac334ada07bf3f537f78cdc99577fb7..acc1d60d5577ffafe982557757c868fa691a1d96 100644 +--- a/browser/locales/en-US/browser/unifiedExtensions.ftl ++++ b/browser/locales/en-US/browser/unifiedExtensions.ftl +@@ -10,6 +10,8 @@ unified-extensions-header-title = Extensions + unified-extensions-manage-extensions = + .label = Manage extensions + ++unified-extensions-description = Extensions are used to bring more extra functionality into { -brand-short-name }. ++ + ## An extension in the main list + + # Each extension in the unified extensions panel (list) has a secondary button diff --git a/src/toolkit/themes/shared/popup-css.patch b/src/toolkit/themes/shared/popup-css.patch index 73344de59..9a31d93be 100644 --- a/src/toolkit/themes/shared/popup-css.patch +++ b/src/toolkit/themes/shared/popup-css.patch @@ -1,5 +1,5 @@ diff --git a/toolkit/themes/shared/popup.css b/toolkit/themes/shared/popup.css -index ddc41a66ed0e3688ce34052652bef1fe33a08d49..53575e1af10d764b131ac20648f1fdd84b652d60 100644 +index ddc41a66ed0e3688ce34052652bef1fe33a08d49..78005dc087044ed57e974f6aa18dd23d61bdb76b 100644 --- a/toolkit/themes/shared/popup.css +++ b/toolkit/themes/shared/popup.css @@ -2,6 +2,8 @@ @@ -19,7 +19,8 @@ index ddc41a66ed0e3688ce34052652bef1fe33a08d49..53575e1af10d764b131ac20648f1fdd8 + --panel-background: var(--arrowpanel-background); --panel-color: MenuText; --panel-padding-block: 4px; - --panel-padding: var(--panel-padding-block) 0; +- --panel-padding: var(--panel-padding-block) 0; ++ --panel-padding: var(--panel-padding-block) 0 5px 0; --panel-border-radius: 4px; - --panel-border-color: ThreeDShadow; + --panel-border-color: transparent /* var(--arrowpanel-border-color) */ !important; diff --git a/src/toolkit/themes/shared/zen-popup.css b/src/toolkit/themes/shared/zen-popup.css index ebe5a0d84..4f29b181b 100644 --- a/src/toolkit/themes/shared/zen-popup.css +++ b/src/toolkit/themes/shared/zen-popup.css @@ -9,7 +9,7 @@ --uc-arrowpanel-menuitem-margin-inline: 4px; --uc-arrowpanel-menuitem-margin-block: 2px; --panel-separator-margin-vertical: 2px !important; - --panel-separator-margin-horizontal: 0 !important; + --panel-separator-margin-horizontal: 1px !important; --uc-panel-zoom-button-padding: 8px; --uc-panel-zoom-button-inline-padding: 9px; @@ -35,6 +35,9 @@ --uc-contextmenu-menuitem-margin: var(--uc-contextmenu-menuitem-margin-block) var(--uc-contextmenu-menuitem-margin-inline); --uc-contextmenu-separator-vertical: calc(4px - var(--uc-contextmenu-menuitem-border-width)); --uc-contextmenu-separator-horizontal: 0; + + --panel-separator-color: var(--zen-colors-secondary) !important; + --zen-panel-separator-width: 2px; } /* app menu */ @@ -217,8 +220,10 @@ margin-inline: 0 !important; } -#identity-popup-mainView > toolbarseparator:first-child { +#identity-popup-mainView > toolbarseparator:first-child, +#unified-extensions-view > toolbarseparator:first-child { display: none !important; + opacity: 0 !important; } @@ -240,7 +245,45 @@ toolbarbutton:not( ), #PanelUI-zen-profiles menuitem { /** ADD HERE ALL TYPES OF BUTTONS THAT WANT TO LOOK CHROME LIKE!!! */ - margin-left: 0 !important; - margin: 2.5px 0 !important; + margin: 0 !important; border-radius: 0 !important; } + +.panel-subview-footer-button { + padding-top: 10px !important; + padding-bottom: 10px !important; +} + +#PanelUI-zen-profiles menuitem { + padding: 5px !important; +} + +#PanelUI-zen-profiles menuitem:last-child { + margin-bottom: 5px !important; +} + +.unified-extensions-item-action-button { + padding: 5px 20px !important; +} + +#unified-extensions-description { + padding: 0 20px; + margin: 0 !important; +} + +.unified-extensions-item { + padding: 0 !important; +} + +.panel-subview-footer-button { + --arrowpanel-menuitem-padding-block: 20px !important; + --arrowpanel-menuitem-padding-inline: 15px !important; +} + +toolbarseparator, menuseparator { + border-width: var(--zen-panel-separator-width) !important; +} + +#appMenu-zoom-controls { + border-top-width: var(--zen-panel-separator-width) !important; +}