From 2cf2bdf8ad87b45418798a3e0d2378f080183b17 Mon Sep 17 00:00:00 2001
From: len0rd <tylerm15@gmail.com>
Date: Fri, 3 Aug 2018 23:37:28 -0400
Subject: [PATCH] got a basic side nav bar for documentation formatted the way
 i want. now need to figure out how to autogenerate

---
 assets/css/projects.css                   |  4 ++++
 assets/css/site.css                       |  5 +++--
 assets/script/app.js                      |  2 +-
 views/pages/index.ejs                     | 12 ++++++------
 views/pages/projects/project_template.ejs |  7 ++++---
 views/partials/nav.ejs                    |  4 ++--
 6 files changed, 20 insertions(+), 14 deletions(-)

diff --git a/assets/css/projects.css b/assets/css/projects.css
index 3435fff..136b927 100644
--- a/assets/css/projects.css
+++ b/assets/css/projects.css
@@ -30,4 +30,8 @@ ol {
 
 li p {
     padding-left: 0;
+}
+
+.sticky-offset {
+    top: 56px !important;
 }
\ No newline at end of file
diff --git a/assets/css/site.css b/assets/css/site.css
index e3f45e0..e42cc58 100644
--- a/assets/css/site.css
+++ b/assets/css/site.css
@@ -51,8 +51,9 @@
 	background-color: #161038;
 }
 
-.text-yellow {
-	text-emphasis-color: yellow;
+.card-soft-link {
+	color: #5AB2DA;
+	padding-right: 2%;
 }
 
 .card {
diff --git a/assets/script/app.js b/assets/script/app.js
index a47e946..6313f26 100644
--- a/assets/script/app.js
+++ b/assets/script/app.js
@@ -1,5 +1,5 @@
 var $document = $(document),
-    $nav = $('.navbar'),
+    $nav = $('.navbar-top'),
     navbarDef = 'bg-dark',
     effect = 'fadeInDown';
 
diff --git a/views/pages/index.ejs b/views/pages/index.ejs
index 23165c8..9c8b9cb 100644
--- a/views/pages/index.ejs
+++ b/views/pages/index.ejs
@@ -36,36 +36,36 @@
             </div>
             <div class="container pb-5 pt-5">
                 <div class="card-deck">
-                    <div class="card bg-dark text-white">
+                    <div class="card bg-dark border-light text-white">
                         <div class="card-body">
                             <h5 class="card-title">Yama Crawler</h5>
                             <h6 class="card-subtitle mb-2 text-muted">Selenium-Based Web Crawler</h6>
                             <p class="card-text">Yama is a powerful developer-friendly web crawler/scraper built with Selenium and Java. Built from the ground up by yours truly.</p>
                         </div>
                         <div class="card-footer">
-                            <a href="https://github.com/len0rd/YamaCrawler" class="card-link">See Code</a>
+                            <a href="https://github.com/len0rd/YamaCrawler" class="card-link card-soft-link">See Code</a>
                             <a href="#" class="btn btn-outline-light">Read More</a>
                         </div>
                     </div>
-                    <div class="card bg-dark text-white">
+                    <div class="card bg-dark border-light text-white">
                         <div class="card-body">
                             <h5 class="card-title">Repley</h5>
                             <h6 class="card-subtitle mb-2 text-muted">The Tomcat - ChartJS crossover nobody asked for</h6>
                             <p class="card-text">If you only have a hammer, everything looks like a nail. Repley combines Apache Tomcat and ChartJS to make dynamic database chart generation as easy as editing a JSON file.</p>
                         </div>
                         <div class="card-footer">
-                            <a href="https://github.com/len0rd/Repley" class="card-link">See Code</a>
+                            <a href="https://github.com/len0rd/Repley" class="card-link card-soft-link">See Code</a>
                             <a href="#" class="btn btn-outline-light">Read More</a>
                         </div>
                     </div>
-                    <div class="card bg-dark text-white">
+                    <div class="card bg-dark border-light text-white">
                         <div class="card-body">
                             <h5 class="card-title">Darkstar</h5>
                             <h6 class="card-subtitle mb-2 text-muted">Why buy a quad when you can build it</h6>
                             <p class="card-text">Tbh, idk what other project to put here, we'll have to figure it our later</p>
                         </div>
                         <div class="card-footer">
-                            <a href="https://github.com/len0rd/Repley" class="card-link text-yellow bottom">See Code</a>
+                            <a href="https://github.com/len0rd/Repley" class="card-link card-soft-link">See Code</a>
                             <a href="projects/darkstar" class="btn btn-outline-light">Read More</a>
                         </div>
                     </div>
diff --git a/views/pages/projects/project_template.ejs b/views/pages/projects/project_template.ejs
index 33e1ef8..632af3f 100644
--- a/views/pages/projects/project_template.ejs
+++ b/views/pages/projects/project_template.ejs
@@ -1,4 +1,5 @@
 <% var rootPath = '../../'; %>
+<% var navExt = '-nav' %>
 <!DOCTYPE html>
 <html lang="en">
 
@@ -14,10 +15,10 @@
 
 	<div class="container mt-5">
 		<div class="row">
-			<div class="col-3">
-				<!-- scroll spy goes here -->
+			<div class="col-3 mt-5">
+				<%- include(rootPath + page + navExt) %>
 			</div>
-			<div class="col-9 mt-5 pt-5 pb-5">
+			<div data-spy="scroll" data-target="#nav-scroll" data-offset="0" class="col-9 mt-5 pt-5 pb-5">
 				<%- include(rootPath + page) %>
 			</div>
 		</div>
diff --git a/views/partials/nav.ejs b/views/partials/nav.ejs
index 9246944..4300333 100644
--- a/views/partials/nav.ejs
+++ b/views/partials/nav.ejs
@@ -1,5 +1,5 @@
-<nav class="navbar navbar-expand-lg navbar-dark animated fadeIn fixed-top">
-    <div class="container-fluid">
+<nav class="navbar navbar-top navbar-expand-lg navbar-dark animated fadeIn fixed-top">
+    <div class="container">
 
         <a class="navbar-brand" href="/#">lenordsNet</a>
         <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarText" aria-controls="navbarText"