added contact page

backend/core/templates/components/footer.html

@@ -10,7 +10,7 @@
         <div>
           <h3 class="text-sm font-semibold text-gray-400 tracking-wider uppercase mb-4">Company</h3>
           <ul class="space-y-3">
-            <li><a href="/#" class="text-sm text-blue-200 hover:text-accent transition-colors no-underline">Contact</a></li>
+            <li><a href="/contact/" class="text-sm text-blue-200 hover:text-accent transition-colors no-underline">Contact</a></li>
           </ul>
         </div>
         <div>

backend/core/templates/contact-success.html

@@ -0,0 +1,19 @@
+{% extends "base.html" %}
+{% block content %}
+<section class="py-16 bg-secondary sm:py-24 p-body-full">
+  <div class="max-w-lg w-full mx-auto text-center shadow-lg border border-success rounded-xl p-8 bg-white">
+    <h2 class="text-3xl font-extrabold mb-4 text-success">Thank you for contacting us.</h2>
+        <p class="mb-8 text-gray-700 text-lg">
+            We received your message and will reach you soon.
+        </p>
+        <a href="{% url 'core:index' %}" class="bg-transparent border-2 border-accent text-accent hover:bg-accent hover:text-primary font-semibold py-3 px-8 rounded-lg text-lg transition-all duration-300 ease-in-out">
+            Go back to Homepage
+        </a>
+  </div>
+</section>
+
+{% endblock content %}
+
+{% block bottom %}
+    <script src="/static/js/formHandling.js"></script>
+{% endblock bottom %}

backend/core/templates/contact.html

@@ -0,0 +1,48 @@
+{% extends "base.html" %}
+{% load static widget_tweaks %}
+
+{% block content %}
+<section class="py-16 bg-secondary sm:py-24 p-body-full">
+  <div class="max-w-2xl w-full mx-auto shadow-2xl border-2 border-accent rounded-2xl p-8 bg-white">
+    <h1 class="text-3xl font-extrabold mb-3 text-primary">Contact Us</h1>
+    <p class="mb-8 text-gray-700">Have a question or need help? Send us a message and we'll get back to you.</p>
+
+    <form method="post" class="space-y-6">
+      {% csrf_token %}
+
+      {% if form.non_field_errors %}
+        <div class="bg-red-50 border border-red-400 text-red-700 px-4 py-3 rounded-lg">
+          {{ form.non_field_errors }}
+        </div>
+      {% endif %}
+
+      <div>
+        <label class="block text-sm font-medium text-gray-700 mb-1" for="id_name">Name</label>
+        {% render_field form.name class+="w-full bg-white border-2 border-accent rounded-lg px-4 py-3 text-gray-900 focus:outline-none focus:ring-2 focus:ring-accent focus:border-accent" %}
+        {% if form.name.errors %}
+          <p class="text-red-600 text-sm mt-1">{{ form.name.errors|striptags }}</p>
+        {% endif %}
+      </div>
+
+      <div>
+        <label class="block text-sm font-medium text-gray-700 mb-1" for="id_email">Email</label>
+        {% render_field form.email class+="w-full bg-white border-2 border-accent rounded-lg px-4 py-3 text-gray-900 focus:outline-none focus:ring-2 focus:ring-accent focus:border-accent" %}
+        {% if form.email.errors %}
+          <p class="text-red-600 text-sm mt-1">{{ form.email.errors|striptags }}</p>
+        {% endif %}
+      </div>
+
+      <div>
+        <label class="block text-sm font-medium text-gray-700 mb-1" for="id_message">Message</label>
+        {% render_field form.message class+="w-full bg-white border-2 border-accent rounded-lg px-4 py-3 text-gray-900 focus:outline-none focus:ring-2 focus:ring-accent focus:border-accent" %}
+        {% if form.message.errors %}
+          <p class="text-red-600 text-sm mt-1">{{ form.message.errors|striptags }}</p>
+        {% endif %}
+      </div>
+
+      <button type="submit" class="w-full nav-link-desktop bg-primary border-2 border-accent text-accent hover:bg-accent hover:text-primary font-semibold py-3 px-8 rounded-lg text-lg transition-all duration-300 ease-in-out">Send Message</button>
+    </form>
+  </div>
+  
+</section>
+{% endblock %}