219 lines
16 KiB
PHP
219 lines
16 KiB
PHP
<!DOCTYPE html>
|
|
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>INUFA - Solusi Perlengkapan Event Anda</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;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body class="antialiased bg-white">
|
|
<!-- Header/Navbar -->
|
|
<header class="bg-[#1e3a8a] text-white">
|
|
<div class="container mx-auto px-4 py-4">
|
|
<div class="flex justify-between items-center">
|
|
<div class="flex items-center">
|
|
<h1 class="text-2xl font-bold">INUFA PRODUCTION</h1>
|
|
</div>
|
|
<div class="hidden md:flex space-x-8">
|
|
<a href="#beranda" class="hover:text-blue-200">Beranda</a>
|
|
<a href="#tentang" class="hover:text-blue-200">Tentang</a>
|
|
<a href="#paket" class="hover:text-blue-200">Paket</a>
|
|
<a href="#kontak" class="hover:text-blue-200">Kontak</a>
|
|
</div>
|
|
<div class="flex space-x-4">
|
|
@if (Route::has('login'))
|
|
<div class="flex space-x-4">
|
|
@auth
|
|
<a href="{{ url('/dashboard') }}" class="px-4 py-2 bg-white text-[#1e3a8a] rounded-lg font-medium hover:bg-blue-100 transition duration-300">Dashboard</a>
|
|
@else
|
|
<a href="{{ route('login') }}" class="px-4 py-2 border border-white text-white rounded-lg hover:bg-white hover:text-[#1e3a8a] transition duration-300">Masuk</a>
|
|
@if (Route::has('register'))
|
|
<a href="{{ route('register') }}" class="px-4 py-2 bg-white text-[#1e3a8a] rounded-lg font-medium hover:bg-blue-100 transition duration-300">Daftar</a>
|
|
@endif
|
|
@endauth
|
|
</div>
|
|
@endif
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
<!-- Hero Section -->
|
|
<section id="beranda" class="py-20 bg-gradient-to-b from-[#1e3a8a] to-blue-600 text-white">
|
|
<div class="container mx-auto px-4">
|
|
<div class="flex flex-col md:flex-row items-center">
|
|
<div class="md:w-1/2 mb-10 md:mb-0">
|
|
<h1 class="text-4xl md:text-5xl font-bold mb-6">Sewa Perlengkapan Event</h1>
|
|
<p class="text-xl mb-8">Dapatkan perlengkapan berkualitas untuk segala jenis acara anda. Kami menyediakan berbagai paket yang dapat disesuaikan dengan kebutuhan anda.</p>
|
|
<div class="flex flex-col sm:flex-row space-y-4 sm:space-y-0 sm:space-x-4">
|
|
<a href="#paket" class="px-6 py-3 bg-white text-[#1e3a8a] rounded-lg font-medium text-center hover:bg-blue-100 transition duration-300">Lihat Paket</a>
|
|
<a href="{{ route('register') }}" class="px-6 py-3 border border-white rounded-lg text-center hover:bg-white hover:text-[#1e3a8a] transition duration-300">Daftar Sekarang</a>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Tentang Section -->
|
|
<section id="tentang" class="py-20 bg-gray-50">
|
|
<div class="container mx-auto px-4">
|
|
<div class="text-center mb-16">
|
|
<h2 class="text-3xl font-bold text-gray-800 mb-4">Tentang INUFA</h2>
|
|
<p class="max-w-2xl mx-auto text-gray-600">INUFA merupakan penyedia layanan perlengkapan event yang telah berpengalaman dalam berbagai jenis acara.</p>
|
|
</div>
|
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
|
|
<div class="bg-white p-8 rounded-lg shadow-md">
|
|
<div class="w-16 h-16 bg-blue-100 rounded-full flex items-center justify-center mb-6 mx-auto">
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="h-8 w-8 text-[#1e3a8a]" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" />
|
|
</svg>
|
|
</div>
|
|
<h3 class="text-xl font-semibold text-center mb-4">Kualitas Terbaik</h3>
|
|
<p class="text-gray-600 text-center">Kami menyediakan perlengkapan berkualitas terbaik untuk memastikan acara Anda berjalan lancar.</p>
|
|
</div>
|
|
<div class="bg-white p-8 rounded-lg shadow-md">
|
|
<div class="w-16 h-16 bg-blue-100 rounded-full flex items-center justify-center mb-6 mx-auto">
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="h-8 w-8 text-[#1e3a8a]" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z" />
|
|
</svg>
|
|
</div>
|
|
<h3 class="text-xl font-semibold text-center mb-4">Pengiriman Tepat Waktu</h3>
|
|
<p class="text-gray-600 text-center">Kami berkomitmen untuk selalu mengirimkan perlengkapan tepat waktu sesuai dengan jadwal acara Anda.</p>
|
|
</div>
|
|
<div class="bg-white p-8 rounded-lg shadow-md">
|
|
<div class="w-16 h-16 bg-blue-100 rounded-full flex items-center justify-center mb-6 mx-auto">
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="h-8 w-8 text-[#1e3a8a]" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 10h18M7 15h1m4 0h1m-7 4h12a3 3 0 003-3V8a3 3 0 00-3-3H6a3 3 0 00-3 3v8a3 3 0 003 3z" />
|
|
</svg>
|
|
</div>
|
|
<h3 class="text-xl font-semibold text-center mb-4">Harga Bersaing</h3>
|
|
<p class="text-gray-600 text-center">Kami menawarkan harga yang kompetitif dengan tetap menjaga kualitas layanan terbaik untuk Anda.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Paket Section -->
|
|
<section id="paket" class="py-20">
|
|
<div class="container mx-auto px-4">
|
|
<div class="text-center mb-16">
|
|
<h2 class="text-3xl font-bold text-gray-800 mb-4">Paket Perlengkapan</h2>
|
|
<p class="max-w-2xl mx-auto text-gray-600">Kami menawarkan berbagai paket perlengkapan yang dapat disesuaikan dengan kebutuhan acara Anda.</p>
|
|
</div>
|
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
|
|
@foreach($pakets as $paket)
|
|
<div class="bg-white rounded-lg shadow-md overflow-hidden transition-transform hover:scale-105">
|
|
@if($paket->image)
|
|
<img src="{{ Storage::url($paket->image) }}" alt="{{ $paket->nama_paket }}" class="w-full h-48 object-cover">
|
|
@else
|
|
<img src="https://via.placeholder.com/400x250" alt="{{ $paket->nama_paket }}" class="w-full h-48 object-cover">
|
|
@endif
|
|
<div class="p-6">
|
|
<h3 class="text-xl font-semibold mb-2">{{ $paket->nama_paket }}</h3>
|
|
<p class="text-gray-600 mb-4">{{ $paket->keterangan ?? 'Paket lengkap untuk acara Anda' }}</p>
|
|
<p class="text-xl font-bold text-[#1e3a8a] mb-4">Rp {{ number_format($paket->harga, 0, ',', '.') }}</p>
|
|
@auth
|
|
<a href="{{ route('sewa.create', $paket->id) }}" class="block text-center py-2 px-4 bg-[#1e3a8a] text-white rounded-lg hover:bg-blue-700 transition duration-300">Sewa Sekarang</a>
|
|
@else
|
|
<a href="{{ route('register', ['paket_id' => $paket->id]) }}" class="block text-center py-2 px-4 bg-[#1e3a8a] text-white rounded-lg hover:bg-blue-700 transition duration-300">Sewa Sekarang</a>
|
|
@endauth
|
|
</div>
|
|
</div>
|
|
@endforeach
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Kontak Section -->
|
|
<section id="kontak" class="py-20">
|
|
<div class="container mx-auto px-4">
|
|
<div class="flex flex-col md:flex-row">
|
|
<div class="w-full">
|
|
<h2 class="text-3xl font-bold text-gray-800 mb-6">Hubungi Kami</h2>
|
|
<p class="text-gray-600 mb-8">Silahkan hubungi kami untuk informasi lebih lanjut atau untuk memesan paket perlengkapan event Anda.</p>
|
|
<div class="space-y-4">
|
|
<div class="flex items-start">
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 text-[#1e3a8a] mr-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z" />
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 11a3 3 0 11-6 0 3 3 0 016 0z" />
|
|
</svg>
|
|
<p class="text-gray-700">JL.Trunojoyo Gg SMAK no.50 jember-jatim</p>
|
|
</div>
|
|
<div class="flex items-start">
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 text-[#1e3a8a] mr-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z" />
|
|
</svg>
|
|
<p class="text-gray-700">085331467591</p>
|
|
</div>
|
|
<div class="flex items-start">
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 text-[#1e3a8a] mr-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z" />
|
|
</svg>
|
|
<p class="text-gray-700">info@inufa.com</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Footer -->
|
|
<footer class="bg-[#1e3a8a] text-white py-12">
|
|
<div class="container mx-auto px-4">
|
|
<div class="grid grid-cols-1 md:grid-cols-4 gap-8">
|
|
<div>
|
|
<h3 class="text-xl font-bold mb-4">INUFA</h3>
|
|
<p class="text-blue-200">Solusi terbaik untuk perlengkapan event Anda. Kami menyediakan berbagai pilihan paket yang dapat disesuaikan dengan kebutuhan acara.</p>
|
|
</div>
|
|
<div>
|
|
<h4 class="text-lg font-semibold mb-4">Tautan</h4>
|
|
<ul class="space-y-2">
|
|
<li><a href="#beranda" class="hover:text-blue-200">Beranda</a></li>
|
|
<li><a href="#tentang" class="hover:text-blue-200">Tentang Kami</a></li>
|
|
<li><a href="#paket" class="hover:text-blue-200">Paket</a></li>
|
|
<li><a href="#kontak" class="hover:text-blue-200">Kontak</a></li>
|
|
</ul>
|
|
</div>
|
|
<div>
|
|
<h4 class="text-lg font-semibold mb-4">Layanan</h4>
|
|
<ul class="space-y-2">
|
|
<li>Sewa Peralatan</li>
|
|
<li>Konsultasi Event</li>
|
|
<li>Installasi</li>
|
|
<li>Dukungan Teknis</li>
|
|
</ul>
|
|
</div>
|
|
<div>
|
|
<h4 class="text-lg font-semibold mb-4">Ikuti Kami</h4>
|
|
<div class="flex space-x-4">
|
|
<a href="#" class="h-10 w-10 flex items-center justify-center rounded-full bg-white text-[#1e3a8a] hover:bg-blue-200 transition duration-300">
|
|
<svg class="h-5 w-5" fill="currentColor" viewBox="0 0 24 24">
|
|
<path d="M22.675 0h-21.35c-.732 0-1.325.593-1.325 1.325v21.351c0 .731.593 1.324 1.325 1.324h11.495v-9.294h-3.128v-3.622h3.128v-2.671c0-3.1 1.893-4.788 4.659-4.788 1.325 0 2.463.099 2.795.143v3.24l-1.918.001c-1.504 0-1.795.715-1.795 1.763v2.313h3.587l-.467 3.622h-3.12v9.293h6.116c.73 0 1.323-.593 1.323-1.325v-21.35c0-.732-.593-1.325-1.325-1.325z"/>
|
|
</svg>
|
|
</a>
|
|
<a href="#" class="h-10 w-10 flex items-center justify-center rounded-full bg-white text-[#1e3a8a] hover:bg-blue-200 transition duration-300">
|
|
<svg class="h-5 w-5" fill="currentColor" viewBox="0 0 24 24">
|
|
<path d="M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zm0-2.163c-3.259 0-3.667.014-4.947.072-4.358.2-6.78 2.618-6.98 6.98-.059 1.281-.073 1.689-.073 4.948 0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98 1.281.058 1.689.072 4.948.072 3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98-1.281-.059-1.69-.073-4.949-.073zm0 5.838c-3.403 0-6.162 2.759-6.162 6.162s2.759 6.163 6.162 6.163 6.162-2.759 6.162-6.163c0-3.403-2.759-6.162-6.162-6.162zm0 10.162c-2.209 0-4-1.79-4-4 0-2.209 1.791-4 4-4s4 1.791 4 4c0 2.21-1.791 4-4 4zm6.406-11.845c-.796 0-1.441.645-1.441 1.44s.645 1.44 1.441 1.44c.795 0 1.439-.645 1.439-1.44s-.644-1.44-1.439-1.44z"/>
|
|
</svg>
|
|
</a>
|
|
<a href="#" class="h-10 w-10 flex items-center justify-center rounded-full bg-white text-[#1e3a8a] hover:bg-blue-200 transition duration-300">
|
|
<svg class="h-5 w-5" fill="currentColor" viewBox="0 0 24 24">
|
|
<path d="M8.29 20.251c7.547 0 11.675-6.253 11.675-11.675 0-.178 0-.355-.012-.53A8.348 8.348 0 0022 5.92a8.19 8.19 0 01-2.357.646 4.118 4.118 0 001.804-2.27 8.224 8.224 0 01-2.605.996 4.107 4.107 0 00-6.993 3.743 11.65 11.65 0 01-8.457-4.287 4.106 4.106 0 001.27 5.477A4.072 4.072 0 012.8 9.713v.052a4.105 4.105 0 003.292 4.022 4.095 4.095 0 01-1.853.07 4.108 4.108 0 003.834 2.85A8.233 8.233 0 012 18.407a11.616 11.616 0 006.29 1.84"/>
|
|
</svg>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="border-t border-blue-800 mt-8 pt-8 text-center text-blue-200">
|
|
<p>© {{ date('Y') }} INUFA. Hak Cipta Dilindungi.</p>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
</body>
|
|
</html> |