From 9459ff9745100079b3f66acf7a7cbd153dfd91f4 Mon Sep 17 00:00:00 2001
From: Alex P <thealexpaxton@gmail.com>
Date: Tue, 29 Aug 2017 18:34:39 -0700
Subject: [PATCH] Highlight logo square when viewing status page

---
 ui/src/side_nav/containers/SideNav.js |  6 +++++-
 ui/src/style/layout/sidebar.scss      | 10 ++++++++++
 2 files changed, 15 insertions(+), 1 deletion(-)

diff --git a/ui/src/side_nav/containers/SideNav.js b/ui/src/side_nav/containers/SideNav.js
index e782bd404d..7b8597470d 100644
--- a/ui/src/side_nav/containers/SideNav.js
+++ b/ui/src/side_nav/containers/SideNav.js
@@ -69,10 +69,14 @@ const SideNav = React.createClass({
     const dataExplorerLink = `${sourcePrefix}/chronograf/data-explorer`
     const isUsingAuth = !!logoutLink
 
+    const isDefaultPage = location.split('/').includes(DEFAULT_HOME_PAGE)
+
     return isHidden
       ? null
       : <NavBar location={location}>
-          <div className="sidebar--item">
+          <div
+            className={isDefaultPage ? 'sidebar--item active' : 'sidebar--item'}
+          >
             <Link
               to={`${sourcePrefix}/${DEFAULT_HOME_PAGE}`}
               className="sidebar--square sidebar--logo"
diff --git a/ui/src/style/layout/sidebar.scss b/ui/src/style/layout/sidebar.scss
index 598b5ce407..941ef0fbf3 100644
--- a/ui/src/style/layout/sidebar.scss
+++ b/ui/src/style/layout/sidebar.scss
@@ -115,6 +115,16 @@ $sidebar-menu--gutter: 18px;
   background-color: $sidebar--logo-bg-hover;
   .sidebar--icon {color: $sidebar--logo-color-hover;}
 }
+.sidebar--item.active .sidebar--square.sidebar--logo {
+  background-color: $sidebar--logo-bg-hover;
+  .sidebar--icon {
+    color: $sidebar--logo-color-hover;
+    text-shadow:
+      0 0 9px $c-hydrogen,
+      0 0 15px $c-neutrino,
+      0 0 20px $c-yeti;
+  }
+}
 
 /*
     Sidebar Sub Menus