First Commit
This commit is contained in:
marco
Executable
+304
@@ -0,0 +1,304 @@
|
||||
<!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>@yield('title', config('app.name', 'Annunk'))</title>
|
||||
|
||||
<link rel="preconnect" href="https://fonts.bunny.net">
|
||||
<link href="https://fonts.bunny.net/css?family=figtree:400,500,600,700&display=swap" rel="stylesheet" />
|
||||
|
||||
<script src="https://cdn.tailwindcss.com"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/alpinejs@3.x.x/dist/cdn.min.js" defer></script>
|
||||
<script>
|
||||
tailwind.config = {
|
||||
theme: {
|
||||
extend: {
|
||||
fontFamily: {
|
||||
sans: ['Figtree', 'sans-serif'],
|
||||
},
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
.hero-gradient {
|
||||
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
||||
}
|
||||
.card-hover {
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
.card-hover:hover {
|
||||
transform: translateY(-4px);
|
||||
box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
|
||||
}
|
||||
[x-cloak] { display: none !important; }
|
||||
</style>
|
||||
</head>
|
||||
<body class="font-sans antialiased bg-gray-50">
|
||||
<div class="min-h-screen flex flex-col">
|
||||
<!-- Navigation -->
|
||||
<nav class="bg-white shadow-sm border-b border-gray-100">
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div class="flex justify-between items-center h-16">
|
||||
<!-- Logo -->
|
||||
<div class="flex items-center">
|
||||
<a href="/" class="text-2xl font-bold bg-gradient-to-r from-indigo-600 to-purple-600 bg-clip-text text-transparent">
|
||||
Annunk
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- Right side -->
|
||||
<div class="flex items-center gap-4">
|
||||
<!-- Language Selector -->
|
||||
<div class="relative">
|
||||
<button id="langDropdownBtn" class="flex items-center gap-2 px-3 py-2 text-sm text-gray-700 hover:text-gray-900 transition">
|
||||
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5h12M9 3v2m1.048 9.5A18.022 18.022 0 016.412 9m6.088 9h7M11 21l5-10 5 10M12.751 5C11.783 10.77 8.07 15.61 3.18 17.34" />
|
||||
</svg>
|
||||
<span class="hidden sm:inline">{{ strtoupper(app()->getLocale()) }}</span>
|
||||
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" />
|
||||
</svg>
|
||||
</button>
|
||||
|
||||
<div id="langDropdown" class="hidden absolute right-0 mt-2 w-48 bg-white rounded-md shadow-lg py-1 z-50 border border-gray-200">
|
||||
<a href="{{ route('language.switch', 'pt_BR') }}" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 {{ app()->getLocale() == 'pt_BR' ? 'bg-indigo-50 text-indigo-600' : '' }}">
|
||||
🇧🇷 Português (Brasil)
|
||||
</a>
|
||||
<a href="{{ route('language.switch', 'en') }}" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 {{ app()->getLocale() == 'en' ? 'bg-indigo-50 text-indigo-600' : '' }}">
|
||||
🇺🇸 English
|
||||
</a>
|
||||
<a href="{{ route('language.switch', 'es') }}" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 {{ app()->getLocale() == 'es' ? 'bg-indigo-50 text-indigo-600' : '' }}">
|
||||
🇪🇸 Español
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Auth Links -->
|
||||
@if (Route::has('login'))
|
||||
@auth
|
||||
<a href="{{ route('dashboard') }}" class="hidden sm:inline-flex items-center px-4 py-2 bg-indigo-600 text-white text-sm font-medium rounded-lg hover:bg-indigo-700 transition">
|
||||
{{ __('welcome.dashboard') }}
|
||||
</a>
|
||||
@else
|
||||
<a href="{{ route('login') }}" class="hidden sm:inline-flex items-center px-4 py-2 text-indigo-600 text-sm font-medium hover:text-indigo-700 transition">
|
||||
{{ __('welcome.log_in') }}
|
||||
</a>
|
||||
@if (Route::has('register'))
|
||||
<a href="{{ route('register') }}" class="inline-flex items-center px-4 py-2 bg-indigo-600 text-white text-sm font-medium rounded-lg hover:bg-indigo-700 transition">
|
||||
{{ __('welcome.get_started') }}
|
||||
</a>
|
||||
@endif
|
||||
@endauth
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<!-- Hero Section -->
|
||||
<main class="flex-grow">
|
||||
<div class="hero-gradient text-white">
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-20 sm:py-32">
|
||||
<div class="text-center">
|
||||
<h1 class="text-4xl sm:text-5xl md:text-6xl font-bold mb-6 leading-tight">
|
||||
<span class="block">{{ __('welcome.learning_insights') }}</span>
|
||||
<span class="block text-indigo-200">{{ __('welcome.powered_by_ai') }}</span>
|
||||
</h1>
|
||||
<p class="mt-3 max-w-md mx-auto text-base sm:text-lg md:text-xl text-indigo-100 md:max-w-3xl">
|
||||
{{ __('welcome.description') }}
|
||||
</p>
|
||||
<div class="mt-8 flex flex-col sm:flex-row gap-4 justify-center">
|
||||
@if (Route::has('register'))
|
||||
<a href="{{ route('register') }}" class="inline-flex items-center justify-center px-8 py-3 border border-transparent text-base font-medium rounded-lg text-indigo-600 bg-white hover:bg-gray-50 md:py-4 md:text-lg transition">
|
||||
{{ __('welcome.get_started') }}
|
||||
</a>
|
||||
@endif
|
||||
@if (Route::has('login'))
|
||||
<a href="{{ route('login') }}" class="inline-flex items-center justify-center px-8 py-3 border-2 border-white text-base font-medium rounded-lg text-white hover:bg-white hover:text-indigo-600 md:py-4 md:text-lg transition">
|
||||
{{ __('welcome.sign_in') }}
|
||||
</a>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Features Section -->
|
||||
<div class="py-16 sm:py-24 bg-white">
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div class="text-center mb-12">
|
||||
<h2 class="text-3xl sm:text-4xl font-bold text-gray-900 mb-4">
|
||||
{{ __('welcome.why_choose_ank2') }}
|
||||
</h2>
|
||||
<p class="text-lg text-gray-600 max-w-2xl mx-auto">
|
||||
{{ __('welcome.why_description') }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
|
||||
<!-- Feature 1 -->
|
||||
<div class="card-hover bg-white border border-gray-200 rounded-xl p-8">
|
||||
<div class="w-12 h-12 bg-indigo-100 rounded-lg flex items-center justify-center mb-6">
|
||||
<svg class="w-6 h-6 text-indigo-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.663 17h4.673M12 3v1m6.364 1.636l-.707.707M21 12h-1M4 12H3m3.343-5.657l-.707-.707m2.828 9.9a5 5 0 117.072 0l-.548.547A3.374 3.374 0 0014 18.469V19a2 2 0 11-4 0v-.531c0-.895-.356-1.754-.988-2.386l-.548-.547z" />
|
||||
</svg>
|
||||
</div>
|
||||
<h3 class="text-xl font-semibold text-gray-900 mb-3">
|
||||
{{ __('welcome.ai_powered_insights') }}
|
||||
</h3>
|
||||
<p class="text-gray-600">
|
||||
{{ __('welcome.ai_description') }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Feature 2 -->
|
||||
<div class="card-hover bg-white border border-gray-200 rounded-xl p-8">
|
||||
<div class="w-12 h-12 bg-purple-100 rounded-lg flex items-center justify-center mb-6">
|
||||
<svg class="w-6 h-6 text-purple-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 18h.01M8 21h8a2 2 0 002-2V5a2 2 0 00-2-2H8a2 2 0 00-2 2v14a2 2 0 002 2z" />
|
||||
</svg>
|
||||
</div>
|
||||
<h3 class="text-xl font-semibold text-gray-900 mb-3">
|
||||
{{ __('welcome.telegram_integration') }}
|
||||
</h3>
|
||||
<p class="text-gray-600">
|
||||
{{ __('welcome.telegram_description') }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Feature 3 -->
|
||||
<div class="card-hover bg-white border border-gray-200 rounded-xl p-8">
|
||||
<div class="w-12 h-12 bg-blue-100 rounded-lg flex items-center justify-center mb-6">
|
||||
<svg class="w-6 h-6 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z" />
|
||||
</svg>
|
||||
</div>
|
||||
<h3 class="text-xl font-semibold text-gray-900 mb-3">
|
||||
{{ __('welcome.track_progress') }}
|
||||
</h3>
|
||||
<p class="text-gray-600">
|
||||
{{ __('welcome.track_description') }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- How It Works Section -->
|
||||
<div class="py-16 sm:py-24 bg-gray-50">
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div class="text-center mb-12">
|
||||
<h2 class="text-3xl sm:text-4xl font-bold text-gray-900 mb-4">
|
||||
{{ __('welcome.how_it_works') }}
|
||||
</h2>
|
||||
<p class="text-lg text-gray-600 max-w-2xl mx-auto">
|
||||
{{ __('welcome.how_description') }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
|
||||
<!-- Step 1 -->
|
||||
<div class="text-center">
|
||||
<div class="w-16 h-16 bg-indigo-600 text-white rounded-full flex items-center justify-center text-2xl font-bold mx-auto mb-6">
|
||||
1
|
||||
</div>
|
||||
<h3 class="text-xl font-semibold text-gray-900 mb-3">
|
||||
{{ __('welcome.create_account') }}
|
||||
</h3>
|
||||
<p class="text-gray-600">
|
||||
{{ __('welcome.create_description') }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Step 2 -->
|
||||
<div class="text-center">
|
||||
<div class="w-16 h-16 bg-indigo-600 text-white rounded-full flex items-center justify-center text-2xl font-bold mx-auto mb-6">
|
||||
2
|
||||
</div>
|
||||
<h3 class="text-xl font-semibold text-gray-900 mb-3">
|
||||
{{ __('welcome.connect_telegram') }}
|
||||
</h3>
|
||||
<p class="text-gray-600">
|
||||
{{ __('welcome.connect_description') }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Step 3 -->
|
||||
<div class="text-center">
|
||||
<div class="w-16 h-16 bg-indigo-600 text-white rounded-full flex items-center justify-center text-2xl font-bold mx-auto mb-6">
|
||||
3
|
||||
</div>
|
||||
<h3 class="text-xl font-semibold text-gray-900 mb-3">
|
||||
{{ __('welcome.start_learning') }}
|
||||
</h3>
|
||||
<p class="text-gray-600">
|
||||
{{ __('welcome.start_description') }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- CTA Section -->
|
||||
<div class="py-16 sm:py-24 bg-white">
|
||||
<div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
|
||||
<h2 class="text-3xl sm:text-4xl font-bold text-gray-900 mb-4">
|
||||
{{ __('welcome.ready_to_transform') }}
|
||||
</h2>
|
||||
<p class="text-lg text-gray-600 mb-8">
|
||||
{{ __('welcome.ready_description') }}
|
||||
</p>
|
||||
@if (Route::has('register'))
|
||||
<a href="{{ route('register') }}" class="inline-flex items-center justify-center px-8 py-3 border border-transparent text-base font-medium rounded-lg text-white bg-indigo-600 hover:bg-indigo-700 md:py-4 md:text-lg transition">
|
||||
{{ __('welcome.get_started_now') }}
|
||||
</a>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="bg-gray-900 text-white mt-auto">
|
||||
<div class="max-w-7xl mx-auto py-8 px-4 sm:px-6 lg:px-8">
|
||||
<div class="text-center">
|
||||
<p class="text-sm text-gray-300">
|
||||
@2026 - {{ __('welcome.all_rights_reserved') }} - {{ __('welcome.powered_by') }} <a href="https://syspanel.com.br" target="_blank" rel="noopener noreferrer" class="text-indigo-400 hover:text-indigo-300">Syspanel</a> - <a href="https://syspanel.com.br" target="_blank" rel="noopener noreferrer" class="text-indigo-400 hover:text-indigo-300">www.syspanel.com.br</a>
|
||||
</p>
|
||||
<p class="text-sm text-gray-300 mt-2">
|
||||
<a href="{{ route('legal.terms') }}" class="text-indigo-400 hover:text-indigo-300">{{ __('Terms of Use') }}</a>
|
||||
<span class="mx-2">|</span>
|
||||
<a href="{{ route('legal.cookies') }}" class="text-indigo-400 hover:text-indigo-300">{{ __('Cookies') }}</a>
|
||||
<span class="mx-2">|</span>
|
||||
<a href="{{ route('legal.privacy') }}" class="text-indigo-400 hover:text-indigo-300">{{ __('Privacy Policy') }}</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@include('components.cookie-banner')
|
||||
|
||||
<script>
|
||||
// Language dropdown toggle
|
||||
const langDropdownBtn = document.getElementById('langDropdownBtn');
|
||||
const langDropdown = document.getElementById('langDropdown');
|
||||
|
||||
if (langDropdownBtn && langDropdown) {
|
||||
langDropdownBtn.addEventListener('click', function(e) {
|
||||
e.stopPropagation();
|
||||
langDropdown.classList.toggle('hidden');
|
||||
});
|
||||
|
||||
document.addEventListener('click', function(e) {
|
||||
if (!langDropdown.contains(e.target) && !langDropdownBtn.contains(e.target)) {
|
||||
langDropdown.classList.add('hidden');
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user