fix: menu options z-index (#402) (#404)

Co-authored-by: Greg DeYoung <[email protected]>
ninja · Jun 16, 2022 · 43987ba · 43987ba
1 parent a73a952
commit 43987ba
Show file tree

Hide file tree

Showing 3 changed files with 1 addition and 8 deletions.
diff --git a/src/lib/components/menu/button.tsx b/src/lib/components/menu/button.tsx
@@ -4,7 +4,6 @@ import { MdArrowDropDown, MdArrowDropUp } from "react-icons/md";
 import type { ButtonProps } from "../button";
 import { useMenu } from ".";
 import { Menu } from "./menu";
-import styles from "./menu.module.css";
 
 export function ButtonMenu({
 	className: classNameOverride,
@@ -38,7 +37,6 @@ export function ButtonMenu({
 				aria-controls={menuId}
 				aria-expanded={expanded}
 				aria-haspopup="menu"
-				className={styles.control}
 				id={id}
 				onClick={handleClickControl}
 				onKeyDown={handleKeyDownControl}

diff --git a/src/lib/components/menu/input.tsx b/src/lib/components/menu/input.tsx
@@ -5,7 +5,6 @@ import { MdArrowDropDown, MdArrowDropUp } from "react-icons/md";
 import type { InputProps } from "../input";
 import { useMenu } from ".";
 import { Menu } from "./menu";
-import styles from "./menu.module.css";
 
 export const InputMenu = forwardRef<
 	HTMLInputElement,
@@ -50,7 +49,6 @@ export const InputMenu = forwardRef<
 				aria-controls={menuId}
 				aria-expanded={expanded}
 				aria-haspopup="menu"
-				className={styles.control}
 				flex={flex}
 				id={id}
 				onClick={handleClickControl}

diff --git a/src/lib/components/menu/menu.module.css b/src/lib/components/menu/menu.module.css
@@ -24,6 +24,7 @@
 	display: flex;
 	flex-direction: column;
 	margin-top: 0.2rem;
+	z-index: 3;
 }
 
 .menu.input {
@@ -104,7 +105,3 @@
 .separator {
 	border-top: 0.1rem solid var(--md-color-outline);
 }
-
-.control[aria-expanded="true"] {
-	z-index: 3;
-}