Fix styling #62

Contact.md

@@ -1,10 +1,16 @@
 <frontmatter>
   title: "Learning Resources for Software Engineering Students"
   footer: footer.md
+  head: head.md
 </frontmatter>
 
+{{ navbar | safe }}
+
+<div class="website-content">
+
 # Contact
 
 * Suggestions, questions, and bug reports can be posted in 
   [our issue tracker](https://github.com/nus-oss/learningresources/issues)
-* Alternatively, contact project mentor [Damith C. Rajapakse](http://www.comp.nus.edu.sg/~damithch)
+* Alternatively, contact project mentor [Damith C. Rajapakse](http://www.comp.nus.edu.sg/~damithch)
+</div>

GuidelinesForContributors.md

@@ -1,8 +1,13 @@
 <frontmatter>
   title: "Learning Resources for Software Engineering Students"
   footer: footer.md
+  head: head.md
 </frontmatter>
 
+{{ navbar | safe }}
+
+<div class="website-content">
+
 # Guidelines for Contributors
 
 * Our objective is to help SE students learn a relevant topic quickly by locating good learning resources. 
@@ -19,3 +24,5 @@
 
 * When contributing, follow the [oss-generics process](https://github.com/oss-generic/process) where applicable.
 
+
+</div>

README.md

@@ -7,3 +7,5 @@ This repository is a collection of Software Engineering learning resources.
 ---
 
 [Guidelines for Contributors](GuidelinesForContributors.md) | [Contact](Contact.md) | License: MIT
+
+</div>

_markbind/head/head.md

@@ -0,0 +1 @@
+<link rel="stylesheet" href="{{baseUrl}}/css/gh-pages.css">

_markbind/variables.md

@@ -1,19 +1,30 @@
 <span id="navbar">
-<link rel="stylesheet" href="{{baseUrl}}/css/gh-pages.css">
 <div id="seedu-header">
-    <nav class="navbar navbar-lg navbar-light bg-lighter">
+    <nav class="navbar navbar-lg navbar-expand navbar-light bg-lighter">
         <div class="container">
-            <a class="navbar-brand" href="index.html"><img src="https://se-edu.github.io/images/SeEduLogo.png" alt="SE-EDU"></a>
+            <a class="navbar-brand" href="https://se-edu.github.io/"><img src="https://se-edu.github.io/images/SeEduLogo.png" alt="SE-EDU"></a>
             <ul class="navbar-nav">
                 <li class="nav-item"><a class="nav-link" href="https://se-edu.github.io/addressbook-level1">AB-1</a></li>
                 <li class="nav-item"><a class="nav-link" href="https://se-edu.github.io/addressbook-level2">AB-2</a></li>
                 <li class="nav-item"><a class="nav-link" href="https://se-edu.github.io/addressbook-level3">AB-3</a></li>
                 <li class="nav-item"><a class="nav-link" href="https://se-edu.github.io/addressbook-level4">AB-4</a></li>
                 <li class="nav-item"><a class="nav-link" href="https://se-edu.github.io/collate">Collate</a></li>
                 <li class="nav-item"><a class="nav-link" href="https://se-edu.github.io/se-book">Book</a></li>
-                <li class="nav-item"><a class="nav-link" href="https://se-edu.github.io/learningresources">Resources</a></li>
+                <li class="nav-item"><a class="nav-link active" href="{{baseUrl}}/index.html">Resources</a></li>
             </ul>
         </div>
     </nav>
 </div>
-</span>
+<div id="site-header">
+    <nav class="navbar navbar-expand navbar-light bg-light">
+        <div class="container">
+            <a class="navbar-brand" href="{{baseUrl}}/index.html">Learning Resources for Software Engineering Students</a>
+            <ul class="navbar-nav">
+            </ul>
+            <form class="navbar-form">
+                <searchbar :data="searchData" placeholder="Search" :on-hit="searchCallback" menu-align-right ></searchbar>
+            </form>
+        </div>
+    </nav>
+</div>
+</span>

contents/ToC.md

@@ -0,0 +1,2 @@
+
+</div>

contents/ai/ml.md

@@ -1,10 +1,13 @@
 <frontmatter>
   title: Introduction to Machine Learning (ML)
   footer: footer.md
+  head: head.md
 </frontmatter>
 
 {{ navbar | safe }}
 
+<div class="website-content">
+
 # Introduction to Machine Learning (ML)
 Authors: [Alex Fong](https://github.com/alexfjw)
 
@@ -218,3 +221,5 @@ Popular resources for keeping up with machine learning research
 
 ## Footnotes
 <a name="fast-ai-ml">[1]</a>: No link is provided as MOOC is in unofficial release at time of writing  
+
+</div>

contents/android/IntroToAndroid.md

@@ -1,10 +1,13 @@
 <frontmatter>
   title: Introduction to Android App Development
   footer: footer.md
+  head: head.md
 </frontmatter>
 
 {{ navbar | safe }}
 
+<div class="website-content">
+
 # Introduction to Android App Development
 
 Authors: [Lee Yan Hwa](https://github.com/leeyh20)
@@ -190,3 +193,5 @@ Going further, it will be useful to know more about:
 Other useful links:
 *   [Android Authority](https://www.androidauthority.com)
 *   [Android Central](https://www.androidcentral.com/)
+
+</div>

contents/architecture/RESTArchitecturalStyle.md

@@ -1,10 +1,13 @@
 <frontmatter>
   title: REST Architectural Style
   footer: footer.md
+  head: head.md
 </frontmatter>
 
 {{ navbar | safe }}
 
+<div class="website-content">
+
 # REST Architectural Style
 
 Author: [Wen Xin](https://github.com/wenmogu)
@@ -92,4 +95,5 @@ The server can send a code snippet to the client to let the client execute. One
 * Code On Demand
   * [a general wikipedia explanation](https://en.wikipedia.org/wiki/Code_on_demand)
   * [a stackoverflow explanation](https://stackoverflow.com/questions/32094952/code-demand-constraint-for-restful-apis?utm_medium=organic&utm_source=google_rich_qa&utm_campaign=google_rich_qa)
-* [Video explaning REST (easy to get the big picture but not very precise)](https://www.youtube.com/watch?v=YCcAE2SCQ6k)
+* [Video explaning REST (easy to get the big picture but not very precise)](https://www.youtube.com/watch?v=YCcAE2SCQ6k)
+</div>

contents/c++/rvalue.md

@@ -1,10 +1,13 @@
 <frontmatter>
   title: Rvalue References and Move Semantics
   footer: footer.md
+  head: head.md
 </frontmatter>
 
 {{ navbar | safe }}
 
+<div class="website-content">
+
 # Rvalue References and Move Semantics
 
 Authors: [Tan Jun An](https://github.com/yamidark)
@@ -175,3 +178,5 @@ The following resources gives more readings on what was discussed, and a more in
 * [C++ Rvalue References Explained in 11 Sections](http://thbecker.net/articles/rvalue_references/section_01.html)
 * [Sample examples of using Rvalue References and Move Semantics](http://www.bogotobogo.com/cplusplus/C11/5B_C11_Move_Semantics_Rvalue_Reference.php)
 * [The Rvalue Reference Anti-Pattern](http://cpptruths.blogspot.sg/2012/03/rvalue-references-in-constructor-when.html)
+
+</div>

contents/codeQuality/CodeQualityMetrics.md

@@ -1,10 +1,13 @@
 <frontmatter>
   title: Code Quality Metrics
   footer: footer.md
+  head: head.md
 </frontmatter>
 
 {{ navbar | safe }}
 
+<div class="website-content">
+
 # Code Quality Metrics
 
 Authors: [Wilson Kurniawan](https://github.com/wkurniawan07)
@@ -107,3 +110,5 @@ Measuring design (relevant to architects, QA team), most of them commercial:
 - Java: [JArchitect](http://www.jarchitect.com)
 - C#: [NDepend](http://www.ndepend.com)
 - PHP: [PHP Depend](https://pdepend.org)
+
+</div>

contents/computerVision/cv.md

@@ -1,10 +1,13 @@
 <frontmatter>
   title: Introduction to computer vision (CV)
   footer: footer.md
+  head: head.md
 </frontmatter>
 
 {{ navbar | safe }}
 
+<div class="website-content">
+
 # Introduction to computer vision (CV)
 Authors: [Nguyen Quoc Bao](https://github.com/bqnguyen94)
 
@@ -330,3 +333,5 @@ or the Python version:
 <a name="footnote18">[18]</a>: https://pdfs.semanticscholar.org/56b1/eee82a51ce17d72a91b5876a3281418679cc.pdf<br />
 <a name="footnote19">[19]</a>: https://www.sciencedirect.com/science/article/pii/S0167865505003521<br />
 <a name="footnote20">[20]</a>: http://goldberg.berkeley.edu/pubs/acc-2012-visual-tracking-final.pdf<br />
+
+</div>

contents/data/databases.md

@@ -1,10 +1,13 @@
 <frontmatter>
   title: Introduction to Databases & Database Management Systems (DBMS)
   footer: footer.md
+  head: head.md
 </frontmatter>
 
 {{ navbar | safe }}
 
+<div class="website-content">
+
 # Introduction to Databases & Database Management Systems (DBMS)
 
 Authors: [Syed Abdullah](https://github.com/Skaty)
@@ -168,4 +171,5 @@ Another level of abstraction is the **database abstraction layer**. This is usua
 ##### Database abstractions
 
 - [PHP Data Objects](https://secure.php.net/manual/en/book.pdo.php)
-- [Object-relational mapping](https://en.wikipedia.org/wiki/Object-relational_mapping)
+- [Object-relational mapping](https://en.wikipedia.org/wiki/Object-relational_mapping)
+</div>

contents/devops/DevOps.md

@@ -1,10 +1,13 @@
 <frontmatter>
   title: DevOps
   footer: footer.md
+  head: head.md
 </frontmatter>
 
 {{ navbar | safe }}
 
+<div class="website-content">
+
 # DevOps
 
 Authors: [John Yong](https://github.com/whipermr5)
@@ -118,4 +121,5 @@ As a software engineering student, the best way to get started is to gain some p
 - [Best Guide to Getting Started In DevOps](https://blog.xebialabs.com/2015/04/23/best-guide-to-getting-started-in-devops/) - recommends various places you can read up more on the topic
 - [9½ Simple Steps On How To Start With DevOps Today](https://devops.com/9%C2%BD-simple-steps-start-devops-today/) - includes practical suggestions like using a code static analysis tool
 - [A Pragmatic Guide to Getting Started with DevOps](http://www.ca.com/us/lpg/~/media/Files/eBooks/a-pragmatic-guide-to-getting-started-with-devops.pdf) - more of a management point of view but interesting
-- [The DevOps Handbook: How to Create World-Class Speed, Reliability, and Security in Technology Organizations](https://books.google.com.sg/books/about/The_Devops_Handbook.html?id=XrQcrgEACAAJ) - about managing tech organisations, written by a CTO
+- [The DevOps Handbook: How to Create World-Class Speed, Reliability, and Security in Technology Organizations](https://books.google.com.sg/books/about/The_Devops_Handbook.html?id=XrQcrgEACAAJ) - about managing tech organisations, written by a CTO
+</div>

contents/functionalProgramming/intro.md

@@ -1,10 +1,13 @@
 <frontmatter>
   title: An Introduction to Functional Programming
   footer: footer.md
+  head: head.md
 </frontmatter>
 
 {{ navbar | safe }}
 
+<div class="website-content">
+
 # An Introduction to Functional Programming
 
 Authors: [Phang Chun Rong](https://github.com/crphang)
@@ -138,4 +141,5 @@ Functional programming can be a very different programming paradigm and it defin
 - A good [overview of functional programming](https://en.wikipedia.org/wiki/Functional_programming)
 - A six-part [introduction to functional programming](https://medium.com/@cscalfani/so-you-want-to-be-a-functional-programmer-part-1-1f15e387e536)
 - If you are hungry for more, take the [excellent functional programming principles course](https://www.coursera.org/learn/progfun1)
-- And to help with the mindset shift for functional programming, take a look at a [practical guide on how to translate an imperative to functional style](https://maryrosecook.com/blog/post/a-practical-introduction-to-functional-programming)
+- And to help with the mindset shift for functional programming, take a look at a [practical guide on how to translate an imperative to functional style](https://maryrosecook.com/blog/post/a-practical-introduction-to-functional-programming)
+</div>

contents/go/Go.md

@@ -1,10 +1,13 @@
 <frontmatter>
   title: Introduction to Go
   footer: footer.md
+  head: head.md
 </frontmatter>
 
 {{ navbar | safe }}
 
+<div class="website-content">
+
 # Introduction to Go
 
 Author(s): [Cara Leong](https://github.com/craaaa)
@@ -278,3 +281,5 @@ Go's development team is heavily involved in documenting and growing the Go lang
 - [The Go FAQ](https://golang.org/doc/faq) - answers common questions about the language's history, usage, design and more
 - [Go's documentation](https://golang.org/doc/) - a good starting point, contains links to official information about Go
 - [The Go Blog](https://blog.golang.org/) - features news and in-depth articles about Go by the Go team and guests
+
+</div>

contents/gpgpu/cuda.md

@@ -1,10 +1,13 @@
 <frontmatter>
   title: An Introduction to CUDA
   footer: footer.md
+  head: head.md
 </frontmatter>
 
 {{ navbar | safe }}
 
+<div class="website-content">
+
 # An Introduction to CUDA
 
 ###### Author: [Pierce Anderson Fu](https://github.com/PierceAndy)
@@ -250,3 +253,5 @@ This topic is widely covered. Here are some good references on what the differen
 <a name="footnote7">[7]</a>: http://stackoverflow.com/a/5957647<br />
 <a name="footnote8">[8]</a>: https://developer.nvidia.com/cuda-faq#Programming<br />
 <a name="footnote9">[9]</a>: https://www.khronos.org/opencl/<br />
+
+</div>

contents/gpgpu/gpgpu.md

@@ -1,10 +1,13 @@
 <frontmatter>
   title: An Introduction to GPGPU
   footer: footer.md
+  head: head.md
 </frontmatter>
 
 {{ navbar | safe }}
 
+<div class="website-content">
+
 # An Introduction to GPGPU
 
 ###### Authors: [Pierce Anderson Fu](https://github.com/PierceAndy), [Nguyen Quoc Bao](https://github.com/bqnguyen94)
@@ -89,3 +92,5 @@ Compatible with a range of components and large ecosystem products<sup>[[8]](#fo
 <a name="footnote7">[7]</a>: https://en.wikipedia.org/wiki/Tegra#Tegra_X1/<br />
 <a name="footnote8">[8]</a>: https://elinux.org/Jetson_TX2#Ecosystem_Products<br />
 <a name="footnote9">[9]</a>: https://developer.nvidia.com/embedded/learn/success-stories<br />
+
+</div>

contents/haskell/Haskell.md

@@ -1,10 +1,13 @@
 <frontmatter>
   title: Introduction to Haskell
   footer: footer.md
+  head: head.md
 </frontmatter>
 
 {{ navbar | safe }}
 
+<div class="website-content">
+
 # Introduction to Haskell
 
 Author: Thenaesh Elango
@@ -1048,3 +1051,5 @@ ad-hoc fashion.
 for the major typeclasses contained in the Haskell hierarchical libraries. Use
 it to determine which typeclasses are related to which (e.g. every monad is an
 applicative functor, which is in turn a functor).
+
+</div>

contents/java/Java.md

@@ -1,10 +1,13 @@
 <frontmatter>
   title: Java
   footer: footer.md
+  head: head.md
 </frontmatter>
 
 {{ navbar | safe }}
 
+<div class="website-content">
+
 # Java
 
 Authors: John Doe, Jane Doe
@@ -24,3 +27,5 @@ Authors: John Doe, Jane Doe
 // Reflection overview
 
 // Learning resources
+
+</div>

contents/java/JavaConcurrency.md

@@ -1,10 +1,13 @@
 <frontmatter>
   title: Java Concurrency
   footer: footer.md
+  head: head.md
 </frontmatter>
 
 {{ navbar | safe }}
 
+<div class="website-content">
+
 # Java Concurrency
 
 Authors: Vivek Lakshmanan
@@ -224,3 +227,5 @@ The following resources are interesting reads for a deeper understanding.
 * [Computer Science Stack Exchange Post on the difference between Concurrency and Parallelism](https://cs.stackexchange.com/questions/19987/difference-between-parallel-and-concurrent-programming)
 * [Java Locks and Atomic Variables Tutorial](https://www.callicoder.com/java-locks-and-atomic-variables-tutorial/)
 * [A comparison between concurrency in Golang and Java](https://www.quora.com/What-is-the-advantage-of-Googles-Golang-over-Java-and-Scala)
+
+</div>