diff --git a/calendar/base/content/calendar-context-menus-and-tooltips.inc.xhtml b/calendar/base/content/calendar-context-menus-and-tooltips.inc.xhtml index 05c1c0e58d..daa6e50d52 100644 --- a/calendar/base/content/calendar-context-menus-and-tooltips.inc.xhtml +++ b/calendar/base/content/calendar-context-menus-and-tooltips.inc.xhtml @@ -564,8 +564,6 @@ command="cmd_paste"/> diff --git a/mail/components/im/content/imAccounts.xhtml b/mail/components/im/content/imAccounts.xhtml index 58242f88e8..a7a4434ea0 100644 --- a/mail/components/im/content/imAccounts.xhtml +++ b/mail/components/im/content/imAccounts.xhtml @@ -22,6 +22,7 @@ + diff --git a/mail/themes/linux/mail/contextMenu.css b/mail/themes/linux/mail/contextMenu.css index 958ee5eb0d..9530af1c3f 100644 --- a/mail/themes/linux/mail/contextMenu.css +++ b/mail/themes/linux/mail/contextMenu.css @@ -5,12 +5,15 @@ @import url("chrome://messenger/skin/shared/contextMenu.css"); menupopup { + & > menuitem:is([type="checkbox"],[type="radio"]) .menu-iconic-icon { appearance: none; } - & > menu > .menu-text, - & menuitem:not(:is([type="checkbox"],[type="radio"])) > .menu-text { + &[needsgutter] > + :is(menu,menuitem:not(:is([type="checkbox"],[type="radio"]))) > .menu-text, + menubar > menu &:not([needsgutter]) > + :is(menu:not(.menu-iconic),menuitem:not(.menuitem-iconic)) > .menu-text { /* Align with the checkbox and radio menuitems. */ padding-inline-start: 21px; } diff --git a/mail/themes/osx/mail/contextMenu.css b/mail/themes/osx/mail/contextMenu.css index 5352d12f34..27abd5d963 100644 --- a/mail/themes/osx/mail/contextMenu.css +++ b/mail/themes/osx/mail/contextMenu.css @@ -12,11 +12,15 @@ menupopup { margin: 1px; } + & > :is(menu, menuitem)[disabled="true"][_moz-menuactive="true"] { + background-color: transparent !important; + } + & > menu::after { line-height: 0; } - & > :is(menu, menuitem) > .menu-text { + &[needsgutter] > :is(menu, menuitem) > .menu-text { margin-inline-start: 21px; } @@ -68,6 +72,24 @@ menupopup { } } +.menu-right, +.menu-accel-container { + margin-inline-end: 0; +} + +.menu-accel-container { + opacity: 0.5; + + menupopup[type="arrow"] & { + margin-inline-end: 0; + } + + menuitem:not([disabled="true"]):hover &, + menuitem:not([disabled="true"]):focus & { + opacity: 1; + } +} + /* Only show the system checkmark on main window menu */ #windowPopup > menuitem[checked="true"] { list-style-image: none; diff --git a/mail/themes/osx/mail/messenger.css b/mail/themes/osx/mail/messenger.css index 893e07a05e..3ef8994a4b 100644 --- a/mail/themes/osx/mail/messenger.css +++ b/mail/themes/osx/mail/messenger.css @@ -184,11 +184,6 @@ toolbarbutton > menupopup menuitem { } } -menupopup menu[disabled="true"][_moz-menuactive="true"], -menupopup menuitem[disabled="true"][_moz-menuactive="true"] { - background-color: transparent !important; -} - menulist > menupopup menu .menu-right, toolbarbutton > menupopup menu .menu-right { appearance: none; @@ -443,24 +438,6 @@ legend { font-weight: bold; } -.menu-right, -.menu-accel-container { - margin-inline-end: 0; -} - -.menu-accel-container { - opacity: 0.5; - - menupopup[type="arrow"] & { - margin-inline-end: 0; - } - - menuitem:not([disabled="true"]):hover &, - menuitem:not([disabled="true"]):focus & { - opacity: 1; - } -} - /* UI Density customization */ treechildren::-moz-tree-row { diff --git a/mail/themes/shared/mail/primaryToolbar.css b/mail/themes/shared/mail/primaryToolbar.css index 034b92dcf9..85254beaa5 100644 --- a/mail/themes/shared/mail/primaryToolbar.css +++ b/mail/themes/shared/mail/primaryToolbar.css @@ -170,8 +170,7 @@ fill-opacity: var(--toolbarbutton-icon-fill-opacity); } -#button-getAllNewMsg, -#menu_getnewmsgs_all_accounts { +#button-getAllNewMsg { list-style-image: var(--icon-download); } diff --git a/mail/themes/windows/mail/contextMenu.css b/mail/themes/windows/mail/contextMenu.css index 187c1fb4a4..87881cc399 100644 --- a/mail/themes/windows/mail/contextMenu.css +++ b/mail/themes/windows/mail/contextMenu.css @@ -15,11 +15,26 @@ menupopup { } } - &[needsgutter] menu:not([icon], .menu-iconic), - &[needsgutter] menuitem:not([checked="true"], [icon], .menuitem-iconic) { + & > :is(menu, menuitem) { + padding-block: var(--menuitem-vertical-padding); + } + + menulist > & > :is(menu, menuitem) { + padding-inline-end: 5px; + } + + &[needsgutter] > menu:not([icon], .menu-iconic), + &[needsgutter] > menuitem:not([checked="true"], [icon], .menuitem-iconic), + menubar > menu + &:not([needsgutter]) > :is(menu:not(.menu-iconic),menuitem:not(.menuitem-iconic)) { padding-inline-start: 32px; } + /* Override menu.css rule. */ + &:not([needsgutter]) > menuitem:not([checked="true"], [icon], .menuitem-iconic) { + padding-inline-start: 8px; + } + & > :is(menu, menuitem):not([needsgutter]) > menuitem:not([icon], .menuitem-iconic) { padding-inline-start: 1em; diff --git a/mail/themes/windows/mail/messenger.css b/mail/themes/windows/mail/messenger.css index 2bbcbc793c..e1810a8583 100644 --- a/mail/themes/windows/mail/messenger.css +++ b/mail/themes/windows/mail/messenger.css @@ -8,38 +8,6 @@ @import url("chrome://messenger/skin/shared/messenger.css"); -/* UI Density customization */ -:root { - --menuitem-vertical-padding: 3px; - &[uidensity="compact"] { - --menuitem-vertical-padding: 1px; - } - - &[uidensity="touch"] { - --menuitem-vertical-padding: 8px; - } -} - -menupopup > menu, -menupopup > menuitem { - padding-block: var(--menuitem-vertical-padding); -} - -menulist > menupopup > menu, -menulist > menupopup > menuitem { - padding-inline-end: 5px; -} - -menulist > menupopup:not([needsgutter]) > menu:not([icon], .menu-iconic), -menulist > menupopup:not([needsgutter]) > menuitem:not([icon], .menuitem-iconic) { - padding-inline-start: 1em; -} - -menupopup:not([needsgutter]) > menu:not([icon], .menu-iconic), -menupopup:not([needsgutter]) > menuitem:not([checked="true"], [icon], .menuitem-iconic) { - padding-inline-start: 32px; -} - .folderMenuItem > .menu-iconic-left, .menuitem-iconic > .menu-iconic-left { display: flex; diff --git a/mail/themes/windows/mail/variables.css b/mail/themes/windows/mail/variables.css index 0be64af250..c277d8dbfb 100644 --- a/mail/themes/windows/mail/variables.css +++ b/mail/themes/windows/mail/variables.css @@ -12,70 +12,79 @@ --row-grouped-header-bg-color: -moz-dialog; --row-grouped-header-bg-color-selected: var(--selected-item-color); --panel-separator-color: ThreeDLightShadow; -} -@media not (prefers-contrast) { - :root { + /* UI Density customization */ + --menuitem-vertical-padding: 3px; + + &[uidensity="compact"] { + --menuitem-vertical-padding: 1px; + } + + &[uidensity="touch"] { + --menuitem-vertical-padding: 8px; + } + + @media not (prefers-contrast) { --toolbar-non-lwt-bgimage: none; --panel-separator-color: hsla(210, 4%, 10%, 0.14); --autocomplete-popup-url-color: hsl(210, 77%, 47%); } -} -@media (prefers-color-scheme: dark) { - :root[lwtheme] { - --autocomplete-popup-highlight-color: var(--lwt-text-color); - --dark-lwt-highlight-color: #0a84ff; + @media (prefers-color-scheme: dark) { + &[lwtheme] { + --autocomplete-popup-highlight-color: var(--lwt-text-color); + --dark-lwt-highlight-color: #0a84ff; + } + + &[lwtheme]:not([lwt-tree]) menupopup { + --panel-background: var(--arrowpanel-background) !important; + --panel-color: var(--arrowpanel-color) !important; + --panel-border-color: var(--arrowpanel-border-color) !important; + --menu-color: var(--arrowpanel-color) !important; + --menu-disabled-color: color-mix(in srgb, var(--arrowpanel-color) 35%, transparent) !important; + --menuitem-hover-background-color: color-mix(in srgb, var(--arrowpanel-color) 13%, transparent) !important; + } } - :root[lwtheme]:not([lwt-tree]) menupopup { - --panel-background: var(--arrowpanel-background) !important; - --panel-color: var(--arrowpanel-color) !important; - --panel-border-color: var(--arrowpanel-border-color) !important; - --menu-color: var(--arrowpanel-color) !important; - --menu-disabled-color: color-mix(in srgb, var(--arrowpanel-color) 35%, transparent) !important; - --menuitem-hover-background-color: color-mix(in srgb, var(--arrowpanel-color) 13%, transparent) !important; - } -} + @media (prefers-contrast) { + &:not([lwtheme]) { + --lwt-tabs-border-color: ThreeDShadow; + --item-focus-selected-border-color: SelectedItemText; + --new-folder-color: Highlight; + --menuitem-vertical-padding: 3px; + --arrowpanel-dimmed: SelectedItem; + --arrowpanel-dimmed-further: SelectedItem; + --toolbar-field-focus-border-color: SelectedItem; -@media (prefers-contrast) { - :root:not([lwtheme]) { - --lwt-tabs-border-color: ThreeDShadow; - --item-focus-selected-border-color: SelectedItemText; - --new-folder-color: Highlight; - --menuitem-vertical-padding: 3px; - --arrowpanel-dimmed: SelectedItem; - --arrowpanel-dimmed-further: SelectedItem; - --toolbar-field-focus-border-color: SelectedItem; + & .themeable-full, + & .themeable-brighttext, + & #navigation-toolbox > toolbar, + & #todaypane-new-event-button, + & #CardViewBox { + --toolbarbutton-hover-background: SelectedItem; + --toolbarbutton-hover-bordercolor: SelectedItemText !important; + --toolbarbutton-active-background: SelectedItem; + --toolbarbutton-active-bordercolor: SelectedItemText; + --toolbarbutton-checked-background: SelectedItem; + --toolbarbutton-icon-fill-attention: SelectedItem; + } - & .themeable-full, - & .themeable-brighttext, - & #navigation-toolbox > toolbar, - & #todaypane-new-event-button, - & #CardViewBox { - --toolbarbutton-hover-background: SelectedItem; - --toolbarbutton-hover-bordercolor: SelectedItemText !important; - --toolbarbutton-active-background: SelectedItem; - --toolbarbutton-active-bordercolor: SelectedItemText; - --toolbarbutton-checked-background: SelectedItem; - --toolbarbutton-icon-fill-attention: SelectedItem; - } + & .toolbarbutton-1.message-header-view-button { + --toolbarbutton-header-bordercolor: WindowText; + --toolbarbutton-active-bordercolor: WindowText; + } - & .toolbarbutton-1.message-header-view-button { - --toolbarbutton-header-bordercolor: WindowText; - --toolbarbutton-active-bordercolor: WindowText; - } + & .toolbarbutton-1:not(.qfb-tag-button):hover, + & #calendar-add-task-button:hover, + & #todaypane-new-event-button:hover, + & .toolbarbutton-1[checked="true"], + & .toolbarbutton-menubutton-button:hover { + color: SelectedItemText !important; + } - & .toolbarbutton-1:not(.qfb-tag-button):hover, - & #calendar-add-task-button:hover, - & #todaypane-new-event-button:hover, - & .toolbarbutton-1[checked="true"], - & .toolbarbutton-menubutton-button:hover { - color: SelectedItemText !important; - } - - & menulist { - --toolbarbutton-hover-background: ButtonFace; + & menulist { + --toolbarbutton-hover-background: ButtonFace; + } } } }