base setup

This commit is contained in:
2026-01-07 12:09:20 +05:30
commit 0c275efea1
278 changed files with 11228 additions and 0 deletions

View File

@@ -0,0 +1,66 @@
{% extends 'base.html' %}
{% block title %}User Profile{% endblock %}
{% load crispy_forms_tags %}
{% load static %}
{% block content %}
<!-- Profile Picture Update Modal -->
<div class="fixed inset-0 z-50 hidden overflow-y-auto bg-black bg-opacity-60" id="profilePicModal">
<div class="flex items-center justify-center min-h-screen px-4">
<div class="bg-white rounded-xl shadow-2xl w-full max-w-md">
<div class="flex justify-between items-center p-6 border-b border-gray-200">
<h3 class="text-xl font-semibold text-[#1E40AF]">Update Profile Picture</h3>
<button onclick="document.getElementById('profilePicModal').classList.add('hidden')" class="text-gray-500 hover:text-[#1E40AF] text-2xl transition-colors">&times;</button>
</div>
<div class="p-6">
<form method="POST" action="{% url 'update_profile_picture' %}" enctype="multipart/form-data">
{% csrf_token %}
{{ update_profile_photo_form|crispy }}
<button type="submit" class="mt-4 w-full bg-[#1E40AF] hover:bg-[#1E3A8A] text-white font-semibold py-2.5 px-4 rounded-lg transition-colors duration-200">Save Changes</button>
</form>
</div>
</div>
</div>
</div>
<!-- Profile Content -->
<div class="max-w-6xl mx-auto px-4 py-12">
<div class="bg-white rounded-xl shadow-xl overflow-hidden">
<div class="flex flex-col md:flex-row">
<!-- Left Sidebar -->
<div class="bg-gray-50 md:w-1/3 flex flex-col items-center justify-center p-8 text-center">
<img src="{{ user.profile_photo.url }}" alt="Profile Image" class="w-36 h-36 rounded-full object-cover mb-6 shadow-lg border-4 border-white">
<h2 class="text-2xl font-bold text-[#1E40AF]">{{ user }}</h2>
<a href="{% url 'update_profile' user.id %}" class="mt-6 w-full bg-[#1E40AF] text-white py-2.5 rounded-lg hover:bg-[#1E3A8A] font-semibold transition-colors duration-200">Update Profile</a>
<button onclick="document.getElementById('profilePicModal').classList.remove('hidden')" class="mt-3 w-full bg-[#1E40AF] text-white py-2.5 rounded-lg hover:bg-[#1E3A8A] font-semibold transition-colors duration-200">Update Profile Picture</button>
</div>
<!-- Right Content -->
<div class="md:w-2/3 p-8">
<h3 class="text-xl font-semibold text-[#1E40AF] mb-4 border-b border-gray-200 pb-3">Account Information</h3>
<div class="grid grid-cols-1 md:grid-cols-2 gap-6 mb-8">
<div>
<p class="text-sm font-semibold text-gray-500">Email</p>
<p class="text-[#1E3A8A]">{{ user.email }}</p>
</div>
<div>
<p class="text-sm font-semibold text-gray-500">Phone</p>
<p class="text-[#1E3A8A]">{{ user.get_decrypted_contact_number }}</p>
</div>
</div>
<h3 class="text-xl font-semibold text-[#1E40AF] mb-4 border-b border-gray-200 pb-3">Social Media</h3>
<div class="flex space-x-6 mt-4">
<a href="#" class="text-[#1E40AF] hover:text-[#1E3A8A] text-2xl transition-colors"><i class="mdi mdi-facebook"></i></a>
<a href="#" class="text-[#1E40AF] hover:text-[#1E3A8A] text-2xl transition-colors"><i class="mdi mdi-twitter"></i></a>
<a href="#" class="text-[#1E40AF] hover:text-[#1E3A8A] text-2xl transition-colors"><i class="mdi mdi-instagram"></i></a>
</div>
</div>
</div>
</div>
</div>
{% endblock %}