--- a/client/src/App.scss	Fri Jun 23 11:16:34 2017 +0200
+++ b/client/src/App.scss	Fri Jun 23 15:21:43 2017 +0200
@@ -43,6 +43,13 @@
   }
 }
 
+.navbar {
+    .material-icons {
+        font-size: 20px;
+        line-height: 20px;
+    }
+}
+
 .hovering-menu {
     position: absolute;
     z-index: 1;
@@ -176,6 +183,7 @@
 
     &-margin-comment {
         width: 33.3333%;
+        padding-left: 15px;
     }
 }
 

--- a/client/src/components/Navbar.js	Fri Jun 23 11:16:34 2017 +0200
+++ b/client/src/components/Navbar.js	Fri Jun 23 15:21:43 2017 +0200
@@ -37,6 +37,14 @@
   );
 }
 
+const Online = ({ offline }) => {
+  return (
+    <NavItem>
+      <span className="material-icons" style={{ color: offline.online ? '#2ECC71' : '#E74C3C' }}>signal_wifi_4_bar</span>
+    </NavItem>
+  )
+}
+
 class AppNavbar extends Component {
 
   onClickHome = (e) => {
@@ -63,7 +71,8 @@
             <NavItem onClick={this.onClickSessions} href="/sessions">Sessions</NavItem>
           </Nav>
           <Nav pullRight>
-            <LoginNav {...this.props}/>
+            <Online {...this.props} />
+            <LoginNav {...this.props} />
           </Nav>
         </Navbar.Collapse>
       </Navbar>
@@ -79,6 +88,7 @@
   return {
     isAuthenticated: state['isAuthenticated'],
     currentUser: state['currentUser'],
+    offline: state['offline']
   };
 }