diff --git a/root/urls.py b/root/urls.py
index ce105407cb4c7a51da045dd4a244f2097f8a0e4e..f6457606f6db80582a59d818e94eb42702bafebd 100644
--- a/root/urls.py
+++ b/root/urls.py
@@ -3,7 +3,11 @@ from django.contrib import admin
from django.urls import path
from django.urls.conf import include
+from file_validator.views import index_view
+
urlpatterns = [
path("admin/", admin.site.urls),
path("file-validator/", include("file_validator.urls")),
+ path("", index_view, name="index"),
+
]
diff --git a/static/images/geant_logo.svg b/static/images/geant_logo.svg
new file mode 100644
index 0000000000000000000000000000000000000000..31bfead62b052812096b5a9c79cf782ce330a87c
--- /dev/null
+++ b/static/images/geant_logo.svg
@@ -0,0 +1,16 @@
+<svg width="79" height="35" viewBox="0 0 79 35" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_101_15)">
+<path d="M15.9 17.8C16.5 17.3 17 17.1 17.4 17.1C18.4 17.1 18.7 17.8 18.7 18.2C18.5 18.3 14.2 19.7 14 19.8C13.9 19.7 13.9 19.6 13.8 19.6C14 19.4 15.9 17.8 15.9 17.8Z" fill="white" fill-opacity="0.85"/>
+<path d="M0 27C0 31.8 2.1 34.3 6.3 34.3C9.1 34.3 10.8 33.1 10.8 33L10.9 32.9V26.2H5.2V28.1C5.2 28.1 8.1 28.1 8.6 28.1C8.6 28.6 8.6 31.6 8.6 31.9C8.3 32.1 7.4 32.4 6.2 32.4C3.7 32.4 2.5 30.6 2.5 27C2.5 24.9 3.1 22.4 5.9 22.4C7.8 22.4 8.5 23.5 8.5 24.5V24.8H11.1V24.5C11.1 22.1 9 20.5 5.9 20.5C2.2 20.5 0 22.9 0 27Z" fill="white" fill-opacity="0.85"/>
+<path d="M20.2 20.7H12.6V34.1H20.7V32.2C20.7 32.2 15.5 32.2 14.9 32.2C14.9 31.7 14.9 28.5 14.9 28C15.5 28 20.2 28 20.2 28V26.1C20.2 26.1 15.5 26.1 14.9 26.1C14.9 25.6 14.9 23 14.9 22.5C15.5 22.5 20.5 22.5 20.5 22.5V20.6H20.2V20.7Z" fill="white" fill-opacity="0.85"/>
+<path d="M54.5 20.7H42.9C42.9 20.7 42.9 28.7 42.9 30.6C42 29 37.2 20.7 37.2 20.7H34.5V34.1H36.8C36.8 34.1 36.8 26.1 36.8 24.2C37.7 25.8 42.5 34.1 42.5 34.1H45.2C45.2 34.1 45.2 23.2 45.2 22.6C45.7 22.6 48.4 22.6 48.9 22.6C48.9 23.2 48.9 34.1 48.9 34.1H51.3C51.3 34.1 51.3 23.2 51.3 22.6C51.8 22.6 54.9 22.6 54.9 22.6V20.7H54.5V20.7Z" fill="white" fill-opacity="0.85"/>
+<path d="M28.9 20.7H28.7H26.4L21.4 34.1H23.8C23.8 34.1 25.1 30.6 25.3 30.2C25.7 30.2 29.8 30.2 30.2 30.2C30.3 30.6 31.7 34.1 31.7 34.1H34L28.9 20.7ZM25.9 28.3C26.1 27.6 27.3 24.4 27.7 23.3C28.1 24.4 29.2 27.6 29.5 28.3C28.7 28.3 26.6 28.3 25.9 28.3Z" fill="white" fill-opacity="0.85"/>
+<path d="M77 8C68.2 -2.9 32.6 12.5 23 16.5C22.3 16.8 21.4 16.7 20.9 15.7C21.3 16.7 22.1 17.1 23.1 16.7C35.8 11.6 66.5 0.600002 74.2 10.7C77.7 15.3 76.7 20.9 72.9 28.8C72.7 29.1 72.6 29.4 72.6 29.4C72.6 29.4 72.6 29.4 72.6 29.5C72.6 29.5 72.6 29.5 72.6 29.6C72.3 30.1 71.9 30.3 71.6 30.4C72 30.4 72.5 30.2 72.9 29.6C73 29.5 73.1 29.3 73.3 29C78.7 19.5 80.7 12.5 77 8Z" fill="white" fill-opacity="0.85"/>
+<path d="M70.3 29.9C70.2 29.8 68.6 28.4 67 26.9C58.7 19 33.4 -5.3 22.4 1.1C19.3 2.9 18.8 8.2 20.7 15.2C20.7 15.3 20.8 15.4 20.8 15.5C21 16.2 21.5 16.7 22.2 16.7C21.7 16.6 21.3 16.2 21.1 15.7C21.1 15.6 21 15.5 21 15.5C21 15.4 20.9 15.3 20.9 15.1C20.9 15 20.9 14.9 20.8 14.9C19.8 9 21 5.1 23.4 3.5C32.3 -2.5 53.5 15.8 64.2 25C66.6 27.1 69.4 29.5 70.2 30.1C71.4 31 72.4 30 72.7 29.5C72.3 30.1 71.3 30.7 70.3 29.9Z" fill="white" fill-opacity="0.85"/>
+</g>
+<defs>
+<clipPath id="clip0_101_15">
+<rect width="78.9" height="34.3" fill="white"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/templates/base.html b/templates/base.html
index ad98ebab3de6455362393bf93030fb253e8ae12f..f1ad6e4f6c35939a6313e7777f1987a908ec841d 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -1,30 +1,72 @@
<!DOCTYPE html>
<html lang="en">
+{% load static %}
{% load static tailwind_tags %} <!-- Load Tailwind CSS template tags -->
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{% block title %}CSV Upload{% endblock %}</title>
- {% tailwind_css %}
+ {% tailwind_css %}
</head>
-<body class="bg-gray-100">
- <header class="fixed top-0 left-0 w-full bg-blue-900 p-4 z-10">
- <div class="container mx-auto flex items-center justify-between">
- <!-- GÉANT Logo -->
- <img src="https://geant.org/wp-content/uploads/2022/01/geant_logo_f2020_new.svg" alt="GÉANT Logo" class="h-12">
- <div class="flex-grow text-center">
- <span class="text-white text-2xl font-bold tracking-wide">Sage Validation</span>
+<body class="bg-gray-100 min-h-screen flex flex-col">
+<header class="fixed top-0 left-0 w-full bg-blue-900 p-4 z-10">
+ <div class="container mx-auto flex items-center justify-between">
+ <!-- GÉANT Logo -->
+ <div class="flex items-center">
+ <img src="{% static "images/geant_logo.svg" %}" alt="GÉANT Logo" class="h-12">
+ </div>
+ <div class="flex-grow text-center">
+ <a href="{% url "index" %}" class="text-white text-2xl font-bold tracking-wide">Sage Validation</a> <!-- Made title clickable -->
+ </div>
+ <div class="flex items-center"> <!-- Login link -->
+ <a href="/login" class="text-white hover:text-gray-300">Login</a>
+ <div class="md:hidden"> <!-- Hamburger icon for mobile -->
+ <button id="mobile-menu-button" class="text-white focus:outline-none ml-4">
+ <svg class="h-6 w-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16m-7 6h7"></path>
+ </svg>
+ </button>
</div>
</div>
- </header>
+ </div>
+</header>
+
+<main class="flex-grow mt-24 p-10">
+ {% block content %}
+ {% endblock %}
+</main>
+
+<!-- Mobile Menu -->
+<div id="mobile-menu" class="md:hidden bg-blue-900 text-white absolute w-full hidden">
+ <nav class="flex flex-col space-y-2 p-4">
+ <a href="/" class="hover:text-gray-300">Home</a>
+ <a href="/file-validator/upload" class="hover:text-gray-300">Upload File</a>
+ <a href="/login" class="hover:text-gray-300">Login</a>
+ </nav>
+</div>
+
+<!-- Footer -->
+<footer class="bg-blue-900 text-white py-6 mt-auto">
+ <div class="container mx-auto text-center">
+ <p class="text-sm">© 2024 Sage Validation. All rights reserved.</p>
+ <div class="mt-2">
+ <a href="#" class="hover:text-gray-300">Privacy Policy</a>
+ <span class="mx-2">|</span>
+ <a href="#" class="hover:text-gray-300">Terms of Service</a>
+ <span class="mx-2">|</span>
+ <a href="#" class="hover:text-gray-300">Contact Us</a>
+ </div>
+ </div>
+</footer>
- <main class="mt-24 p-10">
- {% block content %}
- {% endblock %}
- </main>
+<script>
+ // Toggle mobile menu
+ const mobileMenuButton = document.getElementById('mobile-menu-button');
+ const mobileMenu = document.getElementById('mobile-menu');
- <script>
- // Global JavaScript code
- </script>
+ mobileMenuButton.addEventListener('click', () => {
+ mobileMenu.classList.toggle('hidden');
+ });
+</script>
</body>
-</html>
+</html>
\ No newline at end of file
diff --git a/templates/index.html b/templates/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..7d7376ea866409f6da728b1c6a343fa98b8fb7a4
--- /dev/null
+++ b/templates/index.html
@@ -0,0 +1,17 @@
+{% extends "base.html" %}
+
+{% block title %}Home - Sage Validation{% endblock %}
+
+{% block content %}
+<section class="bg-white text-gray-900 min-h-screen flex flex-col justify-center items-center px-4">
+ <div class="text-center max-w-2xl mx-auto">
+ <h1 class="text-5xl md:text-6xl font-bold mb-12 text-blue-900">Welcome to Sage Validation</h1>
+ <p class="text-xl md:text-2xl mb-16 text-gray-700">Click the button below to upload your file for validation.</p>
+
+ <a href="{% url "upload-file" %}"
+ class="inline-flex py-4 px-16 bg-blue-600 text-white text-lg md:text-xl font-bold rounded-full shadow-lg transition-transform transform hover:scale-105 focus:outline-none focus:ring-4 focus:ring-blue-300 focus:ring-opacity-50">
+ Upload File
+ </a>
+ </div>
+</section>
+{% endblock %}
\ No newline at end of file