151 lines
9.6 KiB
PHP
151 lines
9.6 KiB
PHP
@extends('layouts.app')
|
|
|
|
<!DOCTYPE html>
|
|
<html lang="id">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Profile INUFA</title>
|
|
<script src="https://cdn.tailwindcss.com"></script>
|
|
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap" rel="stylesheet">
|
|
<style>
|
|
body {
|
|
font-family: 'Poppins', sans-serif;
|
|
}
|
|
.form-input:focus {
|
|
box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.2);
|
|
}
|
|
.gradient-bg {
|
|
background: linear-gradient(135deg, #4F46E5 0%, #1E1B4B 100%);
|
|
}
|
|
</style>
|
|
</head>
|
|
<body class="bg-gray-50 min-h-screen">
|
|
<div class="flex flex-col md:flex-row w-full min-h-screen">
|
|
|
|
<!-- Logo Section -->
|
|
<div class="flex-1 flex items-center justify-center bg-white p-8">
|
|
<div class="w-full max-w-[600px] transform hover:scale-105 transition-transform duration-300">
|
|
<img src="{{ asset('assets/images/logo.png') }}" alt="INUFA Logo" class="w-full h-auto object-contain">
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Form Profile Section -->
|
|
<div class="flex-1 gradient-bg text-white p-8 md:p-12">
|
|
<div class="max-w-md mx-auto">
|
|
<div class="text-center mb-12">
|
|
<h2 class="text-4xl font-bold mb-4">Profile</h2>
|
|
<p class="text-gray-300">Kelola informasi profil Anda</p>
|
|
</div>
|
|
|
|
@if(session('success'))
|
|
<div class="bg-green-500/20 border border-green-500 text-green-100 px-4 py-3 rounded-lg mb-6">
|
|
{{ session('success') }}
|
|
</div>
|
|
@endif
|
|
|
|
@if(session('error'))
|
|
<div class="bg-red-500/20 border border-red-500 text-red-100 px-4 py-3 rounded-lg mb-6">
|
|
{{ session('error') }}
|
|
</div>
|
|
@endif
|
|
|
|
@if($errors->any())
|
|
<div class="bg-red-500/20 border border-red-500 text-red-100 px-4 py-3 rounded-lg mb-6">
|
|
<ul class="list-disc list-inside">
|
|
@foreach($errors->all() as $error)
|
|
<li>{{ $error }}</li>
|
|
@endforeach
|
|
</ul>
|
|
</div>
|
|
@endif
|
|
|
|
<form action="{{ route('profile.update') }}" method="POST" class="space-y-6">
|
|
@csrf
|
|
@method('PUT')
|
|
|
|
<!-- Username -->
|
|
<div class="relative group">
|
|
<span class="absolute inset-y-0 left-3 flex items-center text-gray-400 group-focus-within:text-indigo-400 transition-colors duration-200">
|
|
<svg class="h-5 w-5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"></path>
|
|
<circle cx="12" cy="7" r="4"></circle>
|
|
</svg>
|
|
</span>
|
|
<input type="text" name="username" placeholder="Username" value="{{ old('username', $user->username) }}"
|
|
class="form-input pl-10 pr-4 py-3 w-full rounded-lg bg-white/10 backdrop-blur-sm border border-white/20 text-white placeholder-gray-400 focus:outline-none focus:border-indigo-400 transition-all duration-200">
|
|
</div>
|
|
|
|
<!-- Email -->
|
|
<div class="relative group">
|
|
<span class="absolute inset-y-0 left-3 flex items-center text-gray-400 group-focus-within:text-indigo-400 transition-colors duration-200">
|
|
<svg class="h-5 w-5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path>
|
|
<polyline points="22,6 12,13 2,6"></polyline>
|
|
</svg>
|
|
</span>
|
|
<input type="email" name="email" placeholder="Email" value="{{ old('email', $user->email) }}"
|
|
class="form-input pl-10 pr-4 py-3 w-full rounded-lg bg-white/10 backdrop-blur-sm border border-white/20 text-white placeholder-gray-400 focus:outline-none focus:border-indigo-400 transition-all duration-200">
|
|
</div>
|
|
|
|
<!-- No.Telp -->
|
|
<div class="relative group">
|
|
<span class="absolute inset-y-0 left-3 flex items-center text-gray-400 group-focus-within:text-indigo-400 transition-colors duration-200">
|
|
<svg class="h-5 w-5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z"></path>
|
|
</svg>
|
|
</span>
|
|
<input type="text" name="phone" placeholder="No. Telepon" value="{{ old('phone', $user->no_telp) }}"
|
|
class="form-input pl-10 pr-4 py-3 w-full rounded-lg bg-white/10 backdrop-blur-sm border border-white/20 text-white placeholder-gray-400 focus:outline-none focus:border-indigo-400 transition-all duration-200">
|
|
</div>
|
|
|
|
<!-- Alamat -->
|
|
<div class="relative group">
|
|
<span class="absolute inset-y-0 left-3 flex items-center text-gray-400 group-focus-within:text-indigo-400 transition-colors duration-200">
|
|
<svg class="h-5 w-5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"></path>
|
|
<circle cx="12" cy="10" r="3"></circle>
|
|
</svg>
|
|
</span>
|
|
<input type="text" name="address" placeholder="Alamat" value="{{ old('address', $user->alamat) }}"
|
|
class="form-input pl-10 pr-4 py-3 w-full rounded-lg bg-white/10 backdrop-blur-sm border border-white/20 text-white placeholder-gray-400 focus:outline-none focus:border-indigo-400 transition-all duration-200">
|
|
</div>
|
|
|
|
<!-- Password -->
|
|
<div class="relative group">
|
|
<span class="absolute inset-y-0 left-3 flex items-center text-gray-400 group-focus-within:text-indigo-400 transition-colors duration-200">
|
|
<svg class="h-5 w-5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<rect x="3" y="11" width="18" height="11" rx="2" ry="2"></rect>
|
|
<path d="M7 11V7a5 5 0 0 1 10 0v4"></path>
|
|
</svg>
|
|
</span>
|
|
<input type="password" name="password" placeholder="Password (Kosongkan jika tidak ingin mengubah)"
|
|
class="form-input pl-10 pr-4 py-3 w-full rounded-lg bg-white/10 backdrop-blur-sm border border-white/20 text-white placeholder-gray-400 focus:outline-none focus:border-indigo-400 transition-all duration-200">
|
|
</div>
|
|
|
|
<!-- Tombol Simpan -->
|
|
<div class="text-center mt-10">
|
|
<button type="submit"
|
|
class="w-full bg-white text-indigo-600 hover:bg-indigo-50 font-semibold py-3 px-8 rounded-lg transform hover:scale-105 transition-all duration-200 shadow-lg hover:shadow-xl">
|
|
Simpan Perubahan
|
|
</button>
|
|
</div>
|
|
|
|
<!-- Tombol Kembali -->
|
|
<div class="text-center mt-4">
|
|
<a href="{{ route('dashboard') }}"
|
|
class="w-full inline-block bg-transparent border-2 border-white text-white hover:bg-white/10 font-semibold py-3 px-8 rounded-lg transform hover:scale-105 transition-all duration-200">
|
|
<span class="inline-flex items-center justify-center">
|
|
<svg class="h-5 w-5 mr-2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<path d="M19 12H5M12 19l-7-7 7-7"/>
|
|
</svg>
|
|
Kembali
|
|
</span>
|
|
</a>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html>
|