Home Explore Help
Register Sign In
fgm
/
meteor__coursera-meteor-2
1
0
Fork 0
Files Issues 0 Pull Requests 0
Browse Source

W1.7: Added bootstrap fixed navbar at top.

Frederic G. MARAND 8 years ago
parent
0f5d189667
commit
7e1ce17f03
4 changed files with 55 additions and 20 deletions
Split View Show Diff Stats
  1. 40 0
      public/bootstrap_cheat.txt
  2. 7 3
      textcircle.css
  3. 8 7
      textcircle.html
  4. 0 10
      textcircle.js

+ 40 - 0
public/bootstrap_cheat.txt
View File 

@@ -0,0 +1,40 @@
 
+================================================================================
 
+Navbar fixed at top
 
+-------------------
 
+
 
+  HTML
 
+  ----
 
+
 
+  <nav class="navbar navbar-default navbar-fixed-top">
 
+    <div class="container">
 
+      ...
 
+    </div>
 
+  </nav>
 
+
 
+  CSS
 
+  ---
 
+
 
+  body {
 
+    padding-top: 70px; /* Default navbar height: 50px */
 
+  }
 
+
 
+================================================================================
 
+
 
+Navbar fixed at bottom
 
+----------------------
 
+
 
+  HTML
 
+  ----
 
+
 
+  <nav class="navbar navbar-default navbar-fixed-bottom">
 
+    <div class="container">
 
+      ...
 
+    </div>
 
+  </nav>
 
+
 
+  CSS
 
+  ---
 
+
 
+  body {
 
+    padding-bottom: 70px;  /* Default navbar height: 50px */
 
+  }

+ 7 - 3
textcircle.css
View File 

@@ -1,5 +1,9 @@
 
-/* CSS declarations go here */
 
+/* Workaround BS3 fixed navbar height
 
+body {
 
+	padding-top: 70px;
 
+}
 
+*/
 
 
 .top-margin{
 
-	margin-top:50px;
 
-}
 
+	margin-top: 50px;
 
+}

+ 8 - 7
textcircle.html
View File 

@@ -3,16 +3,17 @@
 
 </head>
 
 
 <body>
 
-  <h1>Welcome to TextCircle!</h1>
 
-  <p>{{> date_display }}</p>
 
+  <nav class="navbar navbar-default navbar-fixed-top">
 
+    <div class="container">
 
+      <a class="navbar-brand" href="#">TextCircle</a><!-- nav title -->
 
+    </div><!-- /nav container -->
 
+  </nav><!-- /nav -->
 
 
-  {{> editor}}
 
+  <div class="container top-margin">
 
+    {{> editor}}
 
+  </div>
 
 </body>
 
 
-<template name="date_display">
 
-  {{ current_date }}
 
-</template>
 
-
 
 <template name="editor">
 
 <h2>doc id: {{ docid }}</h2>
 
   {{> sharejsCM docid=docid id="editor" }}

+ 0 - 10
textcircle.js
View File 

@@ -2,16 +2,6 @@
 
 this.Documents = new Mongo.Collection("documents");
 
 
 if (Meteor.isClient) {
 
-  Meteor.setInterval(function () {
 
-    Session.set("current_date", new Date());
 
-  }, 1000);
 
-
 
-  Template.date_display.helpers({
 
-    current_date: function () {
 
-      return Session.get("current_date");
 
-    }
 
-  });
 
-
 
   Template.editor.helpers({
 
     docid: function () {
 
       let doc = Documents.findOne();