W4.6: responsive grid, fixed links to use routing.

client/docList.html

@@ -1,11 +1,13 @@
 <template name="docList">
   <div class="container top-margin">
     <div class="row">
-      <div class="col-md-12">
-        {{#each documents }}
-          {{ title }}
-        {{/each}}
-      </div>
+      {{#each documents }}
+        <div class="col-md-3 col-xs-6">
+          <div class="light-border">
+            <a href="/documents/{{ _id }}">{{ title }}</a>
+          </div>
+        </div>
+      {{/each}}
     </div>
   </div>
 </template>

client/navbar.html

@@ -1,7 +1,7 @@
 <template name="navbar">
   <nav class="navbar navbar-default navbar-fixed-top">
     <div class="container">
-      <a class="navbar-brand" href="#">TextCircle</a><!-- nav title -->
+      <a class="navbar-brand" href="/">TextCircle</a><!-- nav title -->
       <ul class="nav navbar-nav">
         <li>
           <a href="#" class="js-add-doc">
@@ -16,7 +16,7 @@
           </a>
           <ul class="dropdown-menu">
             {{#each documents }}
-              <li><a href="#" class="js-load-doc">{{ title }}</a></li>
+              <li><a href="/documents/{{ _id }}">{{ title }}</a></li>
             {{/each}}
           </ul>
         </li>

client/textcircle.css

@@ -11,4 +11,8 @@ body {
   resize: both;
   width: 100%; }
 
+.light-border {
+  border: 1px solid gray;
+  width: 100%; }
+
 /*# sourceMappingURL=textcircle.css.map */

client/textcircle.scss

@@ -15,3 +15,8 @@ $topMargin: 50px;
   resize: both;
   width: 100%;
 }
+
+.light-border {
+  border: 1px solid gray;
+  width: 100%;
+}