Changes in Top Menu - added side bar with store options (currecy, lan…

…guage, my-account, etc.)

Grand.Web/Views/Shared/Components/AdminHeaderLinks/Default.cshtml

@@ -3,32 +3,28 @@
 {
     @if (Model.IsCustomerImpersonated)
     {
-        <li class="nav-item col d-flex align-items-center">
-            <span class="impersonated-text">@string.Format(T("Account.ImpersonatedAs").Text, Model.ImpersonatedCustomerEmailUsername)</span>
-            <a class="nav-link finish-impersonation p-0" href="@Url.RouteUrl("Logout")" title="@T("Account.ImpersonatedAs.Finish.Hint")">
-                <span class="mdi mdi-close pl-2"></span>
+        <li class="nav-item">
+            <a class="d-flex align-items-center nav-link btn btn-secondary" href="@Url.RouteUrl("Logout")" title="@T("Account.ImpersonatedAs.Finish.Hint")">
+                <span class="mdi mdi-close"></span>
+                <span class="text text-uppercase ml-3">@string.Format(T("Account.ImpersonatedAs").Text, Model.ImpersonatedCustomerEmailUsername)</span>
             </a>
         </li>
     }
     @if (Model.DisplayAdminLink)
     {
-        <li class="nav-item col d-flex">
-            <a class="nav-link" href="@Url.Content("~/Admin")">
-                <span class="hl-label">
-                    <span class="mdi mdi-settings pr-1"></span>
-                </span>
-                <span class="d-lg-none d-block text-muted mobile-desc">@T("admin")</span>
+        <li class="nav-item">
+            <a class="d-flex align-items-center nav-link btn btn-secondary" href="@Url.Content("~/Admin")">
+                <span class="mdi mdi-settings"></span>
+                <span class="text text-uppercase ml-3">@T("admin")</span>
             </a>
         </li>
     }
     @if (!string.IsNullOrEmpty(Model.EditPageUrl))
     {
-        <li class="nav-item col d-sm-flex d-none">
-            <a target="_blank" class="nav-link edit-page" href="@Model.EditPageUrl">
-                <span class="hl-label">
-                    <span class="mdi mdi-wrench-outline"></span>
-                </span>
-                <span class="d-lg-none d-block text-muted mobile-desc">@T("edit")</span>
+        <li class="nav-item">
+            <a target="_blank" class="d-flex align-items-center nav-link btn btn-secondary" href="@Model.EditPageUrl">
+                <span class="mdi mdi-wrench-outline"></span>
+                <span class="text text-uppercase ml-3">@T("edit")</span>
             </a>
         </li>
     }

Grand.Web/Views/Shared/Components/CurrencySelector/Default.cshtml

@@ -13,18 +13,18 @@
                  Selected = x.Id.Equals(Model.CurrentCurrencyId)
              });
             <div class="btn-group btn-group-sm float-xs-right">
-                <button type="button" class="btn dropdown-toggle dropdown-toggle-split" data-toggle="dropdown">
+                <button type="button" class="btn dropdown-toggle" data-toggle="dropdown">
                     @currencies.FirstOrDefault(x => x.Selected).Text
                     <span class="sr-only">Toggle Dropdown</span>
                     <span class="mdi mdi-chevron-down"></span>
                 </button>
-                <div class="dropdown-menu dropdown-menu-right">
+                <div class="dropdown-menu">
                     <ul class="pl-0 mb-0">
                         @foreach (var item in currencies)
                         {
                             var className = item.Selected ? "active" : "";
                             <li class="@className">
-                                <a href="@item.Value">@item.Text</a>
+                                <a class="text-dark" href="@item.Value">@item.Text</a>
                             </li>
                         }
                     </ul>

Grand.Web/Views/Shared/Components/HeaderLinks/Default.cshtml

@@ -1,45 +1,53 @@
 @model HeaderLinksModel
 @using System.Text.Encodings.Web
