From c58234db5a36bf281a89e0f2df6fa73ce927f5c6 Mon Sep 17 00:00:00 2001
From: "zaccaria.majid" <zaccaria.majid@egalware.com>
Date: Mon, 6 Feb 2023 16:58:20 +0100
Subject: [PATCH] fix grafici

---
 .../StockMan.CORE/Components/NewNavMenu.razor | 44 ++++++++++---------
 .../Components/NewNavMenu.razor.cs            |  4 ++
 .../Components/NewNavMenu.razor.css           | 24 +++++-----
 .../Components/NewNavMenu.razor.less          | 25 ++++++-----
 .../Components/NewNavMenu.razor.min.css       |  2 +-
 .../wwwroot/lib/menuCompression.js            |  5 +++
 6 files changed, 59 insertions(+), 45 deletions(-)

diff --git a/StockMan.CORE/StockMan.CORE/Components/NewNavMenu.razor b/StockMan.CORE/StockMan.CORE/Components/NewNavMenu.razor
index f782d8b..ecec4ae 100644
--- a/StockMan.CORE/StockMan.CORE/Components/NewNavMenu.razor
+++ b/StockMan.CORE/StockMan.CORE/Components/NewNavMenu.razor
@@ -25,10 +25,10 @@
             {
                 @foreach (var item in NavMenuLinks)
                 {
-                    <div class="navItem">
+                    <div>
                         @if (item.hasChildren)
                         {
-                            <div>
+                            <div class="navLinkItem" @onclick="()=>doShowChildren(item.Title)">
                                 @if (!isComp)
                                 {
                                     <h5 class=""><i class="@item.Icon px-2"></i>@item.Title</h5>
@@ -37,29 +37,31 @@
                                 {
                                     <i class="@item.Icon"></i>
                                 }
-                                @foreach (var link in item.linkChildren)
-                                {
-                                    @if (!isComp)
-                                    {
-                                        <div class="linkChildren">
-                                            <h6 class="navLinkChildrenText">@link</h6>
-                                        </div>
-                                    }
-                                }
                             </div>
+                            @foreach (var link in item.linkChildren)
+                            {
+                                @if (!isComp)
+                                {
+                                    <div class="linkChildren" id="@item.Title">
+                                        <h6 class="navLinkChildrenText">@link</h6>
+                                    </div>
+                                }
+                            }
                         }
                         else
                         {
-                            <NavLink href="@item.Title" class="navLinkItem" style="text-decoration: none; color: #000;">
-                                @if (!isComp)
-                                {
-                                    <h5 class=""><i class="@item.Icon px-2"></i>@item.Title</h5>
-                                }
-                                else
-                                {
-                                    <i class="@item.Icon"></i>
-                                }
-                            </NavLink>
+                            <a href="@item.Title" style="text-decoration: none; color: #000;">
+                                <div class="navLinkItem">
+                                    @if (!isComp)
+                                    {
+                                        <h5 class=""><i class="@item.Icon px-2"></i>@item.Title</h5>
+                                    }
+                                    else
+                                    {
+                                        <i class="@item.Icon"></i>
+                                    }
+                                </div>
+                            </a>
                         }
                     </div>
                 }
diff --git a/StockMan.CORE/StockMan.CORE/Components/NewNavMenu.razor.cs b/StockMan.CORE/StockMan.CORE/Components/NewNavMenu.razor.cs
index 74b442e..e055633 100644
--- a/StockMan.CORE/StockMan.CORE/Components/NewNavMenu.razor.cs
+++ b/StockMan.CORE/StockMan.CORE/Components/NewNavMenu.razor.cs
@@ -32,6 +32,10 @@ namespace StockMan.CORE.Components
             JSRuntime.InvokeVoidAsync("closeNav");
             isComp = true;
         }
+        protected void doShowChildren(string id)
+        {
+            JSRuntime.InvokeVoidAsync("doShowChildren", id);
+        }
         protected void deCompress()
         {
             JSRuntime.InvokeVoidAsync("openNav");
diff --git a/StockMan.CORE/StockMan.CORE/Components/NewNavMenu.razor.css b/StockMan.CORE/StockMan.CORE/Components/NewNavMenu.razor.css
index 1301bdf..c70fa27 100644
--- a/StockMan.CORE/StockMan.CORE/Components/NewNavMenu.razor.css
+++ b/StockMan.CORE/StockMan.CORE/Components/NewNavMenu.razor.css
@@ -10,7 +10,7 @@
   border-radius: 1.5rem;
   background-color: #F0F0F0;
   box-shadow: 3px 3px 10px 0px #D1D1D1;
-  transition: 0.5s;
+  transition: 0.35s;
 }
 #myBtn {
   transition: 0.25s;
@@ -21,6 +21,7 @@
   text-align: center;
   display: flex;
   justify-content: space-between;
+  transition: 1s;
 }
 .icon {
   margin-top: 0.5rem;
@@ -37,9 +38,6 @@
   display: grid;
   height: 100%;
 }
-.links .navItem {
-  padding: 1rem;
-}
 .decoration {
   text-decoration: none;
 }
@@ -56,17 +54,19 @@
   width: 50%;
   transition: 0.25s;
 }
-@keyframes navBtnShow {
-  0% {
-    display: none;
-  }
-  100% {
-    display: block;
-  }
-}
 .linkChildren {
   align-content: center;
+  height: 0%;
+  display: none;
+  transition: 1s;
 }
 .navLinkItem {
   text-decoration: none;
+  padding: 1rem;
+  border-radius: 1rem;
+  transition: background-color 300ms ease-out 100ms;
+}
+.navLinkItem:hover {
+  background-color: rgba(179, 157, 219, 0.2);
+  color: #7e57c2;
 }
