Fix user menu overlap with macos window controls (#33425)

* Fix user menu overlap with macos window controls

Fixes https://github.com/element-hq/element-web/issues/33424

* Snapshot

* snapshot

apps/web/src/components/views/spaces/SpacePanel.tsx

@@ -465,7 +465,7 @@ const SpacePanel: React.FC = () => {
                         ref={ref}
                         aria-label={_t("common|spaces")}
                     >
-                        <UserMenu vm={userMenuVm} />
+                        <UserMenu vm={userMenuVm} className="mx_UserMenu" />
                         <AccessibleButton
                             className={classNames("mx_SpacePanel_toggleCollapse", {
                                 expanded: !isPanelCollapsed,

apps/web/test/unit-tests/components/views/spaces/__snapshots__/SpacePanel-test.tsx.snap

@@ -10,7 +10,7 @@ exports[`<SpacePanel /> should show all activated MetaSpaces in the correct orde
       aria-expanded="false"
       aria-haspopup="menu"
       aria-label="User menu"
-      class="_triggerButton_1ejl3_50"
+      class="_triggerButton_1ejl3_50 mx_UserMenu"
       data-state="closed"
       id="radix-_r_0_"
       type="button"