added tabs for home

app/__init__.py

@@ -22,6 +22,7 @@ def create_app(environment="development"):
         auth_blueprint,
         user_blueprint,
         books_blueprint,
+        home_blueprint,
     )
     from app.models import (
         User,
@@ -48,6 +49,7 @@ def create_app(environment="development"):
     app.register_blueprint(main_blueprint)
     app.register_blueprint(user_blueprint)
     app.register_blueprint(books_blueprint)
+    app.register_blueprint(home_blueprint)
 
     # Set up flask login.
     @login_manager.user_loader

app/templates/base.html

@@ -77,7 +77,7 @@
     {% include 'right_sidebar.html' %}
     {% include 'books/add_book_modal.html' %}
 
-    <div class="sm:ml-64 mt-14 h-full overflow-x-scroll">
+    <div class="sm:mx-64 p-0 mt-16 h-full overflow-x-scroll">
       <!-- Main Content -->
       {% block content %}{% endblock %}
     </div>

app/templates/home/index.html

@@ -0,0 +1,18 @@
+<!-- prettier-ignore -->
+{% extends 'base.html' %}
+{% block content %}
+<div class="mt-4 border-b border-gray-200 dark:border-gray-700">
+  <!-- prettier-ignore -->
+  <ul class="flex flex-wrap -mb-px text-sm font-medium text-center text-gray-500 dark:text-gray-400">
+    <li class="mr-2">
+     <a href="" class="inline-flex p-4 text-blue-600 border-b-2 border-blue-600 rounded-t-lg active dark:text-blue-500 dark:border-blue-500 group" aria-current="page"> <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6 mr-3"> <path stroke-linecap="round" stroke-linejoin="round" d="M3.75 13.5l10.5-11.25L12 10.5h8.25L9.75 21.75 12 13.5H3.75z" /> </svg> Last Sections </a>
+    </li>
+    <li class="mr-2">
+       <a href="#" class="inline-flex p-4 border-b-2 border-transparent rounded-t-lg hover:text-gray-600 hover:border-gray-300 dark:hover:text-gray-300 group" ><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6 mr-3"> <path stroke-linecap="round" stroke-linejoin="round" d="M16.5 3.75V16.5L12 14.25 7.5 16.5V3.75m9 0H18A2.25 2.25 0 0120.25 6v12A2.25 2.25 0 0118 20.25H6A2.25 2.25 0 013.75 18V6A2.25 2.25 0 016 3.75h1.5m9 0h-9" /> </svg> Explore Books </a>
+    </li>
+    <li class="mr-2">
+      <a href="#" class="inline-flex p-4 border-b-2 border-transparent rounded-t-lg hover:text-gray-600 hover:border-gray-300 dark:hover:text-gray-300 group"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6 mr-3"> <path stroke-linecap="round" stroke-linejoin="round" d="M19.5 14.25v-2.625a3.375 3.375 0 00-3.375-3.375h-1.5A1.125 1.125 0 0113.5 7.125v-1.5a3.375 3.375 0 00-3.375-3.375H8.25m5.231 13.481L15 17.25m-4.5-15H5.625c-.621 0-1.125.504-1.125 1.125v16.5c0 .621.504 1.125 1.125 1.125h12.75c.621 0 1.125-.504 1.125-1.125V11.25a9 9 0 00-9-9zm3.75 11.625a2.625 2.625 0 11-5.25 0 2.625 2.625 0 015.25 0z" /> </svg> All sections </a>
+    </li>
+  </ul>
+</div>
+{% endblock %}

app/templates/right_sidebar.html

@@ -6,7 +6,7 @@
     <ul class="space-y-4 font-medium">
       <li>
         <!-- prettier-ignore -->
-        <button type="button" data-modal-target="add-book-modal" data-modal-toggle="add-book-modal" class="mt-1 text-white w-full bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center inline-flex items-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6"> <path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15" /> </svg> New book </button>
+        <button type="button" data-modal-target="add-book-modal" data-modal-toggle="add-book-modal" class="text-white ml-2 w-11/12 bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-4 py-2.5 text-center inline-flex items-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6"> <path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15" /> </svg> New book </button>
       </li>
       <li>
         <button

app/templates/sidebar.html

@@ -6,7 +6,7 @@
     <ul class="space-y-2 font-medium">
       <li>
         <a
-          href="#"
+          href="{{ url_for('home.get_all') }}"
           class="flex items-center p-2 text-gray-900 rounded-lg dark:text-white hover:bg-gray-100 dark:hover:bg-gray-700">
           <!-- prettier-ignore -->
           <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6"> <path stroke-linecap="round" stroke-linejoin="round" d="M2.25 12l8.954-8.955c.44-.439 1.152-.439 1.591 0L21.75 12M4.5 9.75v10.125c0 .621.504 1.125 1.125 1.125H9.75v-4.875c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125V21h4.125c.621 0 1.125-.504 1.125-1.125V9.75M8.25 21h8.25" /> </svg>

app/views/__init__.py

@@ -3,3 +3,4 @@ from .auth import auth_blueprint
 from .main import main_blueprint
 from .user import bp as user_blueprint
 from .books import bp as books_blueprint
+from .home import bp as home_blueprint

app/views/home.py

@@ -0,0 +1,15 @@
+from flask import (
+    Blueprint,
+    render_template,
+)
+
+
+bp = Blueprint("home", __name__, url_prefix="/home")
+
+
+@bp.route("/", methods=["GET"])
+def get_all():
+
+    return render_template(
+        "home/index.html",
+    )