|
|
<!DOCTYPE html> |
|
|
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}"> |
|
|
<head> |
|
|
<meta charset="utf-8"> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1"> |
|
|
<meta name="csrf-token" content="{{ csrf_token() }}"> |
|
|
|
|
|
<title>{{ config('app.name', 'Laravel') }}</title> |
|
|
|
|
|
<!-- Fonts --> |
|
|
<link rel="preconnect" href="https://fonts.googleapis.com"> |
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> |
|
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet"> |
|
|
|
|
|
<!-- Icons --> |
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> |
|
|
|
|
|
<!-- Scripts --> |
|
|
@vite(['resources/css/app.css', 'resources/js/app.js']) |
|
|
|
|
|
<style> |
|
|
|
|
|
.search-container input { |
|
|
pointer-events: auto !important; |
|
|
z-index: 999 !important; |
|
|
position: relative !important; |
|
|
} |
|
|
|
|
|
.search-container { |
|
|
pointer-events: auto !important; |
|
|
z-index: 999 !important; |
|
|
} |
|
|
|
|
|
|
|
|
.search-container::before, |
|
|
.search-container::after { |
|
|
pointer-events: none !important; |
|
|
} |
|
|
</style> |
|
|
|
|
|
<style> |
|
|
body { font-family: 'Inter', sans-serif; } |
|
|
</style> |
|
|
</head> |
|
|
<body class="font-sans antialiased"> |
|
|
<!-- Loading Screen --> |
|
|
<x-loading-screen /> |
|
|
|
|
|
<!-- Background Blobs --> |
|
|
<div class="bg-blob bg-blob-1"></div> |
|
|
<div class="bg-blob bg-blob-2"></div> |
|
|
<div class="bg-blob bg-blob-3"></div> |
|
|
<div class="min-h-screen"> |
|
|
@include('layouts.navigation') |
|
|
|
|
|
<!-- Global Search Shortcut Handler --> |
|
|
<script> |
|
|
document.addEventListener('keydown', function(e) { |
|
|
|
|
|
if ((e.ctrlKey && e.key === '`') || (e.ctrlKey && e.key === 'k')) { |
|
|
e.preventDefault(); |
|
|
const searchInput = document.querySelector('input[placeholder*="Search"]'); |
|
|
if (searchInput) { |
|
|
searchInput.focus(); |
|
|
searchInput.select(); |
|
|
} |
|
|
} |
|
|
}); |
|
|
</script> |
|
|
|
|
|
<!-- Page Heading --> |
|
|
@isset($header) |
|
|
<header class="bg-black/20 backdrop-blur-xl border-b border-white/10"> |
|
|
<div class="max-w-7xl mx-auto py-6 px-4 sm:px-6 lg:px-8"> |
|
|
{{ $header }} |
|
|
</div> |
|
|
</header> |
|
|
@endisset |
|
|
|
|
|
<!-- Page Content --> |
|
|
<main class="pb-12 bg-transparent"> |
|
|
@yield('content') |
|
|
{{ $slot ?? '' }} |
|
|
</main> |
|
|
|
|
|
<!-- Footer --> |
|
|
<footer class="bg-gray-900 text-white py-12 mt-20"> |
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> |
|
|
<div class="grid grid-cols-1 md:grid-cols-4 gap-8"> |
|
|
<div class="col-span-1 md:col-span-2"> |
|
|
<h3 class="text-2xl font-bold mb-4">{{ config('app.name', 'Laravel') }}</h3> |
|
|
<p class="text-gray-400 mb-4">Your premium gaming store for the best digital products and services.</p> |
|
|
<div class="flex space-x-4"> |
|
|
<a href="#" class="text-gray-400 hover:text-white transition-colors"> |
|
|
<i class="fab fa-facebook-f"></i> |
|
|
</a> |
|
|
<a href="#" class="text-gray-400 hover:text-white transition-colors"> |
|
|
<i class="fab fa-twitter"></i> |
|
|
</a> |
|
|
<a href="#" class="text-gray-400 hover:text-white transition-colors"> |
|
|
<i class="fab fa-instagram"></i> |
|
|
</a> |
|
|
</div> |
|
|
</div> |
|
|
<div> |
|
|
<h4 class="text-lg font-semibold mb-4">Quick Links</h4> |
|
|
<ul class="space-y-2 text-gray-400"> |
|
|
<li><a href="{{ route('categories') }}" class="hover:text-white transition-colors">Store</a></li> |
|
|
<li><a href="{{ route('cart.index') }}" class="hover:text-white transition-colors">Cart</a></li> |
|
|
<li><a href=" |
|
|
</ul> |
|
|
</div> |
|
|
<div> |
|
|
<h4 class="text-lg font-semibold mb-4">Contact</h4> |
|
|
<ul class="space-y-2 text-gray-400"> |
|
|
<li><i class="fas fa-envelope mr-2"></i>support@example.com</li> |
|
|
<li><i class="fas fa-phone mr-2"></i>+66 123 456 789</li> |
|
|
<li><i class="fas fa-map-marker-alt mr-2"></i>Bangkok, Thailand</li> |
|
|
</ul> |
|
|
</div> |
|
|
</div> |
|
|
<div class="border-t border-gray-800 mt-8 pt-8 text-center text-gray-400"> |
|
|
<p>© {{ date('Y') }} {{ config('app.name', 'Laravel') }}. All rights reserved.</p> |
|
|
</div> |
|
|
</div> |
|
|
</footer> |
|
|
</div> |
|
|
|
|
|
@stack('scripts') |
|
|
</body> |
|
|
</html> |
|
|
|
