Fixed how the sidebars and posts are rendered with boostrap.

css/bootstrap.css

@@ -170,18 +170,6 @@ sup {
     top: -.5em;
 }
 
-a {
-    color: #93C54B;
-    text-decoration: none;
-    background-color: transparent;
-    -webkit-text-decoration-skip: objects;
-}
-
-a:hover {
-    color: #6b9430;
-    text-decoration: underline;
-}
-
 a:not([href]):not([tabindex]) {
     color: inherit;
     text-decoration: none;
@@ -9644,4 +9632,24 @@ footer .footer-below {
 
 .fa-youtube:before {
     content: "\f167";
+}
+
+.blogPost
+{
+    background-color: #fff;
+    box-shadow: 0 4px 10px 0 rgba(0,0,0,0.2), 0 4px 20px 0 rgba(0,0,0,0.19);
+}
+
+a
+{
+    color: #00BEB2;
+    text-decoration: none;
+    background-color: transparent;
+    -webkit-text-decoration-skip: objects;
+}
+
+a:hover
+{
+    color: #1A5D63;
+    text-decoration: underline;
 }

includes/404.html

@@ -3,4 +3,5 @@
 <div class="align-content-center">
     <img src="/img/website/404.jpg" alt="Page not found" width="70%" />
 </div>
-</div>
+</div>
+<br><br>

includes/header.html

@@ -45,18 +45,18 @@
         <div class="collapse navbar-collapse" id="navbarSupportedContent">
             <ul class="navbar-nav mr-auto">
                 <li class="nav-item active">
-                    <a class="nav-link" href="">Home <span class="sr-only">(current)</span></a>
+                    <a class="nav-link" href="https://jrtechs.net">Home <span class="sr-only">(current)</span></a>
                 </li>
                 <li class="nav-item">
-                    <a class="nav-link" href="graphs.html">Categories</a>
+                    <a class="nav-link" href="https://jrtechs.net/categories">Categories</a>
                 </li>
                 <li class="nav-item">
-                    <a class="nav-link" href="faq.html">Contact</a>
+                    <a class="nav-link" href="https://jrtechs.net/contact">Contact</a>
                 </li>
             </ul>
             <ul class="nav navbar-nav navbar-right">
                 <li>
-                    <a class="nav-link" href=https://jrtechs.me">Portfolio</a>
+                    <a class="nav-link" href="https://jrtechs.me">Resume</a>
                 </li>
                 <li>
                     <a class="nav-link" href="https://github.com/jrtechs">Github</a>

posts/singlePost.js

@@ -42,7 +42,7 @@ module.exports=
        {
            //var html = "<div class=\"w3-card-4 w3-margin w3-white\">";
 
-           var html = "<div class=\"row\">";
+           var html = "<div class=\"blogPost\">";
 
            //image
            if(!(post.picture_url === "n/a"))
@@ -51,7 +51,7 @@ module.exports=
                    "\" alt=\"\" style=\"width:100%; height:10%\">";
            }
 
-           html += "<div class=\"container\">";
+           html += "<div class=\"p-4\"><div class=\"\">";
            //title
            html += "<h3><b>" + post.name + "</b></h3>";
            //date
@@ -59,7 +59,7 @@ module.exports=
                post.published.toDateString() + "</span></h5>";
            html +="</div>";
 
-           html += "<div class=\"container\">";
+           html += "<div class=\"\">";
 
            try
            {
@@ -80,14 +80,14 @@ module.exports=
 
                    html = html.split("<img").join("<img style=\"width: 100%; height:10%\" ");
 
-                   html += "      <div class=\"row\">\n" +
-                       "          <p class='w3-center'><button class=\"w3-button " +
+                   html += "      <div class=\"\">\n" +
+                       "          <p class='w3-center'><button class=\"btn btn-secondary btn-lg " +
                        "w3-padding-large w3-white w3-border\"  onclick=\"location.href='" +
                        "http://jrtechs.net/" + category[0].url + "/" + post.url +
                        "'\"><b>READ MORE &raquo;</b></button></p>\n" +
                        "      </div>\n";
 
-                   html += "</div></div>";
+                   html += "</div></div></div><br><br>";
                    res.write(html);
 
                    resolve()
@@ -116,7 +116,7 @@ module.exports=
     {
         return new Promise(function (resolve, reject)
         {
-            var html = "<div class=\"\">";
+            var html = "<div class=\"blogPost\">";
             //image
             if(!(post.picture_url === "n/a"))
             {
@@ -124,7 +124,7 @@ module.exports=
                     "\" alt=\"\" class=\"w-100\">";
             }
 
-            html += "<div class=\"\">";
+            html += "<div class=\"p-4\"><div class=\"\">";
             //title
             html += "<h3><b>" + post.name + "</b></h3>";
             //date
@@ -145,7 +145,7 @@ module.exports=
                     html += md.render(markDown);
 
                     html = html.split("<img").join("<img style=\"max-width: 100%;\" ");
-                    html += "</div></div>";
+                    html += "</div></div></div><br><br>";
 
 
                     res.write(html);

sidebar/categoriesSideBar.js

@@ -14,15 +14,19 @@ module.exports=
         {
             return new Promise(function(resolve, reject)
             {
-                res.write("<div class=\"container\">");
+                res.write("<br><br><div class=\"container\">");
 
                 //res.write("<div class=\"w3-container w3-padding w3-gray\"><h4>Categories</h4></div>");
 
-                res.write("<div class=\"container\"><h4 class=\"align-content-center\">Categories</h4></div>");
+                //res.write("<div class=\"container\"><h4 class=\"align-content-center\">Categories</h4></div>");
 
                 //res.write("<div class=\"w3-bar-block w3-white\">");
                 res.write("<div class=\"list-group\">");
 
+                res.write("  <a href=\"#\" class=\"list-group-item list-group-item-action flex-column align-items-start active\">\n" +
+                    "      <h5 class=\"mb-1\">Categories</h5>\n" +
+                    "  </a>");
+
                 sql.getCategories().then(function(categories)
                 {
                     categories.forEach(function(cat)

sidebar/recentPosts.js

@@ -15,11 +15,15 @@ module.exports=
 
                 res.write("<div class=\"container\">");
 
-                res.write("<div class=\"\">" +
-                    "<h4 class=\"align-content-center\">Recent Posts</h4></div>");
+                // res.write("<div class=\"\">" +
+                //     "<h4 class=\"text-center\">Recent Posts</h4></div>");
 
                 res.write("<div class=\"list-group\">");
 
+                res.write("  <a href=\"#\" class=\"list-group-item list-group-item-action flex-column align-items-start active\">\n" +
+                    "      <h5 class=\"mb-1\">Recent Posts</h5>\n" +
+                    "  </a>");
+
                 sql.getRecentPosts().then(function(posts)
                 {
                     posts.forEach(function(p)