diff --git a/web/app/css/sidebar.css b/web/app/css/sidebar.css
index 776092e25..b93a6de00 100644
--- a/web/app/css/sidebar.css
+++ b/web/app/css/sidebar.css
@@ -8,13 +8,21 @@
   background-repeat: no-repeat;
   background-size: 100% 50vh;
 
+  & .ant-menu-submenu {
+    & .ant-menu-submenu-title, & .anticon{
+      /* override ant transition animation */
+      transition: none;
+    }
+  }
+
   & .sidebar-menu {
     background: none;
   }
 
-  & .sidebar-menu-item {
+  & .sidebar-menu-item, & .sidebar-title {
     font-size: 16px;
     font-weight: var(--font-weight-bold);
+    color: white;
 
     & a {
       color: white;
diff --git a/web/app/js/components/Sidebar.jsx b/web/app/js/components/Sidebar.jsx
index 8319b19e4..b135a7cdd 100644
--- a/web/app/js/components/Sidebar.jsx
+++ b/web/app/js/components/Sidebar.jsx
@@ -180,6 +180,15 @@ class Sidebar extends React.Component {
                 : null
             }
 
+            <Menu.SubMenu
+              className="sidebar-menu-item"
+              key="byresource"
+              title={<span className="sidebar-title"><Icon type="bars" />{this.state.collapsed ? "" : "Resources"}</span>}>
+              <Menu.Item><ConduitLink to="/deployments">Deployments</ConduitLink></Menu.Item>
+              <Menu.Item><ConduitLink to="/replicationcontrollers">Replication Controllers</ConduitLink></Menu.Item>
+              <Menu.Item><ConduitLink to="/pods">Pods</ConduitLink></Menu.Item>
+            </Menu.SubMenu>
+
             <Menu.Item className="sidebar-menu-item" key="/docs">
               <Link to="https://conduit.io/docs/" target="_blank">
                 <Icon type="solution" />