Small changed to the sidebar

Ombi.UI/Helpers/BaseUrlHelper.cs

@@ -290,17 +290,19 @@ namespace Ombi.UI.Helpers
             return helper.Raw(asset);
         }
 
-        public static IHtmlString GetSidebarUrl(this HtmlHelpers helper, NancyContext context, string url, string title, bool dropdown = false)
+        public static IHtmlString GetSidebarUrl(this HtmlHelpers helper, NancyContext context, string url, string title, string icon = null)
         {
             var content = GetLinkUrl(GetBaseUrl());
             if (!string.IsNullOrEmpty(content))
             {
                 url = $"/{content}{url}";
             }
-            var dropdownClass = dropdown ? "list-group-item-dropdown" : string.Empty;
+
+
+            var iconHtml = string.IsNullOrEmpty(icon) ? "" : $"<span style=\"font-size:16px; \" class=\"pull-right hidden-xs showopacity {icon}\"></span>";
             var returnString = context.Request.Path == url
-                                      ? $"<a class=\"list-group-item {dropdownClass} active\" href=\"{url}\">{title}</a>" 
-                                      : $"<a class=\"list-group-item {dropdownClass}\" href=\"{url}\">{title}</a>";
+                                          ? $"<a class=\"list-group-item active\" href=\"{url}\">{title} {iconHtml}</a>"
+                                          : $"<a class=\"list-group-item\" href=\"{url}\">{title} {iconHtml}</a>";
 
             return helper.Raw(returnString);
         }

Ombi.UI/Views/Shared/Partial/_Sidebar.cshtml

@@ -2,34 +2,62 @@
 @Html.LoadSettingsAssets()
 <div class="col-lg-3 col-md-3 col-sm-4">
     <div class="list-group table-of-contents">
-        @Html.GetSidebarUrl(Context, "/admin/about", "About")
-        @Html.GetSidebarUrl(Context, "/admin", "Ombi Configuration")
-        @Html.GetSidebarUrl(Context, "/admin/customization", "Customization")
-        @Html.GetSidebarUrl(Context, "/admin/landingpage", "Landing Page")
-        @Html.GetSidebarUrl(Context, "/admin/authentication", "Authentication")
-        @Html.GetSidebarUrl(Context, "/admin/usermanagementsettings", "User Management Settings")
-        @Html.GetSidebarUrl(Context, "/admin/plex", "Plex")
-        @Html.GetSidebarUrl(Context, "/admin/couchpotato", "CouchPotato")
-        @Html.GetSidebarUrl(Context, "/admin/watcher", "Watcher (beta)")
-        @Html.GetSidebarUrl(Context, "/admin/radarr", "Radarr (beta)")
-        @Html.GetSidebarUrl(Context, "/admin/sonarr", "Sonarr")
-        @Html.GetSidebarUrl(Context, "/admin/sickrage", "SickRage")
-        @Html.GetSidebarUrl(Context, "/admin/headphones", "Headphones (beta)")
-        @Html.GetSidebarUrl(Context, "/admin/newsletter", "Newsletter Settings")
-
-        <div class="dropdown">
-            <a href="#" class="dropdown-toggle list-group-item " data-toggle="dropdown">Notifications <span class="caret"></span><span style="font-size:16px;" class="pull-right hidden-xs showopacity glyphicon glyphicon-envelope"></span></a>
-            <ul class="dropdown-menu" role="menu">
+        @Html.GetSidebarUrl(Context, "/admin/about", "About", "glyphicon glyphicon-info-sign")
+        @Html.GetSidebarUrl(Context, "/admin", "Ombi Configuration", "glyphicon glyphicon-ok-sign")
+        @Html.GetSidebarUrl(Context, "/admin/customization", "Customization", "glyphicon glyphicon-tasks")
+        @Html.GetSidebarUrl(Context, "/admin/landingpage", "Landing Page", "glyphicon glyphicon-dashboard")
+        @Html.GetSidebarUrl(Context, "/admin/authentication", "Authentication", "glyphicon glyphicon-lock")
+        @Html.GetSidebarUrl(Context, "/admin/usermanagementsettings", "User Management Settings", "glyphicon glyphicon-user")
+        @Html.GetSidebarUrl(Context, "/admin/plex", "Plex", "glyphicon glyphicon-play-circle")
+        @Html.GetSidebarUrl(Context, "/admin/couchpotato", "CouchPotato", "glyphicon glyphicon-film")
+        @Html.GetSidebarUrl(Context, "/admin/watcher", "Watcher (beta)", "glyphicon glyphicon-film")
+        @Html.GetSidebarUrl(Context, "/admin/radarr", "Radarr (beta)", "glyphicon glyphicon-film")
+        @Html.GetSidebarUrl(Context, "/admin/sonarr", "Sonarr", "fa fa-tv")
+        @Html.GetSidebarUrl(Context, "/admin/sickrage", "SickRage", "fa fa-tv")
+        @Html.GetSidebarUrl(Context, "/admin/headphones", "Headphones (beta)", "glyphicon glyphicon-headphones")
+        @Html.GetSidebarUrl(Context, "/admin/newsletter", "Newsletter Settings", "fa fa-newspaper-o")
+        <div id="sidebar" >
+
+            <a href="#notifications" class="list-group-item" data-parent="#sidebar">
+                Notifications <span class="caret"></span><span style="font-size:16px;" class="pull-right hidden-xs showopacity glyphicon glyphicon-envelope"></span>
+            </a>
+
+            <div id="notifications" class="list-group subitem collapse">
+
+
                 @Html.GetSidebarUrl(Context, "/admin/emailnotification", "Email Notifications")
