init commit
This commit is contained in:
David Melendez
194
resources/views/auth/login.blade.php
Normal file
194
resources/views/auth/login.blade.php
Normal file
@@ -0,0 +1,194 @@
|
||||
{{--
|
||||
Professional Login Page - Professional Bootstrap Design
|
||||
Clean and modern login interface
|
||||
|
||||
@author David Valera Melendez <david@valera-melendez.de>
|
||||
@created 2025-08-08
|
||||
@location Made in Germany 🇩🇪
|
||||
--}}
|
||||
|
||||
@extends('layouts.material-auth')
|
||||
|
||||
@section('title', 'Sign In - Professional Resume Builder')
|
||||
@section('page_class', 'auth-page login-page')
|
||||
|
||||
@section('content')
|
||||
<!-- Professional Login Page - Bootstrap Style -->
|
||||
<div class="login-container">
|
||||
<!-- Hero Background Section -->
|
||||
<div class="hero-background">
|
||||
<div class="hero-overlay">
|
||||
<div class="hero-content">
|
||||
<div class="hero-icon">
|
||||
<i class="bi bi-person-badge large-icon"></i>
|
||||
</div>
|
||||
<h1 class="hero-title">Professional Resume Builder</h1>
|
||||
<p class="hero-subtitle">
|
||||
Create impressive, professional resumes with modern design and expert guidance
|
||||
</p>
|
||||
<p class="author-signature">
|
||||
<strong>Created by David Valera Melendez</strong> | Made in Germany 🇩🇪
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Login Form Container -->
|
||||
<div class="login-form-container">
|
||||
<div class="login-card">
|
||||
<div class="card-body">
|
||||
<!-- Form Header -->
|
||||
<div class="form-header">
|
||||
<div class="login-avatar">
|
||||
<i class="bi bi-box-arrow-in-right"></i>
|
||||
</div>
|
||||
<h2 class="form-title">Sign In</h2>
|
||||
<p class="form-subtitle">Welcome back to Resume Builder</p>
|
||||
</div>
|
||||
|
||||
<!-- Error Messages -->
|
||||
@if($errors->any())
|
||||
<div class="alert alert-danger d-flex align-items-center" role="alert">
|
||||
<i class="bi bi-exclamation-triangle-fill me-2"></i>
|
||||
<div>
|
||||
@foreach($errors->all() as $error)
|
||||
<div>{{ $error }}</div>
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
|
||||
<!-- Login Form -->
|
||||
<form method="POST" action="{{ route('login') }}" class="login-form">
|
||||
@csrf
|
||||
|
||||
<!-- Email Field -->
|
||||
<div class="form-group">
|
||||
<div class="form-field">
|
||||
<input
|
||||
type="email"
|
||||
class="form-control material-input @error('email') is-invalid @enderror"
|
||||
id="email"
|
||||
name="email"
|
||||
value="{{ old('email') }}"
|
||||
required
|
||||
autocomplete="email"
|
||||
autofocus
|
||||
placeholder=" "
|
||||
>
|
||||
<label for="email" class="form-label">Email Address</label>
|
||||
<div class="form-outline"></div>
|
||||
@error('email')
|
||||
<div class="invalid-feedback">
|
||||
<i class="bi bi-exclamation-circle me-1"></i>
|
||||
{{ $message }}
|
||||
</div>
|
||||
@enderror
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Password Field -->
|
||||
<div class="form-group">
|
||||
<div class="form-field">
|
||||
<input
|
||||
type="password"
|
||||
class="form-control material-input @error('password') is-invalid @enderror"
|
||||
id="password"
|
||||
name="password"
|
||||
required
|
||||
autocomplete="current-password"
|
||||
placeholder=" "
|
||||
>
|
||||
<label for="password" class="form-label">Password</label>
|
||||
<div class="form-outline"></div>
|
||||
<button type="button" class="password-toggle" onclick="togglePassword('password')">
|
||||
<i class="bi bi-eye" id="password-icon"></i>
|
||||
</button>
|
||||
@error('password')
|
||||
<div class="invalid-feedback">
|
||||
<i class="bi bi-exclamation-circle me-1"></i>
|
||||
{{ $message }}
|
||||
</div>
|
||||
@enderror
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Remember Me & Forgot Password -->
|
||||
<div class="form-options">
|
||||
<div class="form-check">
|
||||
<input
|
||||
type="checkbox"
|
||||
class="form-check-input"
|
||||
id="remember"
|
||||
name="remember"
|
||||
{{ old('remember') ? 'checked' : '' }}
|
||||
>
|
||||
<label class="form-check-label" for="remember">
|
||||
Remember me
|
||||
</label>
|
||||
</div>
|
||||
|
||||
@if (Route::has('password.request'))
|
||||
<a href="{{ route('password.request') }}" class="forgot-password-link">
|
||||
Forgot password?
|
||||
</a>
|
||||
@endif
|
||||
</div>
|
||||
|
||||
<!-- Login Button -->
|
||||
<div class="form-group">
|
||||
<button type="submit" class="btn btn-primary login-btn">
|
||||
<i class="bi bi-box-arrow-in-right me-2"></i>
|
||||
Sign In
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- Social Login Section -->
|
||||
<div class="social-login">
|
||||
<div class="divider">
|
||||
<span>or continue with</span>
|
||||
</div>
|
||||
|
||||
<div class="social-buttons">
|
||||
<button type="button" class="btn social-btn google-btn">
|
||||
<i class="bi bi-google me-2"></i>
|
||||
Google
|
||||
</button>
|
||||
<button type="button" class="btn social-btn github-btn">
|
||||
<i class="bi bi-github me-2"></i>
|
||||
GitHub
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Register Link -->
|
||||
<div class="register-link">
|
||||
<p>Don't have an account?
|
||||
<a href="{{ route('register') }}" class="register-link-text">
|
||||
Sign up here
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@push('scripts')
|
||||
<script>
|
||||
function togglePassword(fieldId) {
|
||||
const passwordField = document.getElementById(fieldId);
|
||||
const passwordIcon = document.getElementById(fieldId + '-icon');
|
||||
|
||||
if (passwordField.type === 'password') {
|
||||
passwordField.type = 'text';
|
||||
passwordIcon.className = 'bi bi-eye-slash';
|
||||
} else {
|
||||
passwordField.type = 'password';
|
||||
passwordIcon.className = 'bi bi-eye';
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@endpush
|
||||
@endsection
|
||||
Reference in New Issue
Block a user