ai-LiaoWangweb-app/app/templates/login.html

{% extends "base.html" %}

{% block content %}
<div class="flex flex-1 justify-center items-center p-4" id="login-view">
    <div class="tech-panel p-10 rounded-xl w-full max-w-sm shadow-2xl border-blue-500/50">
        <h2 class="text-3xl font-extrabold text-center mb-10 text-cyan-300">
            系统登录
        </h2>
        <form class="space-y-6" action="{{ url_for('main.login') }}" method="POST">
            <div class="relative">
                <i class="fas fa-user absolute left-4 top-1/2 transform -translate-y-1/2 text-blue-400"></i>
                <input class="w-full p-3.5 pl-11 bg-gray-800 border border-blue-700 rounded-lg focus:ring-2 focus:ring-cyan-400 focus:border-cyan-400 text-white placeholder-gray-500 transition duration-200 shadow-inner" id="username" name="username" placeholder="用户名" required="" type="text">
            </div>
            <div class="relative">
                <i class="fas fa-lock absolute left-4 top-1/2 transform -translate-y-1/2 text-blue-400"></i>
                <input class="w-full p-3.5 pl-11 bg-gray-800 border border-blue-700 rounded-lg focus:ring-2 focus:ring-cyan-400 focus:border-cyan-400 text-white placeholder-gray-500 transition duration-200 shadow-inner" id="password" name="password" placeholder="密码" required="" type="password">
            </div>
            <button class="tech-button w-full py-3 mt-8 bg-cyan-600 hover:bg-cyan-500 text-white font-bold rounded-lg shadow-lg transition duration-300 transform hover:scale-[1.01] border-cyan-400" type="submit">
                <i class="fas fa-sign-in-alt mr-2"></i> 进入系统
            </button>
            {% if error %}
            <p class="mt-4 text-center text-sm text-red-400">{{ error }}</p>
            {% endif %}
        </form>
    </div>
</div>
{% endblock %}