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
This commit is contained in:
@@ -465,7 +465,7 @@ const SpacePanel: React.FC = () => {
|
|||||||
ref={ref}
|
ref={ref}
|
||||||
aria-label={_t("common|spaces")}
|
aria-label={_t("common|spaces")}
|
||||||
>
|
>
|
||||||
<UserMenu vm={userMenuVm} />
|
<UserMenu vm={userMenuVm} className="mx_UserMenu" />
|
||||||
<AccessibleButton
|
<AccessibleButton
|
||||||
className={classNames("mx_SpacePanel_toggleCollapse", {
|
className={classNames("mx_SpacePanel_toggleCollapse", {
|
||||||
expanded: !isPanelCollapsed,
|
expanded: !isPanelCollapsed,
|
||||||
|
|||||||
+1
-1
@@ -10,7 +10,7 @@ exports[`<SpacePanel /> should show all activated MetaSpaces in the correct orde
|
|||||||
aria-expanded="false"
|
aria-expanded="false"
|
||||||
aria-haspopup="menu"
|
aria-haspopup="menu"
|
||||||
aria-label="User menu"
|
aria-label="User menu"
|
||||||
class="_triggerButton_1ejl3_50"
|
class="_triggerButton_1ejl3_50 mx_UserMenu"
|
||||||
data-state="closed"
|
data-state="closed"
|
||||||
id="radix-_r_0_"
|
id="radix-_r_0_"
|
||||||
type="button"
|
type="button"
|
||||||
|
|||||||
@@ -111,7 +111,7 @@ export function UserMenuView({ vm, className }: UserMenuViewProps): JSX.Element
|
|||||||
const { userId, displayName, avatarUrl, expanded, open, manageAccountHref, actions, showAvatar } = useViewModel(vm);
|
const { userId, displayName, avatarUrl, expanded, open, manageAccountHref, actions, showAvatar } = useViewModel(vm);
|
||||||
const { translate: _t } = useI18n();
|
const { translate: _t } = useI18n();
|
||||||
const trigger = (
|
const trigger = (
|
||||||
<button className={classNames(styles.triggerButton)} aria-label={_t("menus|user_menu|title")}>
|
<button className={classNames(styles.triggerButton, className)} aria-label={_t("menus|user_menu|title")}>
|
||||||
<Avatar id={userId} name={displayName} type="round" size="36px" src={avatarUrl} />
|
<Avatar id={userId} name={displayName} type="round" size="36px" src={avatarUrl} />
|
||||||
{expanded && (
|
{expanded && (
|
||||||
<Text type="heading" size="sm" as="span" weight="semibold">
|
<Text type="heading" size="sm" as="span" weight="semibold">
|
||||||
@@ -129,7 +129,7 @@ export function UserMenuView({ vm, className }: UserMenuViewProps): JSX.Element
|
|||||||
onOpenChange={vm.setOpen}
|
onOpenChange={vm.setOpen}
|
||||||
align="start"
|
align="start"
|
||||||
side="bottom"
|
side="bottom"
|
||||||
className={classNames(styles.container, className)}
|
className={styles.container}
|
||||||
>
|
>
|
||||||
<section className={styles.profile}>
|
<section className={styles.profile}>
|
||||||
{showAvatar && <Avatar id={userId} name={displayName} type="round" size="88px" src={avatarUrl} />}
|
{showAvatar && <Avatar id={userId} name={displayName} type="round" size="88px" src={avatarUrl} />}
|
||||||
|
|||||||
Reference in New Issue
Block a user