10 files changed, 146 insertions, 22 deletions
diff --git a/resources/sass/_navbar.scss b/resources/sass/_navbar.scss
index 1542944..4645fa5 100644
--- a/resources/sass/_navbar.scss
+++ b/resources/sass/_navbar.scss
@@ -14,3 +14,7 @@
 		margin-left: 0.5rem;
 	}
 }
+
+.nav-link:hover {
+	text-decoration: underline !important;
+}
diff --git a/resources/sass/_utility.scss b/resources/sass/_utility.scss
index e84fcd0..bcc163d 100644
--- a/resources/sass/_utility.scss
+++ b/resources/sass/_utility.scss
@@ -8,4 +8,18 @@ hr {
 	height: 1px;
 	margin-top: inherit;
 }
-
+.mt-20 {
+	margin-top: 20px;
+}
+.mt-30 {
+	margin-top: 30px;
+}
+.mt-35 {
+	margin-top: 35px;
+}
+.mt-40 {
+	margin-top: 40px;
+}
+.mt-50 {
+	margin-top: 50px;
+}
diff --git a/resources/views/about.blade.php b/resources/views/about.blade.php
new file mode 100644
index 0000000..143fe55
--- /dev/null
+++ b/resources/views/about.blade.php
@@ -0,0 +1,54 @@
+@extends('layouts.app')
+
+@section('styles')
+html {
+	height: 100%;
+}
+.hn {
+  display: inline-block;
+  font-size: inherit;
+  height: 1em;
+  overflow: visible;
+  vertical-align: -.125em;
+  fill: #ff6600;
+}
+
+@endsection
+
+@section('content')
+	<div style="margin-top: 20px" class="container">
+
+		<div class="card">
+			<h1 class="card-header">
+				More about <strong>{{ env('APP_NAME') }}</strong>
+			</h1>
+			<div class="card-body">
+				<p class="card-text">
+					{{ env('APP_NAME') }} is a resource of curious, obscure, inspiring, interesting and sometimes even scary insights. Dive deep in the worlds knowlegde. We focus on "anything that gratifies one's intellectual curiosity." Or to speak more clearly: Reading Wikipedia was my hobby, so I automated it.
+					<br>
+					<br>
+					Enter {{ env('APP_NAME') }}. This is a collection of curated Wikipedia articles, sourced primarily (for now) from <a href="https://news.ycombinator.com">{!! file_get_contents(public_path() . "/img/y-combinator.svg") !!} Hacker News</a>. For structured consuming most of them are further categorized in topics. For starting, I recommend <a href="{{ route('popular') }}">reading the most popular articles</a> or <a href="{{ route('popular_topics') }}">browse by topics</a>.
+				</p>
+			</div>
+		</div>
+<!--
+	<div style="margin-bottom: 20px"></div>
+
+	<div class="card">
+			<h1 class="card-header">
+			</h1>
+		<div class="card-body">
+			<p class="card-text">
+			</p>
+		</div>
+	</div>
+
+	<div style="margin-bottom: 20px"></div>
+
+-->
+	</div>
+@endsection
+
+@section ('footer')
+	@include ('layouts.footer')
+@endsection
diff --git a/resources/views/index.blade.php b/resources/views/index.blade.php
index 659cc06..da33466 100644
--- a/resources/views/index.blade.php
+++ b/resources/views/index.blade.php
@@ -17,6 +17,9 @@
     <p class="lead">
       <a href="{{ route('popular') }}" class="btn btn-lg btn-outline-primary">Most Popular</a>
     </p>
+    <p class="lead mt-50">
+      Not ready to explore?<br> <a href="{{ route('about') }}">Then learn more</a>.
+    </p>
   </div>
 
 </div>
diff --git a/resources/views/layouts/app.blade.php b/resources/views/layouts/app.blade.php
index 0a3cc90..05b7d38 100644
--- a/resources/views/layouts/app.blade.php
+++ b/resources/views/layouts/app.blade.php
@@ -44,7 +44,7 @@
 @endif
 
 </head>
-<body>
+<body class="d-flex flex-column h-100">
     <div id="app">
         <nav class="navbar navbar-expand-md navbar-dark shadow-sm">
             <div class="container">