\ No newline at end of file
diff --git a/StockMan.CORE/StockMan.CORE/Components/NewNavMenu.razor.less b/StockMan.CORE/StockMan.CORE/Components/NewNavMenu.razor.less
index bbd5288..0e45626 100644
--- a/StockMan.CORE/StockMan.CORE/Components/NewNavMenu.razor.less
+++ b/StockMan.CORE/StockMan.CORE/Components/NewNavMenu.razor.less
@@ -10,7 +10,7 @@
     border-radius: 1.5rem;
     background-color: #F0F0F0;
     box-shadow: 3px 3px 10px 0px #D1D1D1;
-    transition: 0.5s;
+    transition: 0.35s;
 }
 
 #myBtn {
@@ -23,6 +23,7 @@
     text-align: center;
     display: flex;
     justify-content: space-between;
+    transition: 1s;
 }
 
 .icon {
@@ -44,7 +45,7 @@
 }
 
 .links .navItem {
-    padding: 1rem;
+    
     //margin-right: 50%;
 }
 
@@ -67,20 +68,22 @@
     transition: 0.25s;
 }
 
-@keyframes navBtnShow {
-    0% {
-        display: none;
-    }
-
-    100% {
-        display: block;
-    }
-}
 
 .linkChildren {
     align-content: center;
+    height: 0%;
+    display: none;
+    transition: 1s;
 }
 
 .navLinkItem {
     text-decoration: none;
+    padding: 1rem;
+    border-radius: 1rem;
+    transition: background-color 300ms ease-out 100ms
+}
+
+.navLinkItem:hover {
+    background-color: rgba(179, 157, 219, 0.2);
+    color: rgb(126, 87, 194);
 }
diff --git a/StockMan.CORE/StockMan.CORE/Components/NewNavMenu.razor.min.css b/StockMan.CORE/StockMan.CORE/Components/NewNavMenu.razor.min.css
index a9036f4..488c6ed 100644
--- a/StockMan.CORE/StockMan.CORE/Components/NewNavMenu.razor.min.css
+++ b/StockMan.CORE/StockMan.CORE/Components/NewNavMenu.razor.min.css
@@ -1 +1 @@
-.navMenu{background-color:#f00;height:100%;width:100%;margin:.8rem .8rem .8rem .8rem;padding:1rem;width:18rem;height:97vh;position:sticky;border-radius:1.5rem;background-color:#f0f0f0;box-shadow:3px 3px 10px 0 #d1d1d1;transition:.5s;}#myBtn{transition:.25s;border:0;background:none;}.title{text-align:center;display:flex;justify-content:space-between;}.icon{margin-top:.5rem;padding:.8rem;background-color:#d9d9d9;border-radius:50%;}.title h4{margin-top:.7rem;}.links{align-content:center;text-align:center;display:grid;height:100%;}.links .navItem{padding:1rem;}.decoration{text-decoration:none;}.bot{position:absolute;bottom:1rem;}.navLinkIcon{padding:0;margin:0;}.navLinkIcon,.navLinkText{width:50%;transition:.25s;}@keyframes navBtnShow{0%{display:none;}100%{display:block;}}.linkChildren{align-content:center;}.navLinkItem{text-decoration:none;}
\ No newline at end of file
+.navMenu{background-color:#f00;height:100%;width:100%;margin:.8rem .8rem .8rem .8rem;padding:1rem;width:18rem;height:97vh;position:sticky;border-radius:1.5rem;background-color:#f0f0f0;box-shadow:3px 3px 10px 0 #d1d1d1;transition:.35s;}#myBtn{transition:.25s;border:0;background:none;}.title{text-align:center;display:flex;justify-content:space-between;transition:1s;}.icon{margin-top:.5rem;padding:.8rem;background-color:#d9d9d9;border-radius:50%;}.title h4{margin-top:.7rem;}.links{align-content:center;text-align:center;display:grid;height:100%;}.decoration{text-decoration:none;}.bot{position:absolute;bottom:1rem;}.navLinkIcon{padding:0;margin:0;}.navLinkIcon,.navLinkText{width:50%;transition:.25s;}.linkChildren{align-content:center;height:0%;display:none;transition:1s;}.navLinkItem{text-decoration:none;padding:1rem;border-radius:1rem;transition:background-color 300ms ease-out 100ms;}.navLinkItem:hover{background-color:rgba(179,157,219,.2);color:#7e57c2;}
\ No newline at end of file
diff --git a/StockMan.CORE/StockMan.CORE/wwwroot/lib/menuCompression.js b/StockMan.CORE/StockMan.CORE/wwwroot/lib/menuCompression.js
index 8bd3a4b..8b8cc6c 100644
--- a/StockMan.CORE/StockMan.CORE/wwwroot/lib/menuCompression.js
+++ b/StockMan.CORE/StockMan.CORE/wwwroot/lib/menuCompression.js
@@ -5,4 +5,9 @@ function openNav() {
 
 function closeNav() {
     document.getElementById("mySidebar").style.width = "5rem";
+}
+
+function doShowChildren(id) {
+    document.getElementById(id).style.display = "block";
+    document.getElementsByClassName("linkChildren").style.height = "100%";
 }
\ No newline at end of file