From 42ee36d8d94be9f7299454d437224054a55d0352 Mon Sep 17 00:00:00 2001
From: Rupin Khandelwal <rupin@omnivore.app>
Date: Mon, 15 Aug 2022 18:46:29 -0500
Subject: [PATCH] Adding background color to active item and cleaning up

---
 packages/web/styles/menu.css | 30 ++++++++++++++++--------------
 1 file changed, 16 insertions(+), 14 deletions(-)

diff --git a/packages/web/styles/menu.css b/packages/web/styles/menu.css
index e711cdca9..607f3f0b6 100644
--- a/packages/web/styles/menu.css
+++ b/packages/web/styles/menu.css
@@ -1,30 +1,32 @@
 /* Menu Override styles */
 
-.pro-sidebar > .pro-sidebar-inner, .pro-sidebar .pro-menu a {
-  background-color: var(--colors-libraryBackground);
-  color: var(--colors-utilityTextDefault);
-}
-
-.pro-sidebar .pro-menu > ul > .pro-sub-menu > .pro-inner-list-item {
-  color: var(--colors-utilityTextDefault);
+.pro-sidebar > .pro-sidebar-inner,
+.pro-menu,
+.pro-menu > ul > .pro-sub-menu > .pro-inner-list-item,
+.pro-sidebar .pro-menu .pro-menu-item.pro-sub-menu .pro-inner-list-item {
   background-color: var(--colors-libraryBackground);
 }
 
+.pro-sidebar .pro-menu .pro-menu-item > .pro-inner-item,
+.pro-sidebar .pro-menu-item .pro-sub-menu .pro-inner-item,
+.pro-sidebar .pro-menu .pro-menu-item > .pro-inner-item > .pro-item-content,
+.pro-sidebar .pro-menu a,
 .pro-sidebar .pro-menu a:hover {
   color: var(--colors-utilityTextDefault);
 }
 
-.pro-sidebar .pro-menu .pro-menu-item > .pro-inner-item {
-  padding: 8px 20px 3px 20px;
+.pro-menu .pro-menu-item > .pro-inner-item {
+  padding: 5px 20px;
 }
 
-/* .pro-sidebar .pro-menu .active > .pro-inner-item {
-  background-color: #F8F8F8;
-  border-radius: 8px;
-} */
-
 .pro-sidebar .pro-menu .pro-menu-item > .pro-inner-item > .pro-icon-wrapper {
   width: 20px;
   min-width: 0;
   height: 25px;
 }
+
+.pro-sidebar .pro-menu .pro-menu-item.active {
+  background-color: var(--colors-libraryActiveMenuItem);
+  width: 90%;
+  border-radius: 5px;
+}