Skip to content

Commit 67f02df

Browse files
KiKaraageKiKaraage
authored
Zen Context Menu v3: Finalizing config, especially "restore context menu icons"
1 parent 71a1a67 commit 67f02df

File tree

1 file changed

+114
-88
lines changed
  • themes/81fcd6b3-f014-4796-988f-6c3cb3874db8

1 file changed

+114
-88
lines changed

‎themes/81fcd6b3-f014-4796-988f-6c3cb3874db8/chrome.css‎

Lines changed: 114 additions & 88 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
/* Zen Context Menu v3.1 by KiKaraage */
22

33
/* Fix ergonomics for tab context menu by applying some reorderings
4-
* plus hiding disabled options and some separators
5-
* Applied by default when enabling Zen Context Menu mod */
4+
* plus hiding disabled options and some separators
5+
* Applied by default when enabling Zen Context Menu mod */
66
@media -moz-pref("uc.fixcontext.ergonomicsfortabs") {
77
#tabContextMenu {
88
:nth-child(22), /* Separator below "Duplicate Tab" */
@@ -69,25 +69,25 @@
6969
/* Hide all icons in context menu, except checkboxes and radio buttons, to fit current Zen styling */
7070
@media -moz-pref("uc.hidecontext.icons") {
7171
:not(:not(menubar) > menu, #ContentSelectDropdown)
72-
> menupopup
73-
> menuitem:not(
74-
.menuitem-iconic,
75-
[type='checkbox'],
76-
[type='radio'],
77-
.in-menulist,
78-
.in-menulist menuitem,
79-
.unified-nav-current
80-
),
72+
> menupopup
73+
> menuitem:not(
74+
.menuitem-iconic,
75+
[type='checkbox'],
76+
[type='radio'],
77+
.in-menulist,
78+
.in-menulist menuitem,
79+
.unified-nav-current
80+
),
8181
:not(:not(menubar) > menu, #ContentSelectDropdown)
82-
> menupopup
83-
> menu:not(
84-
.menu-iconic,
85-
[type='checkbox'],
86-
[type='radio'],
87-
.in-menulist,
88-
.in-menulist menu,
89-
.unified-nav-current
90-
),
82+
> menupopup
83+
> menu:not(
84+
.menu-iconic,
85+
[type='checkbox'],
86+
[type='radio'],
87+
.in-menulist,
88+
.in-menulist menu,
89+
.unified-nav-current
90+
),
9191
:not(:not(menubar) > menu, #ContentSelectDropdown) > menupopup > menucaption {
9292
padding-inline: 6px !important;
9393
}
@@ -121,11 +121,10 @@
121121
}
122122
}
123123
}
124-
/* Apply Zen workspace gradient to all context menu and panels.
125-
* Only play nicely in Windows 11 & macOS,
126-
* Linux and Windows 10 users will encounter semi-transparent backgrounds instead */
124+
/* Apply Zen workspace gradient to all context menu and panels
125+
* Suitable if the OS, desktop environment or window manager supported blur background */
127126
@media -moz-pref("uc.fixcontext.applyzengradient") {
128-
menupopup:not(#downloadsContextMenu, #placesColumnsContext, #placesContext), panel {
127+
menupopup, panel {
129128
--panel-background: var(--zen-main-browser-background) !important;
130129
}
131130
/* Fix text color on Firefox confirmation pop-ups when applying Zen colors on light mode */
@@ -136,8 +135,8 @@
136135
}
137136
/* Apply Zen workspace accent color to all context menu and panels*/
138137
@media -moz-pref("uc.fixcontext.applyzenaccent") {
139-
menupopup:not(#downloadsContextMenu, #placesColumnsContext, #placesContext), panel {
140-
--panel-background: var(--zen-browser-gradient-base) !important;
138+
menupopup, panel {
139+
--panel-background: color-mix(in srgb, var(--zen-primary-color) 40%, var(--zen-colors-tertiary)) !important;
141140
}
142141
}
143142

@@ -337,15 +336,15 @@
337336

338337
@media -moz-pref("uc.fixcontext.restoreicons") {
339338
/* PART 2: Adding start inline padding to options,
340-
* For now this also affected items with existing paddings
341-
* Like on toolbar context menu, or on extension options
342-
* Help me fix this, hit me up on github.com/KiKaraage/ZenMods/issues */
339+
* For now this also affected items with existing paddings
340+
* Like on toolbar context menu, or on extension options
341+
* Help me fix this, hit me up on github.com/KiKaraage/ZenMods/issues */
343342
.menu-text {
344343
@media (-moz-platform: windows) {
345344
padding-inline-start: 24px !important;
346345
}
347346
}
348-
347+
349348
/* PART 3: Adding icons back to regular context menu options */
350349
:not(:not(menubar) > menu, #ContentSelectDropdown)
351350
> menupopup
@@ -364,12 +363,12 @@
364363
-moz-context-properties: fill, fill-opacity !important;
365364
fill: currentColor !important;
366365
}
367-
366+
368367
/* PART 4: Adding icons back to context menu options that has arrow */
369368
:not(:not(menubar) > menu, #ContentSelectDropdown)
370369
> menupopup > menu:not(
371-
.menu-iconic, [type='checkbox'], [type='radio'],
372-
.in-menulist, .in-menulist menu, .unified-nav-current
370+
.menu-iconic, [type='checkbox'], [type='radio'],
371+
.in-menulist, .in-menulist menu, .unified-nav-current
373372
),
374373
#toggle_toolbar-menubar,
375374
#PanelUI-history toolbarbutton,
@@ -381,10 +380,10 @@
381380
-moz-context-properties: fill, fill-opacity !important;
382381
fill: currentColor !important;
383382
}
384-
383+
385384
/* PART 5: Normalize left padding for options with checkboxes, like Compact Mode options
386-
* Still not applied to options like 'Tabs on the right' sadly
387-
* Help me fix this, hit me up on github.com/KiKaraage/ZenMods/issues */
385+
* Still not applied to options like 'Tabs on the right' sadly
386+
* Help me fix this, hit me up on github.com/KiKaraage/ZenMods/issues */
388387
@media (-moz-platform: windows) {
389388
@media -moz-pref("uc.fixcontext.restoreicons") {
390389
menupopup > menuitem[checked='true'] {
@@ -422,13 +421,10 @@
422421
#context_zenSplitTabs {
423422
--menu-image: url('chrome://browser/skin/zen-icons/sidebars-right.svg') !important;
424423
}
425-
#context-zen-change-workspace-tab {
426-
--menu-image: url('chrome://browser/skin/zen-icons/move-tab.svg') !important;
427-
}
428424
#context-zenSplitLink {
429425
--menu-image: url('chrome://browser/skin/zen-icons/split.svg') !important;
430426
}
431-
427+
432428
#context_zenOpenWorkspace,
433429
#context_zenOpenWorkspacePanel {
434430
--menu-image: url('chrome://browser/skin/zen-icons/manage.svg') !important;
@@ -446,7 +442,7 @@
446442
#context-media-loop:not([checked='true']) .menu-iconic-icon {
447443
list-style-image: url('chrome://browser/skin/zen-icons/media-loop.svg') !important;
448444
}
449-
445+
450446
#context-savepage {
451447
--menu-image: url('chrome://browser/skin/zen-icons/save.svg');
452448
}
@@ -477,6 +473,7 @@
477473
}
478474
#context-paste,
479475
.textbox-contextmenu menuitem[cmd*='paste'],
476+
#placesContext_paste,
480477
#placesContext_paste_group {
481478
--menu-image: url('chrome://browser/skin/zen-icons/edit-paste.svg');
482479
}
@@ -552,6 +549,7 @@
552549
#context-pdfjs-copy {
553550
--menu-image: url('chrome://browser/skin/zen-icons/link.svg');
554551
}
552+
#placesContext_open,
555553
#context-openlinkincurrent {
556554
--menu-image: url('chrome://browser/skin/zen-icons/ext-link.svg');
557555
}
@@ -682,7 +680,8 @@
682680
list-style-image: url('chrome://browser/skin/zen-icons/unpin.svg') !important;
683681
}
684682
#context_duplicateTab,
685-
#context_duplicateTabs {
683+
#context_duplicateTabs,
684+
menuitem[data-l10n-id="zen-panel-ui-workspaces-create"] {
686685
--menu-image: url('chrome://browser/skin/zen-icons/duplicate-tab.svg');
687686
}
688687
#zen-context-menu-compact-mode {
@@ -725,12 +724,15 @@
725724
--menu-image: url('chrome://browser/skin/zen-icons/pocket-outline.svg');
726725
}
727726
#context_ungroupTab,
728-
#context_moveTabOptions {
727+
#context_moveTabOptions,
728+
#context-zen-change-workspace-tab,
729+
#context_zenReorderWorkspaces {
729730
--menu-image: url('chrome://browser/skin/zen-icons/move-tab.svg');
730731
}
731732
.share-tab-url-item {
732733
--menu-image: url('chrome://browser/skin/zen-icons/share.svg');
733734
}
735+
#zen-context-menu-new-folder-toolbar,
734736
#zen-context-menu-new-folder {
735737
--menu-image: url('chrome://browser/skin/zen-icons/folder.svg');
736738
}
@@ -757,55 +759,79 @@
757759
.wordmark::after {
758760
content: 'Plus' !important;
759761
}
760-
}
761-
@-moz-document url-prefix("chrome://browser/content/browser.xhtml") {
762-
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
763-
@media -moz-pref("uc.fixcontext.restoreicons") {
764-
:root {
765-
--zen-cmenu-icon-margin-inline-start: 4px !important;
766-
--zen-cmenu-icon-margin-inline-end: 8px !important;
767-
--zen-cmenu-icon-margin-block: 2px !important;
768-
--zen-cmenu-icon-size: 16px !important;
762+
#placesContext > menuitem[id="placesContext_sortBy:name"] {
763+
--menu-image: url('chrome://browser/skin/zen-icons/translations.svg');
764+
}
765+
}
766+
767+
768+
/* PART 8: Improving the text margin one by one */
769+
@media -moz-pref("uc.fixcontext.restoreicons") {
770+
/* 8A: Tab Context Menu */
771+
#tabContextMenu {
772+
menuitem:not(.menuitem-iconic) > .menu-text,
773+
menu > .menu-text {
774+
margin-inline-start: 24px!important;
769775
}
770-
menupopup > menuitem > .menu-icon,
771-
menupopup > menu > .menu-icon {
772-
width: var(--zen-cmenu-icon-size);
773-
height: var(--zen-cmenu-icon-size);
774-
margin-inline-start: var(--zen-cmenu-icon-margin-inline-start);
775-
margin-inline-end: var(--zen-cmenu-icon-margin-inline-end);
776-
margin-block-start: var(--zen-cmenu-icon-margin-block);
777-
margin-block-end: var(--zen-cmenu-icon-margin-block);
778-
padding: 0 !important;
776+
#context_reopenInContainerPopupMenu,
777+
#context-zen-change-workspace-tab-menu-popup,
778+
#context_sendTabToDevicePopupMenu, #closeTabOptions, #moveTabOptionsMenu {
779+
menuitem:not(.menuitem-iconic) > .menu-text,
780+
menu > .menu-text {
781+
margin-inline-start: 0 !important;
782+
}
783+
}
784+
}
785+
/* 8B: Workspace Context Menu */
786+
#zenWorkspaceMoreActions {
787+
menuitem > .menu-text,
788+
menu > .menu-text {
789+
margin-inline-start: 24px !important;
779790
}
780-
menupopup > menuitem .menu-text,
781-
menupopup > menu .menu-text {
782-
padding-inline-start: 0 !important;
783-
margin-inline-start: 0 !important;
784-
padding-inline-start: var(--zen-cmenu-icon-margin-inline-end);
791+
#context_zenWorkspacesOpenInContainerTab > menupopup {
792+
menuitem > .menu-text,
793+
menu > .menu-text {
794+
margin-inline-start: 0 !important;
795+
}
785796
}
786-
787-
/* Shift the text to the right to make room for the custom icon.*/
788-
:root {
789-
--fp-contextmenu-menuicon-margin-inline: 12px;
790-
--fp-contextmenu-menuitem-padding-inline: 10px;
791-
--fp-arrowpanel-menuicon-margin-inline: 14px;
797+
}
798+
/* 8C: Content Area Context Menu */
799+
#contentAreaContextMenu {
800+
menuitem:not(.menuitem-iconic,
801+
#context-undo, #context-redo, #context-cut, #context-copy,
802+
#context-paste, #context-delete
803+
) > .menu-text,
804+
menu > .menu-text {
805+
margin-inline-start: 24px!important;
792806
}
793-
794-
/* Context Menu */
795-
menu > .menu-iconic-text,
796-
menuitem > .menu-iconic-text,
797-
#context-navigation > .menuitem-iconic::after {
798-
padding-inline-start: var(--fp-contextmenu-menuicon-margin-inline) !important;
807+
#context-ask-chat > menupopup,
808+
#context-sendpagetodevice-popup,
809+
#context-sendlinktodevice-popup
810+
{
811+
menuitem > .menu-text,
812+
menu > .menu-text {
813+
margin-inline-start: 0 !important;
814+
}
815+
}
816+
}
817+
/* 8D: Text Context Menu */
818+
.textbox-contextmenu {
819+
.menu-text {
820+
margin-inline-start: 24px !important;
821+
}
822+
}
823+
/* 8E: Bookmarks Context Menu */
824+
#placesContext {
825+
menuitem > .menu-text,
826+
menu > .menu-text {
827+
margin-inline-start: 0px !important;
799828
}
800-
801-
:not(:not(menubar) > menu, #ContentSelectDropdown) > menupopup > menuitem:not(.menuitem-iconic, [type="checkbox"], [type="radio"], .in-menulist, .in-menulist menuitem, .unified-nav-current),
802-
:not(:not(menubar) > menu, #ContentSelectDropdown) > menupopup > menu:not(.menu-iconic, [type="checkbox"], [type="radio"], .in-menulist, .in-menulist menu, .unified-nav-current),
803-
:not(:not(menubar) > menu, #ContentSelectDropdown) > menupopup > menucaption {
804-
padding-inline-start: calc(
805-
var(--fp-contextmenu-menuitem-padding-inline)
806-
+ 8px
807-
+ var(--fp-contextmenu-menuicon-margin-inline)
808-
) !important;
829+
#placesContext_open_newcontainertab_popup,
830+
#toggle_PersonalToolbar > menupopu {
831+
menuitem > .menu-text,
832+
menu > .menu-text {
833+
margin-inline-start: 0 !important;
834+
}
809835
}
810-
}
836+
}
811837
}

0 commit comments

Comments
 (0)