-                @Html.GetSidebarUrl(Context, "/admin/pushbulletnotification", "Pushbullet Notifications")
-                @Html.GetSidebarUrl(Context, "/admin/pushovernotification", "Pushover Notifications")
-                @Html.GetSidebarUrl(Context, "/admin/slacknotification", "Slack Notifications")
-                @Html.GetSidebarUrl(Context, "/admin/discordnotification", "Discord Notifications")
-            </ul>
+
+
+                @Html.GetSidebarUrl(Context, "/admin/pushbulletnotification", "Pushbullet Notifications","fa fa-bell-o")
+                @Html.GetSidebarUrl(Context, "/admin/pushovernotification", "Pushover Notifications", "fa fa-bell-o")
+                @Html.GetSidebarUrl(Context, "/admin/slacknotification", "Slack Notifications", "fa fa-slack")
+                @Html.GetSidebarUrl(Context, "/admin/discordnotification", "Discord Notifications", "fa fa-bell-o")
+
+            </div>
         </div>
-        @Html.GetSidebarUrl(Context, "/admin/logs", "Logs")
-        @Html.GetSidebarUrl(Context, "/admin/status", "Status")
-        @Html.GetSidebarUrl(Context, "/admin/scheduledjobs", "Scheduled Jobs")
-        @Html.GetSidebarUrl(Context, "/admin/faultqueue", "Request Fault Queue")
+
+
+        @Html.GetSidebarUrl(Context, "/admin/logs", "Logs", "fa fa-edit")
+        @Html.GetSidebarUrl(Context, "/admin/status", "Status", "fa fa-dashboard")
+        @Html.GetSidebarUrl(Context, "/admin/scheduledjobs", "Scheduled Jobs", "fa fa-hand-spock-o")
+        @Html.GetSidebarUrl(Context, "/admin/faultqueue", "Request Fault Queue", "fa fa-history")
     </div>
+
+
 </div>
+
+<script>
+    $('#sidebar > a').on('click', function (e) {
+        e.preventDefault();
+
+        if (!$(this).hasClass("active")) {
+            var lastActive = $(this).closest("#sidebar").children(".active");
+            lastActive.removeClass("active");
+            lastActive.next('div').collapse('hide');
+            $(this).addClass("active");
+            $(this).next('div').collapse('show');
+
+        }
+
+    });
+</script>