added jquery

rdesfo · Jul 18, 2016 · fd51f5d · fd51f5d
1 parent 27816a2
commit fd51f5d
Show file tree

Hide file tree

Showing 4 changed files with 37 additions and 27 deletions.
diff --git a/css/default.css b/css/default.css
@@ -33,11 +33,12 @@ ul {
   font-size: 90px;
 }
 
-//
-//
-
 .navbar-default .navbar-nav > .active > a, .navbar-default
 .navbar-nav > .active > a:focus, ..navbar-default .navbar-nav >
 .active > a:hover {
   color: #f50057;
+}
+
+body {
+  position: relative;
 }
diff --git a/javascript/myJquery.js b/javascript/myJquery.js
@@ -0,0 +1,4 @@
+
+$(document).ready( function() {
+  $('body').scrollspy({ target: '.navbar' });
+});
diff --git a/site.hs b/site.hs
@@ -11,6 +11,10 @@ main = hakyll $ do
         route   idRoute
         compile copyFileCompiler
 
+    match "javascript/*" $ do
+        route   idRoute
+        compile copyFileCompiler
+
     match "css/*" $ do
         route   idRoute
         compile compressCssCompiler

diff --git a/templates/default.html b/templates/default.html
@@ -7,39 +7,40 @@
     <title>Desfo.org - $title$</title>
     <link rel="stylesheet" type="text/css" href="/css/default.css" />
 
-    //bootstrap
+    //jquery
+    <script   src="https://code.jquery.com/jquery-2.2.4.min.js"   integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44="   crossorigin="anonymous"></script> 
+
+    <!-- bootstrap -->
+    <!-- Latest compiled and minified CSS -->
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
-    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
-    //awesome font
-    <script src="https://use.fontawesome.com/14b3dc845a.js"></script>
 
-</head>
-<body>
+  <!-- Optional theme -->
+  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous">
+
+  <!-- Latest compiled and minified JavaScript -->
+  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
 
+  //awesome font
+  <script src="https://use.fontawesome.com/14b3dc845a.js"></script>
+
+  //scroll-spy
+  <script type='text/javascript' src='javascript/myJquery.js'></script>
+
+</head>
+<body data-spy="scroll" data-target=".navbar">
   <!-- TODO: fix navbar
   http://codepen.io/benjaminvanzwienen/pen/NNdOoq?editors=0100
   -->
-
-
   <nav class="navbar navbar-default navbar-fixed-top shadow">
     <div class="container">
-      <div class="navbar-header">
-        <a class="navbar-brand navbar-left" href="#">Ryan Desfosses</a>
-      <button class="navbar-toggle collapsed" type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-extended="false">
-        <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="collapse navbar-collapse" id="navbar-collapse">
-        <ul role="navigation" class="nav navbar-nav navbar-right">
-          <li role="navigation" class="active"><a href="index.html#Home">Home</a></li>
-          <li role="navigation"><a href="index.html#About">About</a></li>
-          <li role="navigation"><a href="index.html#Activity">Activity</a></li>
-          <li role="navigation"><a href="cv.html">CV</a></li>
+      <a class="navbar-brand navbar-left" href="#">Ryan Desfosses</a>
+        <ul role="tablist" class="nav navbar-nav navbar-right">
+          <li role="navigation"class="active"><a href="index.html#Home">Home</a></li>
+          <li role="navigation" class><a href="index.html#About">About</a></li>
+          <li role="navigation" class><a href="index.html#Activity">Activity</a></li>
+          <li role="navigation" class><a href="cv.html">CV</a></li>
         </ul>
-      </div>
+      </nav>
     </div>  
   </nav>