Gecko [ fastearnlimited.com ]

Name	Size	Permission	Date
admin.blade.php	10.14 KB	-rw-r--r--	2025-09-15 01:48
app.blade.php	8.08 KB	-rw-r--r--	2025-09-15 01:28
bottom-nav.blade.php	5.48 KB	-rw-r--r--	2025-09-15 01:29
header.blade.php	8.13 KB	-rw-r--r--	2025-09-15 01:28

Rename

<!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', 'FastEarnAds') }} - @yield('title', 'Earn Money Watching Ads')</title>
    
    
    <link rel="preconnect" href="https://fonts.bunny.net">
    <link href="https://fonts.bunny.net/css?family=inter:400,500,600,700&display=swap" rel="stylesheet" />
    
    
    @vite(['resources/css/app.css', 'resources/js/app.js'])
    
    
    <meta name="theme-color" content="#4F46E5">
    <meta name="mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
    
    
    <style>
        [x-cloak] { display: none !important; }
        
        /* Custom scrollbar */
        ::-webkit-scrollbar {
            width: 6px;
        }
        
        ::-webkit-scrollbar-track {
            background: #f1f5f9;
        }
        
        ::-webkit-scrollbar-thumb {
            background: #cbd5e1;
            border-radius: 3px;
        }
        
        ::-webkit-scrollbar-thumb:hover {
            background: #94a3b8;
        }
        
        /* Smooth animations */
        * {
            transition: all 0.2s ease-in-out;
        }
        
        /* Loading animation */
        .loading-pulse {
            animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
        }
        
        @keyframes pulse {
            0%, 100% {
                opacity: 1;
            }
            50% {
                opacity: .5;
            }
        }
        
        /* Gradient backgrounds */
        .gradient-primary {
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
        }
        
        .gradient-success {
            background: linear-gradient(135deg, #4ade80 0%, #22c55e 100%);
        }
        
        .gradient-warning {
            background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);
        }
        
        .gradient-danger {
            background: linear-gradient(135deg, #f87171 0%, #ef4444 100%);
        }
        
        /* Glass morphism effect */
        .glass {
            background: rgba(255, 255, 255, 0.1);
            backdrop-filter: blur(10px);
            border: 1px solid rgba(255, 255, 255, 0.2);
        }
        
        /* Card hover effects */
        .card-hover {
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        }
        
        .card-hover:hover {
            transform: translateY(-2px);
            box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
        }
        
        /* Bottom navigation safe area */
        .bottom-nav-safe {
            padding-bottom: env(safe-area-inset-bottom);
        }
    </style>
</head>
<body class="bg-gray-50 font-sans antialiased">
    <div class="min-h-screen">
        
        @include('layouts.header')
        
        
        <main class="pb-20 min-h-screen">
            @yield('content')
        </main>
        
        
        @include('layouts.bottom-nav')
        
        
        <div id="notifications" class="fixed top-4 right-4 z-50 space-y-2"></div>
        
        
        <div id="loading-overlay" 
             class="fixed inset-0 bg-black bg-opacity-50 z-50 hidden items-center justify-center">
            <div class="bg-white rounded-2xl p-8 m-4 text-center max-w-sm">
                <div class="loading-pulse w-12 h-12 mx-auto mb-4 bg-indigo-600 rounded-full"></div>
                <p class="text-gray-700 font-medium">Loading...</p>
            </div>
        </div>
    </div>
    
    
    <script defer src="https://unpkg.com/alpinejs@3.x.x/dist/cdn.min.js"></script>
    
    
    <script>
        // Global notification system
        window.showNotification = function(message, type = 'success') {
            const notification = document.createElement('div');
            notification.className = `
                flex items-center p-4 mb-2 text-sm rounded-lg shadow-lg transform translate-x-full transition-transform duration-300
                ${type === 'success' ? 'bg-green-50 text-green-800 border border-green-200' : ''}
                ${type === 'error' ? 'bg-red-50 text-red-800 border border-red-200' : ''}
                ${type === 'warning' ? 'bg-yellow-50 text-yellow-800 border border-yellow-200' : ''}
                ${type === 'info' ? 'bg-blue-50 text-blue-800 border border-blue-200' : ''}
            `;
            
            notification.innerHTML = `
                <div class="flex-1">${message}</div>
                <button onclick="this.parentElement.remove()" class="ml-3 text-current opacity-70 hover:opacity-100">
                    <svg class="w-4 h-4" fill="currentColor" viewBox="0 0 20 20">
                        <path fill-rule="evenodd" d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" clip-rule="evenodd"></path>
                    </svg>
                </button>
            `;
            
            document.getElementById('notifications').appendChild(notification);
            
            // Animate in
            setTimeout(() => {
                notification.classList.remove('translate-x-full');
            }, 100);
            
            // Auto remove after 5 seconds
            setTimeout(() => {
                notification.classList.add('translate-x-full');
                setTimeout(() => notification.remove(), 300);
            }, 5000);
        };
        
        // Global loading overlay
        window.showLoading = function() {
            document.getElementById('loading-overlay').classList.remove('hidden');
            document.getElementById('loading-overlay').classList.add('flex');
        };
        
        window.hideLoading = function() {
            document.getElementById('loading-overlay').classList.add('hidden');
            document.getElementById('loading-overlay').classList.remove('flex');
        };
        
        // API helper function
        window.apiCall = async function(url, options = {}) {
            showLoading();
            try {
                const response = await fetch(url, {
                    headers: {
                        'Content-Type': 'application/json',
                        'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').getAttribute('content'),
                        ...options.headers
                    },
                    ...options
                });
                
                const data = await response.json();
                
                if (!response.ok) {
                    throw new Error(data.message || 'Something went wrong');
                }
                
                return data;
            } finally {
                hideLoading();
            }
        };
        
        // Format currency
        window.formatCurrency = function(amount) {
            return new Intl.NumberFormat('en-US', {
                style: 'currency',
                currency: 'USD',
                minimumFractionDigits: 2
            }).format(amount);
        };
        
        // Format time
        window.formatTime = function(seconds) {
            const mins = Math.floor(seconds / 60);
            const secs = seconds % 60;
            return `${mins.toString().padStart(2, '0')}:${secs.toString().padStart(2, '0')}`;
        };
    </script>
    
    @yield('scripts')
</body>
</html>