Menu Alignment Issues

[sillvva]

Captchas

• I have read the instructions.
• I have searched existing issues and avoided creating duplicates.
• I am not filing an enhancement request.

What happened?

There are several menus that appear to have alignment issues on both Windows and MacOS.

Windows

MacOS

Reproducible?

• I have checked that this issue cannot be reproduced on Mozilla Firefox.

Version

1.7.2b

What platform are you seeing the problem on?

Other

Relevant log output if applicable

[sillvva]

It seems the issue has to do with menu items that count as checkboxes. This sort of fixes it:

:not(:not(menubar) > menu, #ContentSelectDropdown) > menupopup > menuitem:not(.menuitem-iconic, [type="checkbox"], [type="radio"], .in-menulist, .in-menulist menuitem, .unified-nav-current), :not(:not(menubar) > menu, #ContentSelectDropdown) > menupopup > menu:not(.menu-iconic, [type="checkbox"], [type="radio"], .in-menulist, .in-menulist menu, .unified-nav-current), #toggle_toolbar-menubar, #PanelUI-history toolbarbutton, #unified-extensions-context-menu menuitem {
  padding-inline-start: calc( var(--fp-contextmenu-menuitem-padding-inline) + 16px + var(--fp-contextmenu-menuicon-margin-inline) ) !important;
  &[type="checkbox"] {
    padding-inline-start: 34px !important;
    .menu-iconic-text {
      padding-inline-start: 1px !important;
    }
    &[checked="true"] {
      padding-inline-start: 8px !important;
      --menu-image: none !important;
      .menu-iconic-text {
        padding-inline-start: 26px !important;
      }
    }
  }
}

Before

After

Pin to Toolbar is checked

Pin to Toolbar is unchecked

[emma-sg]

Another example (on macOS) that I haven't seen posted in this issue yet

[dosubot]

Hi, @sillvva. I'm Dosu, and I'm helping the desktop team manage their backlog. I'm marking this issue as stale.

Issue Summary:

• Alignment problems with menus in version 1.7.2b on Windows and MacOS.
• The issue does not occur in Mozilla Firefox.
• You suggested a CSS fix for menu items functioning as checkboxes, with before-and-after images.
• @emma-sg provided another example of the issue on macOS, supported by @neyzm.

Next Steps:

• Please let me know if this issue is still relevant to the latest version of the desktop repository by commenting here.
• If there is no further activity, I will automatically close this issue in 7 days.

Thank you for your understanding and contribution!