First Commit
This commit is contained in:
marco
Executable
+125
@@ -0,0 +1,125 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="csrf-token" content="{{ csrf_token() }}">
|
||||
<title>Login - GPrompt</title>
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap" rel="stylesheet">
|
||||
<style>
|
||||
body { font-family: 'Roboto', sans-serif; background-color: #f8f9fc; }
|
||||
.login-container { min-height: 100vh; display: flex; align-items: center; justify-content: center; }
|
||||
.login-card { border: none; box-shadow: 0 2px 15px rgba(0,0,0,0.1); border-radius: 10px; width: 100%; max-width: 400px; }
|
||||
.login-header { background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white; border-radius: 10px 10px 0 0; padding: 2rem; text-align: center; }
|
||||
.password-toggle { cursor: pointer; position: absolute; right: 10px; top: 38px; }
|
||||
.captcha-refresh { cursor: pointer; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="login-container d-flex flex-column">
|
||||
<div class="login-card flex-grow-0">
|
||||
<div class="login-header">
|
||||
<i class="bi bi-cpu" style="font-size: 3rem;"></i>
|
||||
<h2 class="mt-2">GPrompt</h2>
|
||||
<p>Faça login para continuar</p>
|
||||
</div>
|
||||
<div class="card-body p-4">
|
||||
@if(session('error'))
|
||||
<div class="alert alert-danger">{{ session('error') }}</div>
|
||||
@endif
|
||||
@if(session('success'))
|
||||
<div class="alert alert-success">{{ session('success') }}</div>
|
||||
@endif
|
||||
|
||||
<form method="POST" action="{{ route('login') }}">
|
||||
@csrf
|
||||
<div class="mb-3">
|
||||
<label for="email" class="form-label">E-mail</label>
|
||||
<input type="email" class="form-control" id="email" name="email" value="{{ old('email') }}" required autofocus autocomplete="username">
|
||||
@error('email') <div class="text-danger small">{{ $message }}</div> @enderror
|
||||
</div>
|
||||
<div class="mb-3 position-relative">
|
||||
<label for="password" class="form-label">Senha</label>
|
||||
<input type="password" class="form-control" id="password" name="password" required autocomplete="current-password">
|
||||
<i class="bi bi-eye-slash password-toggle" id="togglePassword"></i>
|
||||
@error('password') <div class="text-danger small">{{ $message }}</div> @enderror
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="captcha" class="form-label">Captcha</label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text" id="captchaQuestion">Carregando...</span>
|
||||
<input type="text" class="form-control" id="captcha" name="captcha" required maxlength="4">
|
||||
<button type="button" class="btn btn-outline-secondary captcha-refresh" id="refreshCaptcha">
|
||||
<i class="bi bi-arrow-clockwise"></i>
|
||||
</button>
|
||||
</div>
|
||||
@error('captcha') <div class="text-danger small">{{ $message }}</div> @enderror
|
||||
</div>
|
||||
<div class="mb-3 form-check">
|
||||
<input type="checkbox" class="form-check-input" id="remember_me" name="remember">
|
||||
<label class="form-check-label" for="remember_me">Lembrar de mim</label>
|
||||
</div>
|
||||
<button type="submit" class="btn btn-primary w-100">Entrar</button>
|
||||
</form>
|
||||
<div class="mt-3 text-center">
|
||||
<a href="{{ route('password.request') }}">Esqueceu a senha?</a>
|
||||
</div>
|
||||
@if(Route::has('register'))
|
||||
<div class="mt-3 text-center">
|
||||
<span>Não tem conta? <a href="{{ route('register') }}">Cadastre-se</a></span>
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@include('components.app-footer')
|
||||
</div>
|
||||
|
||||
@include('components.cookie-consent-banner')
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
|
||||
<script>
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
initLogin();
|
||||
});
|
||||
} else {
|
||||
initLogin();
|
||||
}
|
||||
|
||||
function initLogin() {
|
||||
const toggle = document.getElementById('togglePassword');
|
||||
const input = document.getElementById('password');
|
||||
if (toggle && input) {
|
||||
toggle.addEventListener('click', function() {
|
||||
const type = input.getAttribute('type') === 'password' ? 'text' : 'password';
|
||||
input.setAttribute('type', type);
|
||||
toggle.classList.toggle('bi-eye');
|
||||
toggle.classList.toggle('bi-eye-slash');
|
||||
});
|
||||
}
|
||||
|
||||
function loadCaptcha() {
|
||||
const question = document.getElementById('captchaQuestion');
|
||||
fetch('{{ route('captcha.generate') }}')
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
if (question) question.textContent = data.expression;
|
||||
})
|
||||
.catch(() => {
|
||||
if (question) question.textContent = 'Erro ao carregar captcha.';
|
||||
});
|
||||
}
|
||||
|
||||
const refresh = document.getElementById('refreshCaptcha');
|
||||
if (refresh) {
|
||||
refresh.addEventListener('click', loadCaptcha);
|
||||
}
|
||||
|
||||
loadCaptcha();
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user