+@{
+    var registerUrl = Url.RouteUrl("Register", new { returnUrl = this.Context.Request.Query["returnUrl"] });
+}
+
 @await Component.InvokeAsync("Widget", new { widgetZone = "header_links_before" })
 @if (Model.IsAuthenticated)
 {
     @await Component.InvokeAsync("AdminHeaderLinks")
-    <li class="nav-item col d-flex">
-        <a class="ico-account nav-link d-flex justify-content-center" href="@Url.RouteUrl("CustomerInfo")">
-            <span class="hl-label"><span class="mdi mdi-account-circle"></span></span>
-            <span class="d-flex align-items-center mobile-desc">@T("Account.MyAccount")</span>
+    <li class="nav-item">
+        <a class="d-flex align-items-center nav-link btn btn-secondary" href="@Url.RouteUrl("CustomerInfo")">
+            <span class="mdi mdi-account-circle"></span>
+            <span class="text text-uppercase ml-3">@T("Account.MyAccount")</span>
         </a>
     </li>
-    <li class="nav-item col d-flex">
-        <a class="nav-link ico-logout" href="@Url.RouteUrl("Logout")">
-            <span class="hl-label">
-                <span class="mdi mdi-lock"></span>
-            </span>
-            <span class="d-flex align-items-center mobile-desc">@T("Account.Logout")</span>
+    @if (Model.AllowPrivateMessages)
+    {
+        <li class="nav-item">
+            <a class="d-flex align-items-center nav-link btn btn-secondary" href="@Url.RouteUrl("PrivateMessages", new { tab = "" })">
+                <span class="mdi mdi-email"></span>
+                <span class="text text-uppercase ml-3">@T("PrivateMessages.Inbox")</span>
+                <span class="inbox-unread">@Model.UnreadPrivateMessages</span>
+            </a>
+        </li>
+    }
+    <li class="nav-item">
+        <a class="d-flex align-items-center nav-link btn btn-secondary" href="@Url.RouteUrl("Logout")">
+            <span class="mdi mdi-lock"></span>
+            <span class="text text-uppercase ml-3">@T("Account.Logout")</span>
         </a>
     </li>
 }
 else
 {
-    <li class="nav-item col d-flex">
-        <a class="nav-link" href="@Url.RouteUrl("Login")">
-            <span class="hl-label">
-                <span class="mdi mdi-lock-open"></span>
-            </span>
-            <span class="d-flex align-items-center mobile-desc">@T("Account.Login")</span>
+    <li class="nav-item mb-4">
+        <h5>@T("Account.Login.ReturningCustomer")</h5>
+        <a class="d-flex align-items-center nav-link btn btn-secondary" href="@Url.RouteUrl("Login")">
+            <span class="mdi mdi-lock-open"></span>
+            <span class="text text-uppercase ml-3">@T("Account.Login")</span>
         </a>
     </li>
-}
-@if (Model.AllowPrivateMessages)
-{
-    <li class="nav-item col d-flex">
-        <a class="nav-link" href="@Url.RouteUrl("PrivateMessages", new { tab = "" })">
-            <span class="hl-label">
-                <span class="mdi mdi-email"></span>
-            </span>
-            <span class="inbox-label d-none d-lg-flex align-items-center">@T("PrivateMessages.Inbox")</span>
-            <span class="inbox-unread d-none d-lg-flex align-items-center">@Model.UnreadPrivateMessages</span>
-            <span class="d-lg-none d-flex align-items-center text-muted mobile-desc">@T("PrivateMessages.Inbox")</span>
+    <li class="nav-item">
+        <h5>@T("Account.Login.NewCustomer")</h5>
+        <div class="text generalMarginSupporter">
+            @T("Account.Login.NewCustomerText")
+        </div>
+        <a class="d-flex align-items-center nav-link btn btn-secondary" href="@registerUrl">
+            <span class="mdi mdi-account-plus-outline"></span>
+            <span class="text text-uppercase ml-3">@T("Account.Register")</span>
         </a>
     </li>
 }

Grand.Web/Views/Shared/Components/LanguageSelector/Default.cshtml

@@ -30,20 +30,20 @@
         });
 
         <div class="language-selector d-block btn-group btn-group-sm float-xs-right pr-1">
