- Add comprehensive chat system with modern UI design - Implement admin-based password reset system - Fix template syntax errors and 500 server errors - Add chat routes, API endpoints, and database models - Enhance user interface with Tailwind CSS card-based design - Implement community guidelines and quick action features - Add responsive design for mobile and desktop compatibility - Create support chat functionality with admin integration - Fix JavaScript inheritance in base template - Add database migration for chat system tables Features: ✅ Modern chat interface with room management ✅ Admin-based password reset workflow ✅ Real-time chat with mobile app support ✅ Professional UI with gradient cards and hover effects ✅ Community guidelines and safety features ✅ Responsive design for all devices ✅ Error-free template rendering
68 lines
3.9 KiB
HTML
68 lines
3.9 KiB
HTML
{% extends "base.html" %}
|
|
{% block title %}Password Reset Request{% endblock %}
|
|
{% block content %}
|
|
<div class="min-h-screen bg-gradient-to-br from-blue-900 via-purple-900 to-teal-900 py-20">
|
|
<div class="max-w-md mx-auto">
|
|
<div class="bg-white rounded-2xl shadow-xl overflow-hidden">
|
|
<div class="bg-gradient-to-r from-orange-600 to-red-600 p-8 text-white text-center">
|
|
<i class="fas fa-key text-4xl mb-4"></i>
|
|
<h2 class="text-2xl font-bold">Password Reset Request</h2>
|
|
<p class="text-orange-100 mt-2">We'll help you get back into your account</p>
|
|
</div>
|
|
|
|
<div class="p-8">
|
|
<div class="bg-blue-50 border border-blue-200 rounded-lg p-4 mb-6">
|
|
<div class="flex items-start">
|
|
<i class="fas fa-info-circle text-blue-500 mr-3 mt-1"></i>
|
|
<div class="text-sm text-blue-700">
|
|
<p class="font-semibold mb-1">How it works:</p>
|
|
<p>Enter your email address and we'll send a password reset request to our administrators. They will contact you directly to help reset your password securely.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<form method="POST" class="space-y-6">
|
|
{{ form.hidden_tag() }}
|
|
<div>
|
|
{{ form.email.label(class="block text-sm font-semibold text-gray-700 mb-2") }}
|
|
<div class="relative">
|
|
<div class="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none">
|
|
<i class="fas fa-envelope text-gray-400"></i>
|
|
</div>
|
|
{{ form.email(class="w-full pl-10 pr-3 py-3 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-orange-500 focus:border-transparent transition-all duration-200", placeholder="Enter your email address") }}
|
|
</div>
|
|
{% if form.email.errors %}
|
|
<div class="text-red-500 text-sm mt-2">
|
|
{% for error in form.email.errors %}
|
|
<p><i class="fas fa-exclamation-circle mr-1"></i>{{ error }}</p>
|
|
{% endfor %}
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
|
|
{{ form.submit(class="w-full bg-gradient-to-r from-orange-600 to-red-600 text-white py-3 px-6 rounded-lg hover:from-orange-700 hover:to-red-700 focus:outline-none focus:ring-2 focus:ring-orange-500 focus:ring-offset-2 transition-all duration-200 font-semibold text-lg") }}
|
|
</form>
|
|
|
|
<div class="mt-8 pt-6 border-t border-gray-200 text-center">
|
|
<p class="text-sm text-gray-600 mb-4">Remember your password?</p>
|
|
<a href="{{ url_for('auth.login') }}"
|
|
class="inline-flex items-center text-blue-600 hover:text-blue-700 font-medium transition-colors duration-200">
|
|
<i class="fas fa-arrow-left mr-2"></i>Back to Login
|
|
</a>
|
|
</div>
|
|
|
|
<div class="mt-6 bg-green-50 border border-green-200 rounded-lg p-4">
|
|
<div class="flex items-start">
|
|
<i class="fas fa-shield-alt text-green-500 mr-3 mt-1"></i>
|
|
<div class="text-sm text-green-700">
|
|
<p class="font-semibold mb-1">Security Note:</p>
|
|
<p>Our administrators will verify your identity before resetting your password to keep your account secure.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|