From 19b29188dd0a4207a1bb7cd886f55b30cdb76d32 Mon Sep 17 00:00:00 2001
From: Johannes <72809645+jobenjada@users.noreply.github.com>
Date: Wed, 10 Aug 2022 15:57:41 +0200
Subject: [PATCH] fix:fix z-index on form list, unify context menus (#16)

---
 components/FormList.tsx           |  2 +-
 components/layout/MenuProfile.tsx | 13 ++++++++++---
 2 files changed, 11 insertions(+), 4 deletions(-)

diff --git a/components/FormList.tsx b/components/FormList.tsx
index 355533f636..01d23efcc3 100644
--- a/components/FormList.tsx
+++ b/components/FormList.tsx
@@ -96,7 +96,7 @@ export default function FormList() {
                           </p>
                           <Menu
                             as="div"
-                            className="relative inline-block text-left"
+                            className="relative z-10 inline-block text-left"
                           >
                             {({ open }) => (
                               <>
diff --git a/components/layout/MenuProfile.tsx b/components/layout/MenuProfile.tsx
index 4a7b537314..628a015061 100644
--- a/components/layout/MenuProfile.tsx
+++ b/components/layout/MenuProfile.tsx
@@ -1,4 +1,5 @@
 import { Menu, Transition } from "@headlessui/react";
+import { LogoutIcon } from "@heroicons/react/solid";
 import { signOut } from "next-auth/react";
 import Image from "next/image";
 import { Fragment } from "react";
@@ -35,17 +36,23 @@ export default function MenuProfile({}) {
           >
             <Menu.Items
               static
-              className="absolute right-0 w-48 py-1 mt-2 origin-top-right bg-white rounded-md shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none"
+              className="absolute right-0 w-48 p-1 mt-2 origin-top-right bg-white rounded-sm shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none"
             >
               <Menu.Item>
                 {({ active }) => (
                   <button
                     onClick={() => signOut({ callbackUrl: "/" })}
                     className={classNames(
-                      active ? "bg-gray-100" : "",
-                      "block px-4 py-2 text-sm text-ui-gray-dark w-full text-left"
+                      active
+                        ? "bg-ui-gray-light rounded-sm text-ui-black"
+                        : "text-ui-gray-dark",
+                      "flex px-4 py-2 text-sm w-full"
                     )}
                   >
+                    <LogoutIcon
+                      className="w-5 h-5 mr-3 text-ui-gray-dark"
+                      aria-hidden="true"
+                    />
                     Sign Out
                   </button>
                 )}