Started to refactor to change css library from w3 to bootstrap

includes/footer.html

@@ -1,6 +1,6 @@
 
 <!-- Close section -->
-</div>
+</div></div>
 
 <!-- Footer -->
 <!-- Footer -->

includes/header.html

@@ -69,4 +69,5 @@
     </div>
 </div>
 <br><br><br>
-<div class="container">
+<div class="container">
+    <div class="row">

posts/homePage.js

@@ -61,6 +61,7 @@ module.exports=
         {
             return new Promise(function(resolve, reject)
             {
+
                 renderRecentPosts(result).then(function()
                 {
                     return require("../sidebar/sidebar.js").main(result);

posts/singlePost.js

@@ -48,7 +48,7 @@ module.exports=
            if(!(post.picture_url === "n/a"))
            {
                html +="<img src=\"/img/posts/" + post.picture_url +
-                   "\" alt=\"\" style=\"width:100%\">";
+                   "\" alt=\"\" style=\"width:100%; height:10%\">";
            }
 
            html += "<div class=\"container\">";
@@ -78,7 +78,7 @@ module.exports=
                        html+= "<p>" + htmlPost[i];
                    }
 
-                   html = html.split("<img").join("<img style=\"max-width: 100%;\" ");
+                   html = html.split("<img").join("<img style=\"width: 100%; height:10%\" ");
 
                    html += "      <div class=\"row\">\n" +
                        "          <p class='w3-center'><button class=\"w3-button " +
@@ -116,15 +116,15 @@ module.exports=
     {
         return new Promise(function (resolve, reject)
         {
-            var html = "<div class=\"container\">";
+            var html = "<div class=\"\">";
             //image
             if(!(post.picture_url === "n/a"))
             {
                 html +="<img src=\"/img/posts/" + post.picture_url +
-                    "\" alt=\"\" style=\"width:100%\">";
+                    "\" alt=\"\" class=\"w-100\">";
             }
 
-            html += "<div class=\"container\">";
+            html += "<div class=\"\">";
             //title
             html += "<h3><b>" + post.name + "</b></h3>";
             //date
@@ -132,7 +132,7 @@ module.exports=
                 post.published.toDateString() + "</span></h5>";
             html +="</div>";
 
-            html += "<div class=\"container\">";
+            html += "<div class=\"\">";
             try
             {
                 sql.getCategory(post.category_id).then(function(category)

sidebar/categoriesSideBar.js

@@ -18,17 +18,17 @@ module.exports=
 
                 //res.write("<div class=\"w3-container w3-padding w3-gray\"><h4>Categories</h4></div>");
 
-                res.write("<div class=\"container\"><h4>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=\"\">");
+                res.write("<div class=\"list-group\">");
 
                 sql.getCategories().then(function(categories)
                 {
                     categories.forEach(function(cat)
                     {
                         //res.write(cat.name);
-                        res.write("<a class=\"btn-lg\" href='/category/" + cat.url + "'>" + cat.name + "<br></a>");
+                        res.write("<a class=\"list-group-item\" href='/category/" + cat.url + "'>" + cat.name + "<br></a>");
                     });
                     res.write("</div></div>");
                     resolve();

sidebar/recentPosts.js

@@ -13,19 +13,19 @@ module.exports=
             return new Promise(function(resolve, reject)
             {
 
-                res.write("<div class=\"w3-card w3-margin\">");
+                res.write("<div class=\"container\">");
 
-                res.write("<div class=\"w3-container w3-padding w3-gray\">" +
-                    "<h4>Recent Posts</h4></div>");
+                res.write("<div class=\"\">" +
+                    "<h4 class=\"align-content-center\">Recent Posts</h4></div>");
 
-                res.write("<div class=\"w3-bar-block w3-white\">");
+                res.write("<div class=\"list-group\">");
 
                 sql.getRecentPosts().then(function(posts)
                 {
                     posts.forEach(function(p)
                     {
                         var url = '/' +  p.category + '/' + p.url;
-                        res.write("<a class=\"w3-bar-item w3-button\" href='"
+                        res.write("<a class=\"list-group-item\" href='"
                             + url + "'>" + p.name + "<br></a>");
                     });
                     res.write("</div></div>");

sidebar/sidebar.js

@@ -13,7 +13,7 @@ module.exports=
         {
             return new Promise(function(resolve, reject)
             {
-                res.write("<div class=\"w3-col l4\">");
+                res.write("<div class=\"col-md-4\">");
 
                 utils.include(res,"sidebar/sidebar.html").then(function()
                 {