Included jQuery and Bootstrap

The menu wasn't showing correctly on smaller screens

Author: thomasmoldovan

client/app/app.html

@@ -1,27 +1,20 @@
-<header class="site-header" role="banner">
-    <div class="navbar-wrapper">
-        <nav class="navbar navbar-inverse" role="navigation">
-            <div class="container">
-                <div class="navbar-header">
-                    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
-                     <span class="sr-only">Toggle navigation</span>
-                    <span class="icon-bar"></span>
-                    <span class="icon-bar"></span>
-                    <span class="icon-bar"></span>
-          </button>
-                </div>
-                <div class="navbar-collapse collapse">
-                    <ul class="nav navbar-nav navbar-right">
-                        <li class="active"> <a routerLink="/dashboard" routerLinkActive="active">Dashboard</a>
-                        </li>
-                        <li class="active"><a routerLink="/heroes" routerLinkActive="active">Heroes</a></li>
-                    </ul>
-                </div>
-            </div>
-        </nav>
-    </div>
-</header>
+<nav class="navbar navbar-inverse" role="navigation">
+	<div class="navbar-header">
+		<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-menu-collapse">
+			<span class="sr-only">Toggle navigation</span>
+			<span class="icon-bar"></span>
+			<span class="icon-bar"></span>
+			<span class="icon-bar"></span>
+		</button>
+		<a class="navbar-brand" href="/">{{ title }}</a>
+	</div>
+	<div class="collapse navbar-collapse navbar-menu-collapse">
+		<ul class="nav navbar-nav navbar-right">
+			<li class="active"> <a routerLink="/dashboard" routerLinkActive="active">Dashboard</a></li>
+			<li class="active"><a routerLink="/heroes" routerLinkActive="active">Heroes</a></li>
+		</ul>
+	</div>
+</nav>
 <div class="container">
-    <h1>{{title}}</h1>
-    <router-outlet></router-outlet>
-</div>
+	<router-outlet></router-outlet>
+</div>

client/index.html

@@ -6,7 +6,9 @@
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1">
 
-  <link rel="stylesheet" href="css/bootstrap/dist/css/bootstrap.min.css">
+  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
+  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
+  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"></link>
 
   <!-- 1. Load libraries -->
   <!-- Polyfill(s) for older browsers -->