ui login, register, navbar, footer
This commit is contained in:
parent
ea5d4f3cde
commit
0ee947f611
|
@ -0,0 +1,18 @@
|
|||
<?php
|
||||
|
||||
namespace App\Filament\Pages;
|
||||
|
||||
use Filament\Pages\Dashboard as BaseDashboard;
|
||||
use App\Filament\Widgets\CalendarWidget;
|
||||
|
||||
class Dashboard extends BaseDashboard
|
||||
{
|
||||
protected static ?string $navigationIcon = 'heroicon-o-home';
|
||||
|
||||
protected function getHeaderWidgets(): array
|
||||
{
|
||||
return [
|
||||
CalendarWidget::class,
|
||||
];
|
||||
}
|
||||
}
|
Binary file not shown.
After Width: | Height: | Size: 419 KiB |
|
@ -1,75 +1,50 @@
|
|||
<div class="w-full max-w-[85rem] py-10 px-4 sm:px-6 lg:px-8 mx-auto">
|
||||
<div class="flex h-full items-center">
|
||||
<main class="w-full max-w-md mx-auto p-6">
|
||||
<div class="bg-white border border-gray-200 rounded-xl shadow-sm dark:bg-gray-800 dark:border-gray-700">
|
||||
<div class="p-4 sm:p-7">
|
||||
<div class="text-center">
|
||||
<h1 class="block text-2xl font-bold text-gray-800 dark:text-white">Log in</h1>
|
||||
<p class="mt-2 text-sm text-gray-600 dark:text-gray-400">
|
||||
Tidak memiliki akun?
|
||||
<a wire:navigate class="text-blue-600 decoration-2 hover:underline font-medium dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="/register">
|
||||
Daftar disini
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
<div class="min-h-screen bg-gray-400 flex items-center justify-center px-4">
|
||||
<div class="bg-white rounded-lg shadow-lg flex flex-col lg:flex-row w-full max-w-4xl overflow-hidden">
|
||||
|
||||
<!-- Left Side - Logo -->
|
||||
<div class="bg-gray-200 flex items-center justify-center lg:w-1/2 p-6">
|
||||
<img src="{{ asset('images/logo.png') }}" alt="Logo" class="w-72 h-72 sm:w-40 sm:h-40 lg:w-56 lg:h-56 object-cover rounded-full border-2 border-gray-400 shadow-md">
|
||||
</div>
|
||||
|
||||
<!-- Right Side - Form -->
|
||||
<div class="w-full lg:w-1/2 p-6 sm:p-10">
|
||||
<div class="w-full border border-gray-200 rounded-xl shadow-sm dark:bg-gray-800 dark:border-gray-700">
|
||||
<div class="p-4 sm:p-7">
|
||||
<h1 class="text-2xl font-bold text-center text-gray-800 mb-6">Login</h1>
|
||||
<form wire:submit.prevent="save" class="space-y-6">
|
||||
|
||||
<hr class="my-5 border-slate-300">
|
||||
|
||||
<!-- Form -->
|
||||
<form wire:submit.prevent="save">
|
||||
@if (session('error'))
|
||||
<div class="mt-2 bg-red-500 text-sm text-white rounded-lg p-4 mb-4" role="alert" tabindex="-1" aria-labelledby="hs-solid-color-danger-label">
|
||||
{{ session('error') }}
|
||||
</div>
|
||||
@endif
|
||||
<div class="grid gap-y-4">
|
||||
<!-- Form Group -->
|
||||
<div>
|
||||
<label for="email" class="block text-sm mb-2 dark:text-white">Email address</label>
|
||||
<div class="relative">
|
||||
<input type="email" id="email" wire:model="email" class="py-3 px-4 block w-full border border-gray-200 rounded-lg text-sm focus:border-blue-500 focus:ring-blue-500 disabled:opacity-50
|
||||
disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-700 dark:text-gray-400 dark:focus:ring-gray-600" aria-describedby="email-error">
|
||||
@error('email')
|
||||
<div class="absolute inset-y-0 end-0 flex items-center pointer-events-none pe-3">
|
||||
<svg class="h-5 w-5 text-red-500" width="16" height="16" fill="currentColor" viewBox="0 0 16 16" aria-hidden="true">
|
||||
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM8 4a.905.905 0 0 0-.9.995l.35 3.507a.552.552 0 0 0 1.1 0l.35-3.507A.905.905 0 0 0 8 4zm.002 6a1 1 0 1 0 0 2 1 1 0 0 0 0-2z" />
|
||||
</svg>
|
||||
</div>
|
||||
@enderror
|
||||
</div>
|
||||
@error('email')
|
||||
<p class="text-xs text-red-600 mt-2" id="email-error">{{ $message }}</p>
|
||||
@enderror
|
||||
</div>
|
||||
<!-- End Form Group -->
|
||||
|
||||
<!-- Form Group -->
|
||||
<div>
|
||||
<div class="flex justify-between items-center">
|
||||
<label for="password" class="block text-sm mb-2 dark:text-white">Password</label>
|
||||
<a class="text-sm text-blue-600 decoration-2 hover:underline font-medium dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="/forgot">Lupa password?</a>
|
||||
</div>
|
||||
<div class="relative">
|
||||
<input type="password" id="password" wire:model="password" class="py-3 px-4 block w-full border border-gray-200 rounded-lg text-sm focus:border-blue-500
|
||||
focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-700 dark:text-gray-400 dark:focus:ring-gray-600" aria-describedby="password-error">
|
||||
@error('password')
|
||||
<div class="absolute inset-y-0 end-0 flex items-center pointer-events-none pe-3">
|
||||
<svg class="h-5 w-5 text-red-500" width="16" height="16" fill="currentColor" viewBox="0 0 16 16" aria-hidden="true">
|
||||
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM8 4a.905.905 0 0 0-.9.995l.35 3.507a.552.552 0 0 0 1.1 0l.35-3.507A.905.905 0 0 0 8 4zm.002 6a1 1 0 1 0 0 2 1 1 0 0 0 0-2z" />
|
||||
</svg>
|
||||
</div>
|
||||
@enderror
|
||||
</div>
|
||||
@error('password')
|
||||
<p class="text-xs text-red-600 mt-2" id="password-error">{{ $message }}</p>
|
||||
@enderror
|
||||
</div>
|
||||
<!-- End Form Group -->
|
||||
<button type="submit" class="w-full py-3 px-4 inline-flex justify-center items-center gap-x-2 text-sm font-semibold rounded-lg border border-transparent bg-blue-600 text-white hover:bg-blue-700 disabled:opacity-50 disabled:pointer-events-none dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600">Sign in</button>
|
||||
</div>
|
||||
</form>
|
||||
<!-- End Form -->
|
||||
@if (session('error'))
|
||||
<div class="bg-red-500 text-white p-4 rounded-lg text-sm mb-4" role="alert">
|
||||
{{ session('error') }}
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
|
||||
<!-- Email -->
|
||||
<div>
|
||||
<label for="email" class="block text-sm font-medium text-gray-700 mb-1 dark:text-white">Email address</label>
|
||||
<input type="email" id="email" wire:model="email" class="py-3 px-4 block w-full border border-gray-200 rounded-lg text-sm focus:border-blue-500 focus:ring-blue-500 dark:bg-slate-900 dark:border-gray-700 dark:text-gray-400 dark:focus:ring-gray-600">
|
||||
@error('email')
|
||||
<p class="text-xs text-red-600 mt-2" id="email-error">{{ $message }}</p>
|
||||
@enderror
|
||||
</div>
|
||||
|
||||
<!-- Password -->
|
||||
<div>
|
||||
<div class="flex justify-between items-center mb-1">
|
||||
<label for="password" class="block text-sm font-medium text-gray-700 dark:text-white">Password</label>
|
||||
{{--<a href="/forgot" class="text-sm text-blue-600 hover:underline">Lupa password?</a>--}}
|
||||
</div>
|
||||
<input type="password" id="password" wire:model="password" class="py-3 px-4 block w-full border border-gray-200 rounded-lg text-sm focus:border-blue-500 focus:ring-blue-500 dark:bg-slate-900 dark:border-gray-700 dark:text-gray-400 dark:focus:ring-gray-600">
|
||||
@error('password')
|
||||
<p class="text-xs text-red-600 mt-2" id="password-error">{{ $message }}</p>
|
||||
@enderror
|
||||
</div>
|
||||
|
||||
<!-- Submit Button -->
|
||||
<button type="submit" class="w-full py-3 px-4 bg-gray-600 text-white font-semibold rounded-lg hover:bg-gray-700">Login</button>
|
||||
|
||||
<p class="text-sm text-center text-gray-600">Sudah punya akun? <a href="/register" class="text-blue-600 hover:underline">Daftar</a></p>
|
||||
</form>
|
||||
</>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -1,87 +1,96 @@
|
|||
<div class="w-full max-w-[85rem] py-10 px-4 sm:px-6 lg:px-8 mx-auto">
|
||||
<div class="flex h-full items-center">
|
||||
<main class="w-full max-w-md mx-auto p-6">
|
||||
<div class="bg-white border border-gray-200 rounded-xl shadow-sm dark:bg-gray-800 dark:border-gray-700">
|
||||
<div class="p-4 sm:p-7">
|
||||
<div class="text-center">
|
||||
<h1 class="block text-2xl font-bold text-gray-800 dark:text-white">Sign In</h1>
|
||||
<p class="mt-2 text-sm text-gray-600 dark:text-gray-400">
|
||||
Sudah punya akun?
|
||||
<a wire:navigate class="text-blue-600 decoration-2 hover:underline font-medium dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="/login">
|
||||
Log in disini
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
<hr class="my-5 border-slate-300">
|
||||
<!-- Form -->
|
||||
<form wire:submit.prevent="save">
|
||||
<div class="grid gap-y-4">
|
||||
<!-- Form Group -->
|
||||
<div class="min-h-screen bg-gray-400 flex items-center justify-center px-4">
|
||||
<div class="bg-white rounded-lg shadow-lg flex flex-col lg:flex-row w-full max-w-4xl overflow-hidden">
|
||||
|
||||
<!-- Logo Kiri -->
|
||||
<div class="flex items-center justify-center bg-gray-300 w-full md:w-1/2 p-6">
|
||||
<img src="{{ asset('images/logo.png') }}" alt="Logo" class="w-64 h-64 object-cover rounded-full border-2 border-black shadow-md">
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label for="name" class="block text-sm mb-2 dark:text-white">Nama</label>
|
||||
<div class="relative">
|
||||
<input type="text" id="name" wire:model="name" class="py-3 px-4 block w-full border border-gray-200 rounded-lg text-sm focus:border-blue-500 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-700 dark:text-gray-400 dark:focus:ring-gray-600" aria-describedby="email-error">
|
||||
@error('name')
|
||||
<div class="absolute inset-y-0 end-0 flex items-center pointer-events-none pe-3">
|
||||
<svg class="h-5 w-5 text-red-500" width="16" height="16" fill="currentColor" viewBox="0 0 16 16" aria-hidden="true">
|
||||
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM8 4a.905.905 0 0 0-.9.995l.35 3.507a.552.552 0 0 0 1.1 0l.35-3.507A.905.905 0 0 0 8 4zm.002 6a1 1 0 1 0 0 2 1 1 0 0 0 0-2z" />
|
||||
</svg>
|
||||
</div>
|
||||
@enderror
|
||||
</div>
|
||||
@error('name')
|
||||
<p class="text-xs text-red-600 mt-2" id="email-error">{{ $message }}</p>
|
||||
@enderror
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label for="email" class="block text-sm mb-2 dark:text-white">Email address</label>
|
||||
<div class="relative">
|
||||
<input type="email" id="email" wire:model="email" class="py-3 px-4 block w-full border border-gray-200 rounded-lg text-sm focus:border-blue-500 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-700 dark:text-gray-400 dark:focus:ring-gray-600" aria-describedby="email-error">
|
||||
@error('email')
|
||||
<div class="absolute inset-y-0 end-0 flex items-center pointer-events-none pe-3">
|
||||
<svg class="h-5 w-5 text-red-500" width="16" height="16" fill="currentColor" viewBox="0 0 16 16" aria-hidden="true">
|
||||
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM8 4a.905.905 0 0 0-.9.995l.35 3.507a.552.552 0 0 0 1.1 0l.35-3.507A.905.905 0 0 0 8 4zm.002 6a1 1 0 1 0 0 2 1 1 0 0 0 0-2z" />
|
||||
</svg>
|
||||
</div>
|
||||
@enderror
|
||||
</div>
|
||||
@error('email')
|
||||
<p class="text-xs text-red-600 mt-2" id="email-error">{{ $message }}</p>
|
||||
@enderror
|
||||
</div>
|
||||
<!-- End Form Group -->
|
||||
|
||||
<!-- Form Group -->
|
||||
<div>
|
||||
<div class="flex justify-between items-center">
|
||||
<label for="password" class="block text-sm mb-2 dark:text-white">Password</label>
|
||||
|
||||
</div>
|
||||
<div class="relative">
|
||||
<input type="password" id="password" wire:model="password" class="py-3 border px-4 block w-full border-gray-200 rounded-lg text-sm focus:border-blue-500 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-700 dark:text-gray-400 dark:focus:ring-gray-600" aria-describedby="password-error">
|
||||
@error('password')
|
||||
<div class="absolute inset-y-0 end-0 flex items-center pointer-events-none pe-3">
|
||||
<svg class="h-5 w-5 text-red-500" width="16" height="16" fill="currentColor" viewBox="0 0 16 16" aria-hidden="true">
|
||||
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM8 4a.905.905 0 0 0-.9.995l.35 3.507a.552.552 0 0 0 1.1 0l.35-3.507A.905.905 0 0 0 8 4zm.002 6a1 1 0 1 0 0 2 1 1 0 0 0 0-2z" />
|
||||
</svg>
|
||||
</div>
|
||||
@enderror
|
||||
</div>
|
||||
</div>
|
||||
@error('password')
|
||||
<p class="text-xs text-red-600 mt-2" id="email-error">{{ $message }}</p>
|
||||
@enderror
|
||||
</div>
|
||||
<!-- End Form Group -->
|
||||
|
||||
|
||||
<button type="submit" class="w-full py-3 px-4 inline-flex justify-center items-center gap-x-2 text-sm font-semibold rounded-lg border border-transparent bg-blue-600 text-white hover:bg-blue-700 disabled:opacity-50 disabled:pointer-events-none dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600">Sign Up</button>
|
||||
<!-- Form Kanan -->
|
||||
<div class="bg-white w-full md:w-1/2 flex items-center justify-center p-10">
|
||||
<main class="w-full max-w-md mx-auto">
|
||||
<div class="w-full border border-gray-200 rounded-xl shadow-sm dark:bg-gray-800 dark:border-gray-700">
|
||||
<div class="p-4 sm:p-7">
|
||||
<div class="text-center">
|
||||
<h1 class="block text-2xl font-bold text-gray-800 dark:text-white">Sign In</h1>
|
||||
<p class="mt-2 text-sm text-gray-600 dark:text-gray-400">
|
||||
Sudah punya akun?
|
||||
<a wire:navigate class="text-blue-600 decoration-2 hover:underline font-medium dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="/login">
|
||||
Log in disini
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
</form>
|
||||
<!-- End Form -->
|
||||
<hr class="my-5 border-slate-300">
|
||||
|
||||
<!-- Form -->
|
||||
<form wire:submit.prevent="save">
|
||||
<div class="grid gap-y-4">
|
||||
|
||||
<!-- Field Nama -->
|
||||
<div>
|
||||
<label for="name" class="block text-sm mb-2 dark:text-white">Nama</label>
|
||||
<div class="relative">
|
||||
<input type="text" id="name" wire:model="name" class="py-3 px-4 block w-full border border-gray-200 rounded-lg text-sm focus:border-blue-500 focus:ring-blue-500 dark:bg-slate-900 dark:border-gray-700 dark:text-gray-400 dark:focus:ring-gray-600" aria-describedby="email-error">
|
||||
@error('name')
|
||||
<div class="absolute inset-y-0 end-0 flex items-center pointer-events-none pe-3">
|
||||
<svg class="h-5 w-5 text-red-500" width="16" height="16" fill="currentColor" viewBox="0 0 16 16" aria-hidden="true">
|
||||
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM8 4a.905.905 0 0 0-.9.995l.35 3.507a.552.552 0 0 0 1.1 0l.35-3.507A.905.905 0 0 0 8 4zm.002 6a1 1 0 1 0 0 2 1 1 0 0 0 0-2z"/>
|
||||
</svg>
|
||||
</div>
|
||||
@enderror
|
||||
</div>
|
||||
@error('name')
|
||||
<p class="text-xs text-red-600 mt-2" id="email-error">{{ $message }}</p>
|
||||
@enderror
|
||||
</div>
|
||||
|
||||
<!-- Field Email -->
|
||||
<div>
|
||||
<label for="email" class="block text-sm mb-2 dark:text-white">Email address</label>
|
||||
<div class="relative">
|
||||
<input type="email" id="email" wire:model="email" class="py-3 px-4 block w-full border border-gray-200 rounded-lg text-sm focus:border-blue-500 focus:ring-blue-500 dark:bg-slate-900 dark:border-gray-700 dark:text-gray-400 dark:focus:ring-gray-600" aria-describedby="email-error">
|
||||
@error('email')
|
||||
<div class="absolute inset-y-0 end-0 flex items-center pointer-events-none pe-3">
|
||||
<svg class="h-5 w-5 text-red-500" width="16" height="16" fill="currentColor" viewBox="0 0 16 16" aria-hidden="true">
|
||||
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM8 4a.905.905 0 0 0-.9.995l.35 3.507a.552.552 0 0 0 1.1 0l.35-3.507A.905.905 0 0 0 8 4zm.002 6a1 1 0 1 0 0 2 1 1 0 0 0 0-2z"/>
|
||||
</svg>
|
||||
</div>
|
||||
@enderror
|
||||
</div>
|
||||
@error('email')
|
||||
<p class="text-xs text-red-600 mt-2" id="email-error">{{ $message }}</p>
|
||||
@enderror
|
||||
</div>
|
||||
|
||||
<!-- Field Password -->
|
||||
<div>
|
||||
<label for="password" class="block text-sm mb-2 dark:text-white">Password</label>
|
||||
<div class="relative">
|
||||
<input type="password" id="password" wire:model="password" class="py-3 border px-4 block w-full border-gray-200 rounded-lg text-sm focus:border-blue-500 focus:ring-blue-500 dark:bg-slate-900 dark:border-gray-700 dark:text-gray-400 dark:focus:ring-gray-600" aria-describedby="password-error">
|
||||
@error('password')
|
||||
<div class="absolute inset-y-0 end-0 flex items-center pointer-events-none pe-3">
|
||||
<svg class="h-5 w-5 text-red-500" width="16" height="16" fill="currentColor" viewBox="0 0 16 16" aria-hidden="true">
|
||||
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM8 4a.905.905 0 0 0-.9.995l.35 3.507a.552.552 0 0 0 1.1 0l.35-3.507A.905.905 0 0 0 8 4zm.002 6a1 1 0 1 0 0 2 1 1 0 0 0 0-2z"/>
|
||||
</svg>
|
||||
</div>
|
||||
@enderror
|
||||
</div>
|
||||
@error('password')
|
||||
<p class="text-xs text-red-600 mt-2" id="email-error">{{ $message }}</p>
|
||||
@enderror
|
||||
</div>
|
||||
|
||||
<!-- Tombol -->
|
||||
<button type="submit" class="w-full py-3 px-4 inline-flex justify-center items-center gap-x-2 text-sm font-semibold rounded-lg border border-transparent bg-gray-600 text-white hover:bg-gray-700 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600">
|
||||
Sign Up
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
<!-- End Form -->
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -1,40 +1,40 @@
|
|||
<footer class="bg-gray-900 w-full">
|
||||
<footer class="bg-gray-100 w-full">
|
||||
<div class="w-full max-w-[85rem] py-10 px-4 sm:px-6 lg:px-8 lg:pt-20 mx-auto">
|
||||
<!-- Grid -->
|
||||
<div class="grid grid-cols-2 md:grid-cols-4 lg:grid-cols-5 gap-6">
|
||||
<div class="col-span-full lg:col-span-1">
|
||||
<a class="flex-none text-xl font-semibold text-white dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#" aria-label="Brand">SiKolaself</a>
|
||||
<a class="flex-none text-xl font-semibold text-black dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#" aria-label="Brand">SiKolaself</a>
|
||||
</div>
|
||||
<!-- End Col -->
|
||||
|
||||
<div class="col-span-1">
|
||||
<h4 class="font-semibold text-gray-100">Product</h4>
|
||||
<h4 class="font-semibold text-gray-900">Product</h4>
|
||||
|
||||
<div class="mt-3 grid space-y-3">
|
||||
<p><a class="inline-flex gap-x-2 text-gray-400 hover:text-gray-200 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="/categories">Categories</a></p>
|
||||
<p><a class="inline-flex gap-x-2 text-gray-400 hover:text-gray-200 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="/products">All Products</a></p>
|
||||
<p><a class="inline-flex gap-x-2 text-gray-400 hover:text-gray-200 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="/products">Featured Products</a></p>
|
||||
<p><a class="inline-flex gap-x-2 text-gray-600 hover:text-gray-400 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="/categories">Categories</a></p>
|
||||
<p><a class="inline-flex gap-x-2 text-gray-600 hover:text-gray-400 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="/products">All Products</a></p>
|
||||
<p><a class="inline-flex gap-x-2 text-gray-600 hover:text-gray-400 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="/products">Featured Products</a></p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- End Col -->
|
||||
|
||||
<div class="col-span-1">
|
||||
<h4 class="font-semibold text-gray-100">Company</h4>
|
||||
<h4 class="font-semibold text-gray-900">Company</h4>
|
||||
|
||||
<div class="mt-3 grid space-y-3">
|
||||
<p><a class="inline-flex gap-x-2 text-gray-400 hover:text-gray-200 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">About us</a></p>
|
||||
<p><a class="inline-flex gap-x-2 text-gray-400 hover:text-gray-200 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">Blog</a></p>
|
||||
<p><a class="inline-flex gap-x-2 text-gray-600 hover:text-gray-400 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">About us</a></p>
|
||||
<p><a class="inline-flex gap-x-2 text-gray-600 hover:text-gray-400 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">Blog</a></p>
|
||||
|
||||
<p><a class="inline-flex gap-x-2 text-gray-400 hover:text-gray-200 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">Customers</a></p>
|
||||
<p><a class="inline-flex gap-x-2 text-gray-600 hover:text-gray-400 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="#">Customers</a></p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- End Col -->
|
||||
|
||||
<div class="col-span-2">
|
||||
<h4 class="font-semibold text-gray-100">Stay up to date</h4>
|
||||
<h4 class="font-semibold text-gray-900">Stay up to date</h4>
|
||||
|
||||
<form>
|
||||
<div class="mt-4 flex flex-col items-center gap-2 sm:flex-row sm:gap-3 bg-white rounded-lg p-2 dark:bg-gray-800">
|
||||
<div class="mt-4 flex flex-col items-center gap-2 sm:flex-row sm:gap-3 bg-gray-400 rounded-lg p-2 dark:bg-gray-800">
|
||||
<div class="w-full">
|
||||
<input type="text" id="hero-input" name="hero-input" class="py-3 px-4 block w-full border-transparent rounded-lg text-sm focus:border-blue-500 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-transparent dark:text-gray-400 dark:focus:ring-gray-600" placeholder="Enter your email">
|
||||
</div>
|
||||
|
@ -51,7 +51,7 @@
|
|||
|
||||
<div class="mt-5 sm:mt-12 grid gap-y-2 sm:gap-y-0 sm:flex sm:justify-between sm:items-center">
|
||||
<div class="flex justify-between items-center">
|
||||
<p class="text-sm text-gray-400">© 2024 SiKolaself. All rights reserved.</p>
|
||||
<p class="text-sm text-gray-900">© 2024 SiKolaself. All rights reserved.</p>
|
||||
</div>
|
||||
<!-- End Col -->
|
||||
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
<header class="flex z-50 sticky top-0 flex-wrap md:justify-start md:flex-nowrap w-full bg-white text-sm py-3 md:py-0 dark:bg-gray-800 shadow-md">
|
||||
<header class="flex z-50 sticky top-0 flex-wrap md:justify-start md:flex-nowrap w-full bg-gray-100 text-sm py-3 md:py-0 dark:bg-gray-800 shadow-md">
|
||||
<script defer src="https://unpkg.com/alpinejs@3.x.x/dist/cdn.min.js"></script>
|
||||
<nav class="max-w-[85rem] w-full mx-auto px-4 md:px-6 lg:px-8" aria-label="Global">
|
||||
<div class="relative md:flex md:items-center md:justify-between">
|
||||
|
@ -23,9 +23,9 @@
|
|||
<div class="overflow-hidden overflow-y-auto max-h-[75vh] [&::-webkit-scrollbar]:w-2 [&::-webkit-scrollbar-thumb]:rounded-full [&::-webkit-scrollbar-track]:bg-gray-100 [&::-webkit-scrollbar-thumb]:bg-gray-300 dark:[&::-webkit-scrollbar-track]:bg-slate-700 dark:[&::-webkit-scrollbar-thumb]:bg-slate-500">
|
||||
<div class="flex flex-col gap-x-0 mt-5 divide-y divide-dashed divide-gray-200 md:flex-row md:items-center md:justify-end md:gap-x-7 md:mt-0 md:ps-7 md:divide-y-0 md:divide-solid dark:divide-gray-700">
|
||||
|
||||
<a wire:navigate class="font-medium {{ request()->is('/')?'text-blue-600':'text-gray-500' }} py-3 md:py-6 dark:text-blue-500 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="/" aria-current="page">Home</a>
|
||||
<a wire:navigate class="font-medium {{ request()->is('/')?'text-gray-900':'text-gray-500' }} py-3 md:py-6 dark:text-blue-500 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="/" aria-current="page">Home</a>
|
||||
|
||||
<a wire:navigate class="font-medium {{ request()->is('paketfoto')?'text-blue-600':'text-gray-500' }} hover:text-gray-400 py-3 md:py-6 dark:text-gray-400 dark:hover:text-gray-500 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="/paketfoto">
|
||||
<a wire:navigate class="font-medium {{ request()->is('paketfoto')?'text-gray-600':'text-gray-500' }} hover:text-gray-400 py-3 md:py-6 dark:text-gray-400 dark:hover:text-gray-500 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="/paketfoto">
|
||||
Paket Foto
|
||||
</a>
|
||||
|
||||
|
@ -36,13 +36,13 @@
|
|||
<span class="mr-1">Cart</span> <span class="py-0.5 px-1.5 rounded-full text-xs font-medium bg-blue-50 border border-blue-200 text-blue-600">{{ $total_count }}</span>
|
||||
</a>--}}
|
||||
|
||||
<a wire:navigate class="font-medium {{ request()->is('histori')?'text-blue-600':'text-gray-500' }} hover:text-gray-400 py-3 md:py-6 dark:text-gray-400 dark:hover:text-gray-500 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="/histori">
|
||||
<a wire:navigate class="font-medium {{ request()->is('histori')?'text-gray-600':'text-gray-500' }} hover:text-gray-400 py-3 md:py-6 dark:text-gray-400 dark:hover:text-gray-500 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="/histori">
|
||||
Histori
|
||||
</a>
|
||||
|
||||
@guest
|
||||
<div class="pt-3 md:pt-0">
|
||||
<a wire:navigate class="py-2.5 px-4 inline-flex items-center gap-x-2 text-sm font-semibold rounded-lg border border-transparent bg-blue-600 text-white hover:bg-blue-700 disabled:opacity-50 disabled:pointer-events-none dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="/login">
|
||||
<a wire:navigate class="py-2.5 px-4 inline-flex items-center gap-x-2 text-sm font-semibold rounded-lg border border-transparent bg-gray-600 text-white hover:bg-gray-700 disabled:opacity-50 disabled:pointer-events-none dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" href="/login">
|
||||
<svg class="flex-shrink-0 w-4 h-4" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||||
<path d="M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2" />
|
||||
<circle cx="12" cy="7" r="4" />
|
||||
|
@ -73,12 +73,12 @@ class="flex items-center w-full text-gray-500 hover:text-gray-400 font-medium da
|
|||
x-transition:leave-end="opacity-0 scale-95"
|
||||
class="absolute right-0 mt-2 w-48 bg-white rounded-lg shadow-lg py-2 z-50 dark:bg-gray-800 dark:border dark:border-gray-700" style="position: fixed; top: 60px;">
|
||||
|
||||
<a class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300" href="#">
|
||||
{{-- <a class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300" href="#">
|
||||
My Orders
|
||||
</a>
|
||||
<a class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300" href="#">
|
||||
My Account
|
||||
</a>
|
||||
</a>--}}
|
||||
<a class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-300" href="/logout">
|
||||
Logout
|
||||
</a>
|
||||
|
|
Loading…
Reference in New Issue