batman

app/templates/auth/signup.html

@@ -0,0 +1,73 @@
+{% extends "base.html" %}
+
+{% block title %}Sign Up - Vim Docs{% endblock %}
+
+{% block auth_content %}
+<div class="flex items-center justify-center min-h-screen bg-gray-900">
+    <div class="w-full max-w-md p-8 space-y-8 bg-gray-800 rounded-lg shadow-lg">
+        <div class="text-center">
+            <h1 class="text-3xl font-bold text-white">
+                <i class="mdi mdi-vim text-primary text-4xl mr-2"></i> Vim Docs
+            </h1>
+            <p class="mt-2 text-gray-400">Create your account</p>
+        </div>
+        
+        <form class="mt-8 space-y-6" method="POST" action="{{ url_for('auth.signup') }}">
+            {{ form.hidden_tag() }}
+            
+            {% with messages = get_flashed_messages(with_categories=true) %}
+                {% if messages %}
+                    {% for category, message in messages %}
+                        <div class="p-4 {{ 'bg-red-600/20 text-red-400' if category == 'error' else 'bg-green-600/20 text-green-400' }} rounded-md">
+                            {{ message }}
+                        </div>
+                    {% endfor %}
+                {% endif %}
+            {% endwith %}
+            
+            <div>
+                <label for="username" class="block text-sm font-medium text-gray-400">Username</label>
+                <div class="mt-1">
+                    {{ form.username(class="block w-full px-4 py-3 bg-gray-700 border border-gray-600 rounded-md text-white placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-primary focus:border-primary") }}
+                </div>
+                {% for error in form.username.errors %}
+                    <p class="mt-1 text-sm text-red-400">{{ error }}</p>
+                {% endfor %}
+            </div>
+            
+            <div>
+                <label for="password" class="block text-sm font-medium text-gray-400">Password</label>
+                <div class="mt-1">
+                    {{ form.password(class="block w-full px-4 py-3 bg-gray-700 border border-gray-600 rounded-md text-white placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-primary focus:border-primary", placeholder="Minimum 8 characters") }}
+                </div>
+                {% for error in form.password.errors %}
+                    <p class="mt-1 text-sm text-red-400">{{ error }}</p>
+                {% endfor %}
+            </div>
+            
+            <div>
+                <label for="password2" class="block text-sm font-medium text-gray-400">Confirm Password</label>
+                <div class="mt-1">
+                    {{ form.password2(class="block w-full px-4 py-3 bg-gray-700 border border-gray-600 rounded-md text-white placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-primary focus:border-primary") }}
+                </div>
+                {% for error in form.password2.errors %}
+                    <p class="mt-1 text-sm text-red-400">{{ error }}</p>
+                {% endfor %}
+            </div>
+            
+            <div>
+                {{ form.submit(class="w-full flex justify-center py-3 px-4 border border-transparent rounded-md shadow-sm text-sm font-medium text-black bg-primary hover:bg-primary-dark focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary") }}
+            </div>
+            
+            <div class="text-center mt-4">
+                <p class="text-sm text-gray-400">
+                    Already have an account?
+                    <a href="{{ url_for('auth.login') }}" class="font-medium text-primary hover:text-primary-light">
+                        Sign in
+                    </a>
+                </p>
+            </div>
+        </form>
+    </div>
+</div>
+{% endblock %}