From 60b6fd2a48502782f424474a3fdf9274c54b34d0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Micha=C5=82=20Leszczyk?= <michasko37@gmail.com>
Date: Tue, 15 Mar 2022 15:53:02 +0100
Subject: [PATCH] fix(dashboard-v2): fix navbar dropdown hiding behind
 positioned content

---
 .../src/components/DropdownMenu/DropdownMenu.js       |  2 +-
 packages/dashboard-v2/src/components/NavBar/NavBar.js | 11 +++++++++--
 2 files changed, 10 insertions(+), 3 deletions(-)

diff --git a/packages/dashboard-v2/src/components/DropdownMenu/DropdownMenu.js b/packages/dashboard-v2/src/components/DropdownMenu/DropdownMenu.js
index 461a9b7e..86cbad5f 100644
--- a/packages/dashboard-v2/src/components/DropdownMenu/DropdownMenu.js
+++ b/packages/dashboard-v2/src/components/DropdownMenu/DropdownMenu.js
@@ -30,7 +30,7 @@ const TriggerIcon = styled(ChevronDownIcon).attrs({
 `;
 
 const Flyout = styled.div.attrs(({ open }) => ({
-  className: `absolute top-full right-0 p-0
+  className: `absolute top-full right-0 p-0 z-10
               border rounded border-palette-100
               bg-white shadow-md shadow-palette-200/50
               ${open ? "visible" : "invisible"}`,
diff --git a/packages/dashboard-v2/src/components/NavBar/NavBar.js b/packages/dashboard-v2/src/components/NavBar/NavBar.js
index 7fa52109..6cef6df5 100644
--- a/packages/dashboard-v2/src/components/NavBar/NavBar.js
+++ b/packages/dashboard-v2/src/components/NavBar/NavBar.js
@@ -9,7 +9,7 @@ import { PageContainer } from "../PageContainer";
 import { NavBarLink, NavBarSection } from ".";
 
 const NavBarContainer = styled.div.attrs({
-  className: `grid sticky top-0 bg-white`,
+  className: `grid sticky top-0 bg-white z-10`,
 })``;
 
 const NavBarBody = styled.nav.attrs({
@@ -68,7 +68,14 @@ export const NavBar = () => (
         </NavBarSection>
         <NavBarSection className="dropdown-area justify-end">
           <DropdownMenu title="My account">
-            <DropdownMenuLink to="/settings" as={Link} activeClassName="text-primary" icon={CogIcon} label="Settings" />
+            <DropdownMenuLink
+              to="/settings"
+              as={Link}
+              activeClassName="text-primary"
+              icon={CogIcon}
+              label="Settings"
+              partiallyActive
+            />
             <DropdownMenuLink
               to="/logout"
               as={Link}