Add initial website setup: Created essential files including package-lock.json, setup documentation, and foundational Blade templates. Implemented PageController for homepage and page display, integrated navigation and footer components, and established dark mode functionality. Enhanced CSS for custom scrollbar and smooth scrolling. Added SVG logos for branding. Updated routes for page handling.
This commit is contained in:
Ümit Tunç
@@ -0,0 +1,61 @@
|
||||
<footer class="bg-gray-50 dark:bg-gray-800 border-t border-gray-200 dark:border-gray-700 transition-colors duration-300">
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
|
||||
<div class="grid grid-cols-1 md:grid-cols-4 gap-8">
|
||||
<!-- Logo ve Açıklama -->
|
||||
<div class="col-span-1 md:col-span-2">
|
||||
<img src="{{ asset('logos/truncgil-yatay.svg') }}" alt="Trunçgil Teknoloji" class="h-10 mb-4 dark:hidden">
|
||||
<img src="{{ asset('logos/truncgil-yatay-dark.svg') }}" alt="Trunçgil Teknoloji" class="h-10 mb-4 hidden dark:block">
|
||||
<p class="text-gray-600 dark:text-gray-400 mt-4 max-w-md">
|
||||
Trunçgil Teknoloji olarak, yenilikçi ve güvenilir teknoloji çözümleri sunuyoruz.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Hızlı Linkler -->
|
||||
<div>
|
||||
<h3 class="text-sm font-semibold text-gray-900 dark:text-gray-100 uppercase tracking-wider mb-4">
|
||||
Hızlı Linkler
|
||||
</h3>
|
||||
<ul class="space-y-3">
|
||||
@foreach($menuItems->take(4) as $item)
|
||||
<li>
|
||||
<a href="{{ $item->url }}" class="text-gray-600 dark:text-gray-400 hover:text-red-600 dark:hover:text-red-400 transition-colors duration-150">
|
||||
{{ $item->title }}
|
||||
</a>
|
||||
</li>
|
||||
@endforeach
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<!-- İletişim -->
|
||||
<div>
|
||||
<h3 class="text-sm font-semibold text-gray-900 dark:text-gray-100 uppercase tracking-wider mb-4">
|
||||
İletişim
|
||||
</h3>
|
||||
<ul class="space-y-3 text-gray-600 dark:text-gray-400">
|
||||
<li class="flex items-start">
|
||||
<svg class="w-5 h-5 mr-2 mt-0.5 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<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"></path>
|
||||
</svg>
|
||||
<a href="mailto:info@truncgil.com" class="hover:text-red-600 dark:hover:text-red-400 transition-colors duration-150">
|
||||
info@truncgil.com
|
||||
</a>
|
||||
</li>
|
||||
<li class="flex items-start">
|
||||
<svg class="w-5 h-5 mr-2 mt-0.5 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<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"></path>
|
||||
</svg>
|
||||
<span>+90 (XXX) XXX XX XX</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Copyright -->
|
||||
<div class="mt-12 pt-8 border-t border-gray-200 dark:border-gray-700">
|
||||
<p class="text-center text-gray-500 dark:text-gray-400 text-sm">
|
||||
© {{ date('Y') }} Trunçgil Teknoloji. Tüm hakları saklıdır.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@@ -0,0 +1,127 @@
|
||||
<nav x-data="{ mobileMenuOpen: false }" class="fixed w-full top-0 z-50 bg-white/80 dark:bg-gray-900/80 backdrop-blur-lg border-b border-gray-200 dark:border-gray-800 transition-colors duration-300">
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div class="flex justify-between items-center h-20">
|
||||
<!-- Logo -->
|
||||
<div class="flex-shrink-0">
|
||||
<a href="{{ route('home') }}" class="flex items-center">
|
||||
<img src="{{ asset('logos/truncgil-yatay.svg') }}" alt="Trunçgil Teknoloji" class="h-10 dark:hidden">
|
||||
<img src="{{ asset('logos/truncgil-yatay-dark.svg') }}" alt="Trunçgil Teknoloji" class="h-10 hidden dark:block">
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- Desktop Navigation -->
|
||||
<div class="hidden md:flex md:items-center md:space-x-1">
|
||||
@foreach($menuItems as $item)
|
||||
@if($item->children->count() > 0)
|
||||
<!-- Dropdown Menu -->
|
||||
<div x-data="{ open: false }" @mouseenter="open = true" @mouseleave="open = false" class="relative">
|
||||
<button @click="open = !open" class="px-4 py-2 text-sm font-medium text-gray-700 dark:text-gray-300 hover:text-red-600 dark:hover:text-red-400 transition-colors duration-200 flex items-center space-x-1">
|
||||
<span>{{ $item->title }}</span>
|
||||
<svg class="w-4 h-4 transition-transform duration-200" :class="{ 'rotate-180': open }" 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"></path>
|
||||
</svg>
|
||||
</button>
|
||||
|
||||
<!-- Dropdown Panel -->
|
||||
<div x-show="open"
|
||||
x-transition:enter="transition ease-out duration-200"
|
||||
x-transition:enter-start="opacity-0 translate-y-1"
|
||||
x-transition:enter-end="opacity-100 translate-y-0"
|
||||
x-transition:leave="transition ease-in duration-150"
|
||||
x-transition:leave-start="opacity-100 translate-y-0"
|
||||
x-transition:leave-end="opacity-0 translate-y-1"
|
||||
class="absolute left-0 mt-2 w-56 bg-white dark:bg-gray-800 rounded-lg shadow-xl border border-gray-200 dark:border-gray-700 py-2"
|
||||
style="display: none;">
|
||||
@foreach($item->children as $child)
|
||||
<a href="{{ $child->url }}" class="block px-4 py-2 text-sm text-gray-700 dark:text-gray-300 hover:bg-red-50 dark:hover:bg-gray-700 hover:text-red-600 dark:hover:text-red-400 transition-colors duration-150">
|
||||
{{ $child->title }}
|
||||
</a>
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
@else
|
||||
<!-- Single Menu Item -->
|
||||
<a href="{{ $item->url }}" class="px-4 py-2 text-sm font-medium text-gray-700 dark:text-gray-300 hover:text-red-600 dark:hover:text-red-400 transition-colors duration-200">
|
||||
{{ $item->title }}
|
||||
</a>
|
||||
@endif
|
||||
@endforeach
|
||||
|
||||
<!-- Dark Mode Toggle -->
|
||||
<button @click="darkMode = !darkMode" class="ml-4 p-2 rounded-lg text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors duration-200">
|
||||
<svg x-show="!darkMode" 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="M20.354 15.354A9 9 0 018.646 3.646 9.003 9.003 0 0012 21a9.003 9.003 0 008.354-5.646z"></path>
|
||||
</svg>
|
||||
<svg x-show="darkMode" class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24" style="display: none;">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16 12a4 4 0 11-8 0 4 4 0 018 0z"></path>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- Mobile menu button -->
|
||||
<div class="flex items-center md:hidden">
|
||||
<!-- Dark Mode Toggle (Mobile) -->
|
||||
<button @click="darkMode = !darkMode" class="mr-2 p-2 rounded-lg text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors duration-200">
|
||||
<svg x-show="!darkMode" 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="M20.354 15.354A9 9 0 018.646 3.646 9.003 9.003 0 0012 21a9.003 9.003 0 008.354-5.646z"></path>
|
||||
</svg>
|
||||
<svg x-show="darkMode" class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24" style="display: none;">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16 12a4 4 0 11-8 0 4 4 0 018 0z"></path>
|
||||
</svg>
|
||||
</button>
|
||||
|
||||
<button @click="mobileMenuOpen = !mobileMenuOpen" class="p-2 rounded-lg text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors duration-200">
|
||||
<svg x-show="!mobileMenuOpen" class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path>
|
||||
</svg>
|
||||
<svg x-show="mobileMenuOpen" class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" style="display: none;">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Mobile Navigation -->
|
||||
<div x-show="mobileMenuOpen"
|
||||
x-transition:enter="transition ease-out duration-200"
|
||||
x-transition:enter-start="opacity-0 transform -translate-y-2"
|
||||
x-transition:enter-end="opacity-100 transform translate-y-0"
|
||||
x-transition:leave="transition ease-in duration-150"
|
||||
x-transition:leave-start="opacity-100 transform translate-y-0"
|
||||
x-transition:leave-end="opacity-0 transform -translate-y-2"
|
||||
class="md:hidden bg-white dark:bg-gray-800 border-t border-gray-200 dark:border-gray-700"
|
||||
style="display: none;">
|
||||
<div class="px-4 pt-2 pb-4 space-y-1">
|
||||
@foreach($menuItems as $item)
|
||||
@if($item->children->count() > 0)
|
||||
<!-- Mobile Dropdown -->
|
||||
<div x-data="{ open: false }" class="space-y-1">
|
||||
<button @click="open = !open" class="w-full flex items-center justify-between px-3 py-2 text-base font-medium text-gray-700 dark:text-gray-300 hover:bg-gray-50 dark:hover:bg-gray-700 rounded-lg transition-colors duration-150">
|
||||
<span>{{ $item->title }}</span>
|
||||
<svg class="w-4 h-4 transition-transform duration-200" :class="{ 'rotate-180': open }" 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"></path>
|
||||
</svg>
|
||||
</button>
|
||||
<div x-show="open" class="pl-4 space-y-1" style="display: none;">
|
||||
@foreach($item->children as $child)
|
||||
<a href="{{ $child->url }}" class="block px-3 py-2 text-sm text-gray-600 dark:text-gray-400 hover:bg-gray-50 dark:hover:bg-gray-700 hover:text-red-600 dark:hover:text-red-400 rounded-lg transition-colors duration-150">
|
||||
{{ $child->title }}
|
||||
</a>
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
@else
|
||||
<!-- Single Mobile Menu Item -->
|
||||
<a href="{{ $item->url }}" class="block px-3 py-2 text-base font-medium text-gray-700 dark:text-gray-300 hover:bg-gray-50 dark:hover:bg-gray-700 rounded-lg transition-colors duration-150">
|
||||
{{ $item->title }}
|
||||
</a>
|
||||
@endif
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<!-- Spacer for fixed navigation -->
|
||||
<div class="h-20"></div>
|
||||
|
||||
@@ -0,0 +1,155 @@
|
||||
@extends('layouts.app')
|
||||
|
||||
@section('title', $page ? ($page->meta_title ?? $page->title) : 'Trunçgil Teknoloji')
|
||||
@section('description', $page ? ($page->meta_description ?? $page->excerpt) : 'Trunçgil Teknoloji - Yenilikçi Çözümler')
|
||||
|
||||
@section('content')
|
||||
|
||||
<!-- Hero Section -->
|
||||
<section class="relative overflow-hidden bg-gradient-to-br from-white via-red-50/30 to-orange-50/20 dark:from-gray-900 dark:via-gray-900 dark:to-gray-800 py-20 lg:py-32">
|
||||
<div class="absolute inset-0 overflow-hidden">
|
||||
<!-- Decorative Elements -->
|
||||
<div class="absolute -top-40 -right-40 w-80 h-80 bg-red-500/10 dark:bg-red-500/5 rounded-full blur-3xl"></div>
|
||||
<div class="absolute -bottom-40 -left-40 w-80 h-80 bg-orange-500/10 dark:bg-orange-500/5 rounded-full blur-3xl"></div>
|
||||
</div>
|
||||
|
||||
<div class="relative max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div class="grid grid-cols-1 lg:grid-cols-2 gap-12 items-center">
|
||||
<!-- Content -->
|
||||
<div class="text-center lg:text-left" data-aos="fade-right">
|
||||
@if($page)
|
||||
<h1 class="text-4xl md:text-5xl lg:text-6xl font-bold text-gray-900 dark:text-white mb-6 leading-tight">
|
||||
{{ $page->title }}
|
||||
</h1>
|
||||
@if($page->excerpt)
|
||||
<p class="text-lg md:text-xl text-gray-600 dark:text-gray-300 mb-8 leading-relaxed">
|
||||
{{ $page->excerpt }}
|
||||
</p>
|
||||
@endif
|
||||
@else
|
||||
<h1 class="text-4xl md:text-5xl lg:text-6xl font-bold text-gray-900 dark:text-white mb-6 leading-tight">
|
||||
Hoş Geldiniz
|
||||
<span class="block text-transparent bg-clip-text bg-gradient-to-r from-red-600 to-orange-500">
|
||||
Trunçgil Teknoloji
|
||||
</span>
|
||||
</h1>
|
||||
<p class="text-lg md:text-xl text-gray-600 dark:text-gray-300 mb-8 leading-relaxed">
|
||||
Yenilikçi teknoloji çözümleri ile geleceği şekillendiriyoruz
|
||||
</p>
|
||||
@endif
|
||||
|
||||
<div class="flex flex-col sm:flex-row gap-4 justify-center lg:justify-start">
|
||||
<a href="#hakkimizda" class="inline-flex items-center justify-center px-8 py-3 bg-red-600 hover:bg-red-700 text-white font-semibold rounded-lg shadow-lg hover:shadow-xl transition-all duration-300 transform hover:-translate-y-0.5">
|
||||
Keşfet
|
||||
<svg class="w-5 h-5 ml-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 8l4 4m0 0l-4 4m4-4H3"></path>
|
||||
</svg>
|
||||
</a>
|
||||
<a href="#iletisim" class="inline-flex items-center justify-center px-8 py-3 bg-white dark:bg-gray-800 text-gray-900 dark:text-white font-semibold rounded-lg shadow-lg hover:shadow-xl transition-all duration-300 transform hover:-translate-y-0.5 border-2 border-gray-200 dark:border-gray-700">
|
||||
İletişime Geç
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Image/Logo -->
|
||||
<div class="flex justify-center lg:justify-end" data-aos="fade-left">
|
||||
<div class="relative">
|
||||
<div class="absolute inset-0 bg-gradient-to-tr from-red-500/20 to-orange-500/20 rounded-2xl blur-2xl"></div>
|
||||
<img src="{{ asset('logos/truncgil-dikey.svg') }}" alt="Trunçgil Teknoloji" class="relative h-64 md:h-80 lg:h-96 w-auto drop-shadow-2xl dark:hidden">
|
||||
<img src="{{ asset('logos/truncgil-dikey-dark.svg') }}" alt="Trunçgil Teknoloji" class="relative h-64 md:h-80 lg:h-96 w-auto drop-shadow-2xl hidden dark:block">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
@if($page && $page->content)
|
||||
<!-- Page Content -->
|
||||
<section class="py-16 lg:py-24 bg-white dark:bg-gray-900">
|
||||
<div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div class="prose prose-lg dark:prose-invert max-w-none prose-headings:text-gray-900 dark:prose-headings:text-white prose-p:text-gray-600 dark:prose-p:text-gray-300 prose-a:text-red-600 dark:prose-a:text-red-400">
|
||||
{!! $page->content !!}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
@endif
|
||||
|
||||
<!-- Features Section -->
|
||||
<section id="hakkimizda" class="py-16 lg:py-24 bg-gray-50 dark:bg-gray-800">
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div class="text-center mb-16" data-aos="fade-up">
|
||||
<h2 class="text-3xl md:text-4xl font-bold text-gray-900 dark:text-white mb-4">
|
||||
Neden Trunçgil Teknoloji?
|
||||
</h2>
|
||||
<p class="text-lg text-gray-600 dark:text-gray-300 max-w-2xl mx-auto">
|
||||
Modern teknolojiler ve uzman ekibimizle projelerinizi hayata geçiriyoruz
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
|
||||
<!-- Feature 1 -->
|
||||
<div class="bg-white dark:bg-gray-900 rounded-xl p-8 shadow-lg hover:shadow-xl transition-all duration-300 transform hover:-translate-y-1" data-aos="fade-up" data-aos-delay="100">
|
||||
<div class="w-14 h-14 bg-red-100 dark:bg-red-900/30 rounded-lg flex items-center justify-center mb-6">
|
||||
<svg class="w-7 h-7 text-red-600 dark:text-red-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z"></path>
|
||||
</svg>
|
||||
</div>
|
||||
<h3 class="text-xl font-bold text-gray-900 dark:text-white mb-3">
|
||||
Hızlı Çözümler
|
||||
</h3>
|
||||
<p class="text-gray-600 dark:text-gray-300">
|
||||
Modern teknolojiler kullanarak projelerinizi hızlı ve verimli bir şekilde hayata geçiriyoruz.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Feature 2 -->
|
||||
<div class="bg-white dark:bg-gray-900 rounded-xl p-8 shadow-lg hover:shadow-xl transition-all duration-300 transform hover:-translate-y-1" data-aos="fade-up" data-aos-delay="200">
|
||||
<div class="w-14 h-14 bg-orange-100 dark:bg-orange-900/30 rounded-lg flex items-center justify-center mb-6">
|
||||
<svg class="w-7 h-7 text-orange-600 dark:text-orange-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z"></path>
|
||||
</svg>
|
||||
</div>
|
||||
<h3 class="text-xl font-bold text-gray-900 dark:text-white mb-3">
|
||||
Güvenli Altyapı
|
||||
</h3>
|
||||
<p class="text-gray-600 dark:text-gray-300">
|
||||
En son güvenlik standartlarını kullanarak verilerinizi koruma altına alıyoruz.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Feature 3 -->
|
||||
<div class="bg-white dark:bg-gray-900 rounded-xl p-8 shadow-lg hover:shadow-xl transition-all duration-300 transform hover:-translate-y-1" data-aos="fade-up" data-aos-delay="300">
|
||||
<div class="w-14 h-14 bg-blue-100 dark:bg-blue-900/30 rounded-lg flex items-center justify-center mb-6">
|
||||
<svg class="w-7 h-7 text-blue-600 dark:text-blue-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0zm6 3a2 2 0 11-4 0 2 2 0 014 0zM7 10a2 2 0 11-4 0 2 2 0 014 0z"></path>
|
||||
</svg>
|
||||
</div>
|
||||
<h3 class="text-xl font-bold text-gray-900 dark:text-white mb-3">
|
||||
Uzman Ekip
|
||||
</h3>
|
||||
<p class="text-gray-600 dark:text-gray-300">
|
||||
Deneyimli ve uzman ekibimiz ile her zaman yanınızdayız.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- CTA Section -->
|
||||
<section id="iletisim" class="py-16 lg:py-24 bg-gradient-to-br from-red-600 to-orange-600 dark:from-red-700 dark:to-orange-700">
|
||||
<div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center" data-aos="zoom-in">
|
||||
<h2 class="text-3xl md:text-4xl font-bold text-white mb-6">
|
||||
Projenizi Konuşalım
|
||||
</h2>
|
||||
<p class="text-lg text-white/90 mb-8 max-w-2xl mx-auto">
|
||||
Size özel çözümler geliştirmek için iletişime geçin
|
||||
</p>
|
||||
<a href="mailto:info@truncgil.com" class="inline-flex items-center justify-center px-8 py-3 bg-white text-red-600 font-semibold rounded-lg shadow-lg hover:shadow-xl transition-all duration-300 transform hover:-translate-y-0.5">
|
||||
İletişime Geç
|
||||
<svg class="w-5 h-5 ml-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<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"></path>
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
</section>
|
||||
@endsection
|
||||
@@ -0,0 +1,35 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}" x-data="{ darkMode: localStorage.getItem('darkMode') === 'true' }" x-init="$watch('darkMode', val => localStorage.setItem('darkMode', val))" :class="{ 'dark': darkMode }">
|
||||
<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', 'Trunçgil Teknoloji'))</title>
|
||||
<meta name="description" content="@yield('description', 'Trunçgil Teknoloji - Yenilikçi Çözümler')">
|
||||
|
||||
<!-- Fonts -->
|
||||
<link rel="preconnect" href="https://fonts.bunny.net">
|
||||
<link href="https://fonts.bunny.net/css?family=inter:300,400,500,600,700,800,900" rel="stylesheet" />
|
||||
|
||||
<!-- Styles / Scripts -->
|
||||
@vite(['resources/css/app.css', 'resources/js/app.js'])
|
||||
|
||||
<!-- Alpine.js for interactions -->
|
||||
<script defer src="https://cdn.jsdelivr.net/npm/alpinejs@3.x.x/dist/cdn.min.js"></script>
|
||||
</head>
|
||||
<body class="font-sans antialiased bg-white dark:bg-gray-900 text-gray-900 dark:text-gray-100 transition-colors duration-300">
|
||||
|
||||
<!-- Navigation -->
|
||||
@include('components.navigation')
|
||||
|
||||
<!-- Page Content -->
|
||||
<main>
|
||||
@yield('content')
|
||||
</main>
|
||||
|
||||
<!-- Footer -->
|
||||
@include('components.footer')
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,103 @@
|
||||
@extends('layouts.app')
|
||||
|
||||
@section('title', $page->meta_title ?? $page->title)
|
||||
@section('description', $page->meta_description ?? $page->excerpt ?? '')
|
||||
|
||||
@section('content')
|
||||
|
||||
<!-- Page Header -->
|
||||
<section class="relative overflow-hidden bg-gradient-to-br from-white via-red-50/30 to-orange-50/20 dark:from-gray-900 dark:via-gray-900 dark:to-gray-800 py-16 lg:py-24">
|
||||
<div class="absolute inset-0 overflow-hidden">
|
||||
<div class="absolute -top-40 -right-40 w-80 h-80 bg-red-500/10 dark:bg-red-500/5 rounded-full blur-3xl"></div>
|
||||
<div class="absolute -bottom-40 -left-40 w-80 h-80 bg-orange-500/10 dark:bg-orange-500/5 rounded-full blur-3xl"></div>
|
||||
</div>
|
||||
|
||||
<div class="relative max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div class="max-w-4xl mx-auto text-center">
|
||||
<h1 class="text-4xl md:text-5xl lg:text-6xl font-bold text-gray-900 dark:text-white mb-6 leading-tight">
|
||||
{{ $page->title }}
|
||||
</h1>
|
||||
|
||||
@if($page->excerpt)
|
||||
<p class="text-lg md:text-xl text-gray-600 dark:text-gray-300 leading-relaxed">
|
||||
{{ $page->excerpt }}
|
||||
</p>
|
||||
@endif
|
||||
|
||||
@if($page->published_at)
|
||||
<div class="mt-6 flex items-center justify-center text-sm text-gray-500 dark:text-gray-400">
|
||||
<svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z"></path>
|
||||
</svg>
|
||||
{{ $page->published_at->format('d M Y') }}
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Page Content -->
|
||||
<section class="py-16 lg:py-24 bg-white dark:bg-gray-900">
|
||||
<div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
@if($page->featured_image)
|
||||
<div class="mb-12 rounded-xl overflow-hidden shadow-xl">
|
||||
<img src="{{ $page->featured_image_url }}" alt="{{ $page->title }}" class="w-full h-auto">
|
||||
</div>
|
||||
@endif
|
||||
|
||||
<div class="prose prose-lg dark:prose-invert max-w-none
|
||||
prose-headings:text-gray-900 dark:prose-headings:text-white
|
||||
prose-p:text-gray-600 dark:prose-p:text-gray-300
|
||||
prose-a:text-red-600 dark:prose-a:text-red-400 hover:prose-a:text-red-700 dark:hover:prose-a:text-red-300
|
||||
prose-strong:text-gray-900 dark:prose-strong:text-white
|
||||
prose-code:text-red-600 dark:prose-code:text-red-400
|
||||
prose-pre:bg-gray-100 dark:prose-pre:bg-gray-800
|
||||
prose-blockquote:border-red-500 dark:prose-blockquote:border-red-400
|
||||
prose-img:rounded-xl prose-img:shadow-lg">
|
||||
{!! $page->content !!}
|
||||
</div>
|
||||
|
||||
<!-- Child Pages -->
|
||||
@if($page->children->where('status', 'published')->count() > 0)
|
||||
<div class="mt-16 pt-16 border-t border-gray-200 dark:border-gray-700">
|
||||
<h2 class="text-2xl font-bold text-gray-900 dark:text-white mb-8">
|
||||
İlgili Sayfalar
|
||||
</h2>
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||||
@foreach($page->children->where('status', 'published')->sortBy('sort_order') as $child)
|
||||
<a href="{{ $child->url }}" class="group block p-6 bg-gray-50 dark:bg-gray-800 rounded-lg hover:shadow-lg transition-all duration-300 transform hover:-translate-y-1">
|
||||
<h3 class="text-lg font-semibold text-gray-900 dark:text-white mb-2 group-hover:text-red-600 dark:group-hover:text-red-400 transition-colors">
|
||||
{{ $child->title }}
|
||||
</h3>
|
||||
@if($child->excerpt)
|
||||
<p class="text-gray-600 dark:text-gray-300 text-sm line-clamp-2">
|
||||
{{ $child->excerpt }}
|
||||
</p>
|
||||
@endif
|
||||
</a>
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
|
||||
<!-- Navigation Buttons -->
|
||||
<div class="mt-12 pt-8 border-t border-gray-200 dark:border-gray-700 flex justify-between items-center">
|
||||
<a href="{{ route('home') }}" class="inline-flex items-center text-red-600 dark:text-red-400 hover:text-red-700 dark:hover:text-red-300 transition-colors">
|
||||
<svg class="w-5 h-5 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 19l-7-7m0 0l7-7m-7 7h18"></path>
|
||||
</svg>
|
||||
Ana Sayfaya Dön
|
||||
</a>
|
||||
|
||||
@if($page->parent)
|
||||
<a href="{{ $page->parent->url }}" class="inline-flex items-center text-gray-600 dark:text-gray-400 hover:text-red-600 dark:hover:text-red-400 transition-colors">
|
||||
Üst Sayfa
|
||||
<svg class="w-5 h-5 ml-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 10l7-7m0 0l7 7m-7-7v18"></path>
|
||||
</svg>
|
||||
</a>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
@endsection
|
||||
Reference in New Issue
Block a user