@@ -112,9 +112,10 @@
             </div>
         </nav>
 
-        <main class="py-4">
+        <main class="">
             @yield('content')
         </main>
+	@yield('footer')
     </div>
 </body>
 </html>
diff --git a/resources/views/layouts/footer-style.blade.php b/resources/views/layouts/footer-style.blade.php
new file mode 100644
index 0000000..e1f715e
--- /dev/null
+++ b/resources/views/layouts/footer-style.blade.php
@@ -0,0 +1,14 @@
+html {
+  position: relative;
+  min-height: 100%;
+}
+body {
+  margin-bottom: 120px; 
+}
+.footer {
+  position: absolute;
+  bottom: 50;
+  width: 100%;
+  height: 70px; 
+}
+
diff --git a/resources/views/layouts/footer.blade.php b/resources/views/layouts/footer.blade.php
new file mode 100644
index 0000000..c672d45
--- /dev/null
+++ b/resources/views/layouts/footer.blade.php
@@ -0,0 +1,16 @@
+<div class="container mt-35">
+	<hr>
+</div>
+
+<div class="mt-20"></div>
+
+<footer class="footer">
+	<div class="container">
+		<h3 class="text-white">
+			Helpful Links
+		</h3>
+		<strong>
+			<a href="{{ route('about') }}">Learn more about {{ env('APP_NAME') }}</a>
+		</strong>
+	</div>
+</footer>
diff --git a/resources/views/list.blade.php b/resources/views/list.blade.php
index 1f6fc72..f067e2f 100644
--- a/resources/views/list.blade.php
+++ b/resources/views/list.blade.php
@@ -1,28 +1,32 @@
 @extends('layouts.app')
 
 @section('styles')
+
+@include ('layouts.footer-style')
+
 @if ( 0 != $count )
-html {
-	height: inherit;
-}
-.hn {
-  display: inline-block;
-  font-size: inherit;
-  height: 1em;
-  overflow: visible;
-  vertical-align: -.125em;
-  fill: #ff6600;
-}
+	html {
+		height: inherit;
+	}
+	.hn {
+	  display: inline-block;
+	  font-size: inherit;
+	  height: 1em;
+	  overflow: visible;
+	  vertical-align: -.125em;
+	  fill: #ff6600;
+	}
 
-.rss-link > svg {
-  display: inline-block;
-  font-size: inherit;
-  height: 1em;
-  overflow: visible;
-  vertical-align: -.125em;
-  fill: #f59436;
-}
+	.rss-link > svg {
+	  display: inline-block;
+	  font-size: inherit;
+	  height: 1em;
+	  overflow: visible;
+	  vertical-align: -.125em;
+	  fill: #f59436;
+	}
 @endif
+
 @endsection
 
 @section('content')
@@ -150,3 +154,7 @@ html {
 
 	</div>
 @endsection
+
+@section ('footer')
+	@include ('layouts.footer')
+@endsection
diff --git a/resources/views/topicindex.blade.php b/resources/views/topicindex.blade.php
index 7de3042..67b0de4 100644
--- a/resources/views/topicindex.blade.php
+++ b/resources/views/topicindex.blade.php
@@ -1,6 +1,7 @@
 @extends('layouts.app')
 
 @section('styles')
+@include ('layouts.footer-style')
 html {
 	height: inherit;
 }
@@ -43,3 +44,7 @@ html {
 
 </div>
 @endsection
+
+@section ('footer')
+	@include ('layouts.footer')
+@endsection
diff --git a/resources/views/topicpopular.blade.php b/resources/views/topicpopular.blade.php
index f6a2c8a..e4d2b18 100644
--- a/resources/views/topicpopular.blade.php
+++ b/resources/views/topicpopular.blade.php
@@ -1,6 +1,7 @@
 @extends ('layouts.app')
 
 @section ('styles')
+@include ('layouts.footer-style')
 html {
 	height: inherit;
 }
@@ -35,3 +36,7 @@ html {
 
 </div>
 @endsection
+
+@section ('footer')
+	@include ('layouts.footer')
+@endsection