diff --git a/components/common/Dropdown.tsx b/components/common/Dropdown.tsx
index 0cb1558e..07c4562b 100644
--- a/components/common/Dropdown.tsx
+++ b/components/common/Dropdown.tsx
@@ -43,10 +43,11 @@ export const Dropdown = ({
leaveFrom="transform opacity-100 scale-100"
leaveTo="transform opacity-0 scale-95"
>
+ {/* z-30 value is important because we want all dropdowns to draw over other elements in the page and besides mobile menu, z-30 is the highest z-index we use in this codebase */}
{items.map((item) => (
diff --git a/components/common/FullScreenActionPanel.tsx b/components/common/FullScreenActionPanel.tsx
index a4dc215b..847e7cdd 100644
--- a/components/common/FullScreenActionPanel.tsx
+++ b/components/common/FullScreenActionPanel.tsx
@@ -11,10 +11,10 @@ export function FullScreenActionPanel(props: {
const { open, onClose, title, children } = props
return (
- {/* The z-20 value is important because the headerbar uses z-10 and we ant to make sure the full screen panels are never below the header bar */}
+ {/* The z-30 value is important because the headerbar uses z-10 and label chips with dropdowns use z-20 and we ant to make sure the full screen panels are never below the header bar and label chip dropdowns */}