Added nav bar using ngInclude

treehouse-projects · Mar 2, 2016 · 1d8032b · 1d8032b
1 parent dbdefaa
commit 1d8032b
Show file tree

Hide file tree

Showing 3 changed files with 26 additions and 1 deletion.
diff --git a/public/index.html b/public/index.html
@@ -7,6 +7,8 @@
 </head>
 <body ng-app="todoListApp">
 
+  <ng-include src="'templates/navbar.html'"></ng-include>
+
   <h1>My TODOs!</h1>
 
   <div class="list" ng-controller="mainCtrl">

diff --git a/public/styles/main.css b/public/styles/main.css
@@ -68,4 +68,21 @@ input[type="checkbox"] + span {
 }
 input[type="checkbox"]:checked + span {
     background:url(checkbox-filled.svg) left top no-repeat;
-}
+}
+
+nav ul {
+  text-align: left;
+  list-style: none;
+  margin-left: 0;
+  padding: 0;
+}
+nav ul li {
+  display: inline-block;
+}
+nav ul li a {
+  display: block;
+  margin: 0;
+  padding: 10px 15px;
+  color: #444;
+  background-color: #adadad;
+}
diff --git a/public/templates/navbar.html b/public/templates/navbar.html
@@ -0,0 +1,6 @@
+<nav>
+	<ul>
+		<li><a href="/">Home</a></li>
+		<li><a href="http://teamtreehouse.com">Treehouse</a></li>
+	</ul>
+</nav>