-            <button type="button" class="btn dropdown-toggle dropdown-toggle-split" data-toggle="dropdown">
+            <button type="button" class="btn dropdown-toggle" data-toggle="dropdown">
                 <span>
                     @languages.FirstOrDefault(x => x.Selected).Text
                 </span>
                 <span class="sr-only">Toggle Dropdown</span>
                 <span class="mdi mdi-chevron-down"></span>
             </button>
-            <div class="dropdown-menu dropdown-menu-right">
+            <div class="dropdown-menu">
                 <ul class="pl-0 mb-0">
                     @foreach (var item in languages)
                     {
                         var className = item.Selected ? "active" : "";
                         <li class="@className">
-                            <a href="@item.Value">@item.Text</a>
+                            <a class="text-dark" href="@item.Value">@item.Text</a>
                         </li>
                     }
                 </ul>

Grand.Web/Views/Shared/Components/SearchBox/Default.cshtml

@@ -70,3 +70,6 @@
 
     @await Component.InvokeAsync("Widget", new { widgetZone = "searchbox" })
 </form>
+<a class="mobile-search-trigger d-lg-none d-flex" data-toggle="modal" data-target="#searchModal">
+    <span class="mdi mdi-magnify"></span>
+</a>

Grand.Web/Views/Shared/Components/ShoppingCartLinks/Default.cshtml

@@ -3,14 +3,11 @@
     <ul class="shopping-links">
         @if (Model.WishlistEnabled)
         {
-            <li class="nav-item wishlist-container">
+            <li class="nav-item wishlist-container d-lg-block d-none">
                 <a class="nav-link" href="@Url.RouteUrl("Wishlist")">
                     <span class="wishlist-label hl-label">
                         <span class="mdi mdi-heart-outline"></span>
                     </span>
-                    <span class="d-flex align-items-center wish-name mobile-desc">
-                        @T("Wishlist")
-                    </span>
                     <span class="wishlist-qty d-none d-lg-flex">@T("Wishlist.HeaderQuantity", Model.WishlistItems)</span>
                 </a>
             </li>
@@ -23,9 +20,6 @@
                         <span class="cart-label hl-label">
                             <span class="mdi mdi-cart-outline"></span>
                         </span>
-                        <span class="d-flex align-items-center cart-name mobile-desc">
-                            @T("ShoppingCart")
-                        </span>
                         <span class="cart-qty">@T("ShoppingCart.HeaderQuantity", Model.ShoppingCartItems)</span>
                     </a>
                 </div>

Grand.Web/Views/Shared/Components/StoreSelector/Default.cshtml

@@ -9,20 +9,20 @@
         Value = Url.RouteUrl("ChangeStore", new { store = x.Id, returnUrl = webHelper.GetRawUrl(Context.Request) }),
     });
     <div class="store-selector d-block btn-group btn-group-sm float-xs-right pr-1">
-        <button type="button" class="btn dropdown-toggle dropdown-toggle-split" data-toggle="dropdown">
+        <button type="button" class="btn dropdown-toggle" data-toggle="dropdown">
             <span>
                 @stores.FirstOrDefault(x => x.Selected).Name
             </span>
             <span class="sr-only">Toggle Dropdown</span>
             <span class="mdi mdi-chevron-down"></span>
         </button>
-        <div class="dropdown-menu dropdown-menu-right">
+        <div class="dropdown-menu">
             <ul class="pl-0 mb-0">
                 @foreach (var item in stores)
                 {
                     var className = item.Selected ? "active" : "";
                     <li class="@className">
-                        <a href="@item.Value">@item.Name</a>
+                        <a class="text-dark" href="@item.Value">@item.Name</a>
                     </li>
                 }
             </ul>

Grand.Web/Views/Shared/Components/TaxTypeSelector/Default.cshtml

@@ -17,18 +17,18 @@
     });
 }
 <div class="btn-group btn-group-sm float-xs-right pr-1 d-flex tax-type-button">
