index page created and small css fix to nav bar

Author: mpbe

app/templates/base.html

@@ -20,8 +20,7 @@
                     <a href="{{url_for('auth.account')}}" class="hover:text-gray-400">Account</a>
                 </div>
                 {%else%}
-                <div class="flex flex-col md:flex-row md:justify-between md:items-center text-center
-                            md:text-left gap-4 md:gap-6">
+                <div class="flex flex-col md:flex-row md:justify-between md:items-center gap-4 md:gap-6">
                     <a href="{{url_for('auth.login')}}" class="hover:text-gray-400">Login</a>
                     <a href="{{url_for('auth.register')}}" class="hover:text-gray-400">Register</a>
                 </div>

app/templates/index.html

@@ -5,5 +5,23 @@
 {%include "partials/form_errors.html"%}
 
 {%block content%}
-<h1>Welcome to Task Manager!</h1>
+<div class="text-center mt-20 flex flex-col justify-center gap-10 max-w-xl mx-auto">
+    <h1 class="text-4xl font-semibold">Welcome to Task Manager!</h1>
+
+    <p class="text-gray-600">A simple task management application built with Flask and SQLite. Create, update and track tests through a simple
+        interface</p>
+
+    <p class="text-gray-600">Use the links above to navigate through the features of the application</p>
+
+    <div class="flex flex-col gap-5">
+        <p class="text-lg font-semibold underline">Basic instructions:</p>
+
+        <p>Seed the db with python seed.py</p>
+
+        <p>Log in using username: aaaa, password: test</p>
+    </div>
+
+    <p class="text-gray-600 text-sm">Need help? <a href="https://github.com/mpbe/TaskManager/blob/main/README.md" class="text-blue-500 underline hover:text-blue-600">Click here</a> for the readme</p>
+</div>
+
 {%endblock%}