changing routing mechanism

assets/css/blog.css

@@ -91,16 +91,20 @@
   margin: 2em;
   padding: .5em 3em;
   font-size: 2em;
-  color: white;
+  color: white !important;
   border: 3px solid white;
   cursor: pointer;
   transition: 0.7s;
   -webkit-transition: 0.7s;
-  z-index: 2;
+  display: block;
+  z-index: 3;
+}
+  #readBlog > p {
+    margin: 0;
   }
   #readBlog:hover {
     background-color: white;
-    color: black;
+    color: black !important;
     box-shadow: inset 0 0 0 1px #ffffff;
   }
 

assets/js/main.js

@@ -42,24 +42,22 @@
 				side: 'right'
 			});
 
-		$('#blog').load('blog.html');
-
 	$('#readBlog').on("click", function() {
 		window.location = "http://arjunpatel.me/blog.html";
 	});
 
-	$('.readMore').on("click", function() {
+	// $('.readMore').on("click", function() {
-		var whichBlog = $(this).attr('id');
+	// 	var whichBlog = $(this).attr('id');
-		console.log("Loading vlog: " + whichBlog);
+	// 	console.log("Loading vlog: " + whichBlog);
-		window.location = "http://arjunpatel.me/blogs/" + whichBlog + ".html";
+	// 	window.location = "http://arjunpatel.me/blogs/" + whichBlog + ".html";
-	});
+	// });
-
+	//
-	$('#goToMain').on("click", function() {
+	// $('#goToMain').on("click", function() {
-		window.location = "http://arjunpatel.me/index.html";
+	// 	window.location = "http://arjunpatel.me/index.html";
-	});
+	// });
-
+	//
-	$('#goToBlogs').on("click", function() {
+	// $('#goToBlogs').on("click", function() {
-		window.location = "http://arjunpatel.me/blog.html";
+	// 	window.location = "http://arjunpatel.me/blog.html";
-	});
+	// });
 
 })(jQuery);

blog.html

@@ -25,12 +25,15 @@
 				</nav> -->
 			</header>
 
+      <a href="http://arjunpatel.me/index.html">
         <div id="goToMain">
           <i class="fa fa-times-circle-o"></i>
         </div>
+      </a>
 
 
 			<section id="blog">
+        <a href="http://arjunpatel.me/blogs/1.html">
           <div class="blogCard">
     				<div class="title">
     					The College Programming Tutorial Article Blog Thingy?
@@ -47,6 +50,7 @@
               <p id="1" class="readMore">Read More</p>
             </div>
           </div>
+        </a>
 			</section>
 
 		<!-- Scripts -->

blogs/1.html

@@ -25,9 +25,11 @@
 				</nav> -->
 			</header>
 
+      <a href="http://arjunpatel.me/blog.html">
         <div id="goToBlogs">
           <i class="fa fa-times-circle-o"></i>
         </div>
+      </a>
 
 
 			<section id="blog">

index.html

@@ -51,7 +51,9 @@
 					<p>Web Guru, Budding Entrepreneur, and Technology Enthusiast</p>
 				</div>
 
-				<p id="readBlog">Read Blog</p>
+				<a id="readBlog" href="http://arjunpatel.me/blog.html">
+					<p>Read Blog</p>
+				</a>
 
 				<video autoplay loop muted playsinline src="images/banner.mp4"></video>
 			</section>