Demo-Project/Laravel
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

init commit

Browse Source
This commit is contained in:
David Melendez
2026-01-14 22:38:44 +01:00
parent 4e0c415f0b
commit e25d53d054
124 changed files with 21653 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

220
resources/views/profile/edit.blade.php Normal file
View File

@@ -0,0 +1,220 @@
{{--
Edit Profile - Professional Bootstrap Design
Professional Profile Edit Page
@author David Valera Melendez <david@valera-melendez.de>
@created 2025-08-09
@location Made in Germany 🇩🇪
--}}
@extends('layouts.app')
@section('title', 'Edit Profile - Professional Resume Builder')
@section('page_class', 'profile-edit-page')
@section('content')
<div class="profile-edit-container">
<!-- Page Header -->
<section class="page-header">
<div class="d-flex justify-content-between align-items-center">
<div>
<h1 class="page-title">Edit Profile</h1>
<p class="page-subtitle">Update your personal information and preferences</p>
</div>
<a href="{{ route('profile.show') }}" class="btn secondary-cta">
<i class="bi bi-arrow-left"></i>
Back to Profile
</a>
</div>
</section>
<!-- Edit Profile Form -->
<section class="profile-edit-form">
<form method="POST" action="{{ route('profile.update') }}" enctype="multipart/form-data">
@csrf
@method('PUT')
<div class="row g-4">
<!-- Personal Information Card -->
<div class="col-lg-8">
<div class="card form-card">
<div class="card-header">
<h5 class="card-title mb-0">
<i class="bi bi-person"></i>
Personal Information
</h5>
</div>
<div class="card-body">
<div class="row g-3">
<!-- Full Name -->
<div class="col-12">
<div class="form-floating">
<input type="text"
class="form-control @error('name') is-invalid @enderror"
id="name"
name="name"
value="{{ old('name', $user->name) }}"
placeholder="Full Name"
required>
<label for="name">Full Name *</label>
@error('name')
<div class="invalid-feedback">{{ $message }}</div>
@enderror
</div>
</div>
<!-- Email -->
<div class="col-md-6">
<div class="form-floating">
<input type="email"
class="form-control @error('email') is-invalid @enderror"
id="email"
name="email"
value="{{ old('email', $user->email) }}"
placeholder="Email Address"
required>
<label for="email">Email Address *</label>
@error('email')
<div class="invalid-feedback">{{ $message }}</div>
@enderror
</div>
</div>
<!-- Phone -->
<div class="col-md-6">
<div class="form-floating">
<input type="tel"
class="form-control @error('phone') is-invalid @enderror"
id="phone"
name="phone"
value="{{ old('phone', $user->phone) }}"
placeholder="Phone Number">
<label for="phone">Phone Number</label>
@error('phone')
<div class="invalid-feedback">{{ $message }}</div>
@enderror
</div>
</div>
<!-- Bio -->
<div class="col-12">
<div class="form-floating">
<textarea class="form-control @error('bio') is-invalid @enderror"
id="bio"
name="bio"
style="height: 120px"
placeholder="Tell us about yourself">{{ old('bio', $user->bio) }}</textarea>
<label for="bio">About Me</label>
@error('bio')
<div class="invalid-feedback">{{ $message }}</div>
@enderror
</div>
<div class="form-text">
<i class="bi bi-info-circle"></i>
Optional: Brief description about yourself (max 1000 characters)
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Profile Picture Card -->
<div class="col-lg-4">
<div class="card form-card">
<div class="card-header">
<h5 class="card-title mb-0">
<i class="bi bi-camera"></i>
Profile Picture
</h5>
</div>
<div class="card-body text-center">
<div class="profile-avatar-edit">
@if($user->avatar)
<img src="{{ Storage::url($user->avatar) }}" alt="{{ $user->name }}" class="current-avatar" id="avatarPreview">
@else
<div class="avatar-placeholder" id="avatarPreview">
<i class="bi bi-person-circle"></i>
</div>
@endif
</div>
<div class="avatar-upload mt-3">
<input type="file"
class="form-control @error('avatar') is-invalid @enderror"
id="avatar"
name="avatar"
accept="image/*"
style="display: none;">
<button type="button" class="btn primary-cta" onclick="document.getElementById('avatar').click()">
<i class="bi bi-cloud-upload"></i>
Choose Photo
</button>
@error('avatar')
<div class="invalid-feedback d-block">{{ $message }}</div>
@enderror
<div class="form-text mt-2">
<i class="bi bi-info-circle"></i>
JPG, PNG or GIF (max 2MB)
</div>
</div>
</div>
</div>
<!-- Save Changes Card -->
<div class="card form-card mt-4">
<div class="card-body">
<div class="d-grid gap-2">
<button type="submit" class="btn primary-cta">
<i class="bi bi-check-circle"></i>
Save Changes
</button>
<a href="{{ route('profile.show') }}" class="btn btn-outline-secondary">
<i class="bi bi-x-circle"></i>
Cancel
</a>
</div>
</div>
</div>
</div>
</div>
</form>
</section>
</div>
@push('scripts')
<script>
document.addEventListener('DOMContentLoaded', function() {
// Avatar preview functionality
const avatarInput = document.getElementById('avatar');
const avatarPreview = document.getElementById('avatarPreview');
if (avatarInput && avatarPreview) {
avatarInput.addEventListener('change', function(e) {
const file = e.target.files[0];
if (file) {
const reader = new FileReader();
reader.onload = function(e) {
avatarPreview.innerHTML = '<img src="' + e.target.result + '" alt="Avatar Preview" class="current-avatar">';
};
reader.readAsDataURL(file);
}
});
}
// Form validation feedback
const form = document.querySelector('form');
if (form) {
form.addEventListener('submit', function(e) {
// Add loading state
const submitBtn = form.querySelector('button[type="submit"]');
if (submitBtn) {
submitBtn.disabled = true;
submitBtn.innerHTML = '<i class="bi bi-hourglass-split"></i> Saving...';
}
});
}
});
</script>
@endpush
@endsection