-    <button type="button" class="btn dropdown-toggle dropdown-toggle-split" data-toggle="dropdown">
+    <button type="button" class="btn dropdown-toggle" data-toggle="dropdown">
         <span>@taxTypes.FirstOrDefault(x => x.Selected).Text</span>
         <span class="sr-only">Toggle Dropdown</span>
         <span class="mdi mdi-chevron-down"></span>
     </button>
-    <div class="dropdown-menu dropdown-menu-left tax">
+    <div class="dropdown-menu tax">
         <ul class="pl-0 mb-0">
             @foreach (var item in taxTypes)
             {
                 var className = item.Selected ? "active" : "";
                 <li class="@className">
-                    <a href="@item.Value">@item.Text</a>
+                    <a class="text-dark" href="@item.Value">@item.Text</a>
                 </li>
             }
         </ul>

Grand.Web/Views/Shared/Components/TopMenu/Default.cshtml

@@ -22,12 +22,18 @@
     }
     @if (Model.Manufacturers.Any())
     {
-        <li class="nav-item dropdown manufacturer-items d-lg-flex d-none">
-            <a class="nav-link dropdown-toggle" href="@Url.RouteUrl("ManufacturerList")" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+        <li class="nav-item dropdown manufacturer-items">
+            <a class="nav-link dropdown-toggle" href="@Url.RouteUrl("ManufacturerList")" aria-haspopup="true" aria-expanded="false">
                 <span>@T("Manufacturers.Menu")</span>
                 <span class="mdi mdi-chevron-down arrow-down"></span>
             </a>
             <ul class="dropdown-menu manufacturer-dropdown first-level">
+                <li class="nav-item cat-back d-lg-none d-inline-flex">
+                    <a class="nav-link justify-content-start align-items-center">
+                        <span class="mdi mdi-arrow-left"></span>
+                        <span>@T("Mobile.Categories.Back")</span>
+                    </a>
+                </li>
                 @foreach (var manuf in Model.Manufacturers)
                 {
                     <li class="nav-item">

Grand.Web/Views/Shared/Header.cshtml

@@ -1,41 +1,19 @@
 <header role="presentation">
     @await Component.InvokeAsync("Widget", new { widgetZone = "header" })
-    <nav class="navbar fixed-top navbar-light navUp mobile-top p-0" role="navigation">
-        <ul class="mobile-top-menu container px-2 px-sm-0 d-lg-none d-flex mb-0">
-            <li class="logo-mobile"></li>
-            <li class="nav-item d-flex align-items-center d-lg-none mobile-search" data-toggle="modal" data-target="#searchModal">
-                <a class="nav-link">
-                    <span class="mdi mdi-magnify"></span>
-                </a>
-            </li>
-        </ul>
-        <ul class="nav navbar-nav header-links flex-row container px-lg-3 px-0">
-            <li class="nav-item col d-lg-none d-flex menu-open-button">
-                <a class="js-offcanvas-trigger nav-link" data-offcanvas-trigger="left" href="#left">
-                    <div id="mobile-menu-opener"><span></span><span></span><span></span></div>
-                    <span class="d-lg-none d-block text-muted mobile-desc">@T("Mobile.Menu")</span>
-                </a>
-            </li>
-            <li class="nav-item float-xs-right mr-auto dropdowns-container">
-                <div class="generalDropDown btn-toolbar float-xs-right">
-                    @await Component.InvokeAsync("TaxTypeSelector")
-                    @await Component.InvokeAsync("CurrencySelector")
-                    @await Component.InvokeAsync("LanguageSelector")
-                    @await Component.InvokeAsync("StoreSelector")
-                    @await Component.InvokeAsync("Widget", new { widgetZone = "header_selectors" })
-                </div>
-            </li>
-            @await Component.InvokeAsync("HeaderLinks")
-        </ul>
-    </nav>
     <div class="container">
         <div class="headBottom d-flex align-items-center d-lg-inline-flex text-lg-left text-center mt-0 mb-0">
-            <div class="header-logo pr-0 pl-0 d-lg-inline-flex align-items-center d-none">
+            <a class="js-offcanvas-trigger mobile-menu-trigger d-lg-none d-flex justify-content-center align-content-center mr-3" data-offcanvas-trigger="mobile_menu" href="#mobile_menu">
+                <span class="mdi mdi-menu"></span>
+            </a>
+            <div class="header-logo pr-0 pl-0 mx-lg-0 mx-auto d-inline-flex align-items-center">
                 @await Component.InvokeAsync("Logo")
             </div>
-            <div class="col formSearch ml-auto pr-0 d-none d-lg-inline-flex align-items-end">
-                @await Component.InvokeAsync("SearchBox")            
-            </div>    
+            <div class="formSearch ml-lg-auto ml-2 pl-lg-3 pl-0 d-inline-flex align-items-end">
+                @await Component.InvokeAsync("SearchBox")
+            </div>
+            <a class="js-offcanvas-trigger user-panel-trigger d-flex justify-content-center align-content-center ml-lg-3 ml-2" data-offcanvas-trigger="user_panel" href="#user_panel">
+                <span class="mdi mdi-account-outline"></span>
+            </a>
             @await Component.InvokeAsync("ShoppingCartLinks")
         </div>
     </div>

Grand.Web/Views/Shared/_CategoryLine.TopMenu.cshtml

@@ -1,7 +1,7 @@
 @model TopMenuModel.CategoryLineModel
     <li class="@(Model.Category.SubCategories.Count() == 0 ? "nav-item": "nav-item dropdown" )">
 
-        <a id="@Model.Category.Id-menu" class="@(Model.Category.SubCategories.Count() == 0 ? "nav-link": "nav-link dropdown-toggle")  @(Model.Category.IncludeInTopMenu ? "": "d-lg-none")" @(Model.Category.SubCategories.Count() == 0 ? "" : "data-toggle=dropdown aria-haspopup=true aria-expanded=false") href="@Url.RouteUrl("Category", new { SeName = Model.Category.SeName })">
+        <a id="@Model.Category.Id-menu" class="@(Model.Category.SubCategories.Count() == 0 ? "nav-link": "nav-link dropdown-toggle")  @(Model.Category.IncludeInTopMenu ? "": "d-lg-none")" @(Model.Category.SubCategories.Count() == 0 ? "" : "aria-haspopup=true aria-expanded=false") href="@Url.RouteUrl("Category", new { SeName = Model.Category.SeName })">
             @if (!string.IsNullOrEmpty(Model.Category.Icon))
             {
                 <span class="category-icon @Model.Category.Icon"></span>
@@ -11,13 +11,13 @@
             {
                 <span class="mdi mdi-chevron-down arrow-down"></span>
             }
+            @if (!string.IsNullOrEmpty(Model.Category.FlagStyle))
+            {
+                <label class="badge @Model.Category.FlagStyle">@Model.Category.Flag</label>
+            }
         </a>
 
 
-        @if (!string.IsNullOrEmpty(Model.Category.FlagStyle))
-        {
-            <label class="badge @Model.Category.FlagStyle">@Model.Category.Flag</label>
-        }
         @{
             //subcategories
             var subCategories =
@@ -56,7 +56,7 @@
                             </li>
                             <li class="nav-item d-lg-none d-inline-flex sub-cat-name-container">
                                 <a class="nav-link sub-cat-name" href="@Url.RouteUrl("Category", new { SeName = Model.Category.SeName })">
-                                    <span><strong>@T("Mobile.Category.Show") @Model.Category.Name</strong></span>
+                                    <span>@T("Mobile.Category.Show") @Model.Category.Name</span>
                                 </a>
                             </li>
                             @foreach (var subCategory in subCategories)
@@ -87,7 +87,7 @@
                     </li>
                     <li class="nav-item d-lg-none d-inline-flex sub-cat-name-container">
                         <a class="nav-link sub-cat-name" href="@Url.RouteUrl("Category", new { SeName = Model.Category.SeName })">
-                            <span><strong>@T("Mobile.Category.Show") @Model.Category.Name</strong></span>
+                            <span>@T("Mobile.Category.Show") @Model.Category.Name</span>
                         </a>
                     </li>
                     @foreach (var subCategory in subCategories)