Update icon hover/focus style and popover position

Automattic · Dec 22, 2024 · 12aba69 · 12aba69
1 parent 3dc15c8
commit 12aba69
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 1 deletion.
diff --git a/client/my-sites/email/email-management/home/email-plan-mailboxes/context-menu.scss b/client/my-sites/email/email-management/home/email-plan-mailboxes/context-menu.scss
@@ -16,5 +16,12 @@
 			width: 24px;
 			height: auto;
 		}
+
+		&:hover,
+		&:focus {
+			svg {
+				fill: var(--color-text-inverted);
+			}
+		}
 	}
 }
diff --git a/client/my-sites/email/email-management/home/email-plan-mailboxes/context-menu.tsx b/client/my-sites/email/email-management/home/email-plan-mailboxes/context-menu.tsx
@@ -38,7 +38,11 @@ export default function ContextMenu( { className }: Props ) {
 	];
 
 	return (
-		<EllipsisMenu className={ className } popoverClassName={ `${ className }-popover` }>
+		<EllipsisMenu
+			className={ className }
+			popoverClassName={ `${ className }-popover` }
+			position="bottom"
+		>
 			{ options.map( ( option, key ) => (
 				<PopoverMenuItem key={ key } { ...option }>
 					{ option.label }