truncgit/citrus
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: kariyer formu, mobil offcanvas menu ve blog modulu iyilestirmeleri

Browse Source
This commit is contained in:
Muhammet Güler
2026-03-10 18:50:23 +03:00
parent f4f601a492
commit 4924cb0dc8
25 changed files with 1220 additions and 182 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/views/partials/header.blade.php
+87 -17
View File
@@ -29,13 +29,13 @@ $isHomepage = $currentRoute === 'homepage' || $currentPath === '/' || request()-
<!-- Mobile Header -->
<div class="flex flex-row w-full justify-between items-center xl:!hidden lg:!hidden">
<div class="navbar-brand"><a href="/">
<img class="logo-dark" src="{{ asset('assets/img/truncgil-yatay.svg') }}" alt="image" loading="lazy">
<img class="logo-light" src="{{ asset('assets/img/truncgil-yatay-dark.svg') }}" alt="image" loading="lazy">
<img class="logo-dark" src="{{ asset('assets/img/truncgil-yatay.svg') }}" alt="Truncgil" fetchpriority="high" decoding="async">
<img class="logo-light" src="{{ asset('assets/img/truncgil-yatay-dark.svg') }}" alt="Truncgil" fetchpriority="high" decoding="async">
</a></div>
<div class="navbar-other !ml-auto">
<ul class="navbar-nav flex-row items-center">
<li class="nav-item xl:!hidden lg:!hidden">
<button class="hamburger offcanvas-nav-btn"><span></span></button>
<li class="nav-item">
<button class="hamburger offcanvas-nav-btn" data-bs-toggle="offcanvas" data-bs-target="#offcanvas-nav"><span></span></button>
</li>
</ul>
</div>
@@ -45,10 +45,12 @@ $isHomepage = $currentRoute === 'homepage' || $currentPath === '/' || request()-
@if($isHomepage)
<!-- Homepage Layout (Center Logo) -->
<div class="navbar-collapse-wrapper flex flex-row items-center w-full">
<div class="navbar-collapse offcanvas offcanvas-nav offcanvas-start">
<div id="offcanvas-nav" class="navbar-collapse offcanvas offcanvas-nav offcanvas-start">
<div class="offcanvas-header lg:mx-auto xl:mx-auto order-0 lg:!order-1 lg:!px-[5rem] xl:!order-1 xl:!px-[5rem] p-[1.5rem] !flex items-center justify-between flex-row">
<a class="transition-none hidden lg:!flex xl:!flex" href="/"><img class="logo-dark" src="{{ asset('assets/img/truncgil-yatay.svg') }}" alt="image" loading="lazy">
<img class="logo-light" src="{{ asset('assets/img/truncgil-yatay-dark.svg') }}" alt="image" loading="lazy"></a>
<a class="transition-none hidden lg:!flex xl:!flex" href="/" onclick="trackEvent('logo_click', {location: 'header_center'})">
<img class="logo-dark" src="{{ asset('assets/img/truncgil-yatay.svg') }}" alt="Truncgil" fetchpriority="high" decoding="async">
<img class="logo-light" src="{{ asset('assets/img/truncgil-yatay-dark.svg') }}" alt="Truncgil" fetchpriority="high" decoding="async">
</a>
<div class="" style="position: relative; left:5px">
@include("components.custom.language-selector")
</div>
@@ -91,12 +93,12 @@ $isHomepage = $currentRoute === 'homepage' || $currentPath === '/' || request()-
<!-- Logo on Left -->
<div class="navbar-brand">
<a href="/">
<img class="!h-[2.5rem]" src="{{ asset('assets/img/truncgil-yatay.svg') }}" alt="Truncgil Teknoloji" loading="lazy">
<img class="!h-[2.5rem]" src="{{ asset('assets/img/truncgil-yatay.svg') }}" alt="Truncgil Teknoloji" fetchpriority="high" decoding="async">
</a>
</div>
<!-- Menu in Center -->
<div class="navbar-collapse offcanvas offcanvas-nav offcanvas-start">
<!-- Menu in Center (Desktop) -->
<div class="navbar-collapse">
<div class="offcanvas-body flex justify-center">
<ul class="navbar-nav flex-row items-center gap-1">
@foreach($menuItems as $item)
@@ -111,27 +113,27 @@ $isHomepage = $currentRoute === 'homepage' || $currentPath === '/' || request()-
<nav class="nav social flex items-center gap-2">
<?php $social_media = json_decode(setting('social_links'), true); ?>
@if(!empty($social_media['Twitter']))
<a class="!text-[#5daed5] hover:!text-[#3b9ec9] text-[1.1rem] transition-colors" href="{{ $social_media['Twitter'] }}" target="_blank" rel="noopener">
<a class="!text-[#5daed5] hover:!text-[#3b9ec9] text-[1.1rem] transition-colors" href="{{ $social_media['Twitter'] }}" target="_blank" rel="noopener" onclick="trackEvent('social_click', {platform: 'twitter'})">
<i class="uil uil-twitter"></i>
</a>
@endif
@if(!empty($social_media['Facebook']))
<a class="!text-[#4470cf] hover:!text-[#3259b8] text-[1.1rem] transition-colors" href="{{ $social_media['Facebook'] }}" target="_blank" rel="noopener">
<a class="!text-[#4470cf] hover:!text-[#3259b8] text-[1.1rem] transition-colors" href="{{ $social_media['Facebook'] }}" target="_blank" rel="noopener" onclick="trackEvent('social_click', {platform: 'facebook'})">
<i class="uil uil-facebook-f"></i>
</a>
@endif
@if(!empty($social_media['Github']))
<a class="!text-[#343a40] hover:!text-[#23272b] text-[1.1rem] transition-colors" href="{{ $social_media['Github'] }}" target="_blank" rel="noopener">
<a class="!text-[#343a40] hover:!text-[#23272b] text-[1.1rem] transition-colors" href="{{ $social_media['Github'] }}" target="_blank" rel="noopener" onclick="trackEvent('social_click', {platform: 'github'})">
<i class="uil uil-github"></i>
</a>
@endif
@if(!empty($social_media['Instagram']))
<a class="!text-[#d53581] hover:!text-[#c12570] text-[1.1rem] transition-colors" href="{{ $social_media['Instagram'] }}" target="_blank" rel="noopener">
<a class="!text-[#d53581] hover:!text-[#c12570] text-[1.1rem] transition-colors" href="{{ $social_media['Instagram'] }}" target="_blank" rel="noopener" onclick="trackEvent('social_click', {platform: 'instagram'})">
<i class="uil uil-instagram"></i>
</a>
@endif
@if(!empty($social_media['Youtube']))
<a class="!text-[#c8312b] hover:!text-[#b02822] text-[1.1rem] transition-colors" href="{{ $social_media['Youtube'] }}" target="_blank" rel="noopener">
<a class="!text-[#c8312b] hover:!text-[#b02822] text-[1.1rem] transition-colors" href="{{ $social_media['Youtube'] }}" target="_blank" rel="noopener" onclick="trackEvent('social_click', {platform: 'youtube'})">
<i class="uil uil-youtube"></i>
</a>
@endif
@@ -141,7 +143,17 @@ $isHomepage = $currentRoute === 'homepage' || $currentPath === '/' || request()-
</div>
<!-- Mobile Menu for Non-Homepage -->
<div class="navbar-collapse offcanvas offcanvas-nav offcanvas-start lg:!hidden xl:!hidden">
<div id="offcanvas-nav" class="navbar-collapse offcanvas offcanvas-nav offcanvas-start lg:!hidden xl:!hidden">
<div class="offcanvas-header flex items-center justify-between flex-row p-6">
<a href="/">
{{-- Mobile menu is dark, so we only need the light (white) logo here --}}
<img class="!h-[2.2rem]" src="{{ asset('assets/img/truncgil-yatay-dark.svg') }}" alt="Truncgil" fetchpriority="high" decoding="async">
</a>
<div class="flex items-center">
@include("components.custom.language-selector")
<button type="button" class="btn-close !text-white" data-bs-dismiss="offcanvas" aria-label="Close"></button>
</div>
</div>
<div class="offcanvas-body">
<ul class="navbar-nav">
@foreach($menuItems as $item)
@@ -169,4 +181,62 @@ $isHomepage = $currentRoute === 'homepage' || $currentPath === '/' || request()-
@endif
</div>
</nav>
</header>
</header>
@push('styles')
<style>
/* Logo Visibility Fix */
.logo-dark, .logo-light { display: none !important; }
.navbar-light .logo-dark, .navbar-dark .logo-light { display: block !important; }
/* Inside the offcanvas (mobile menu), we only want the light logo */
.offcanvas .logo-dark { display: none !important; }
.offcanvas .logo-light { display: block !important; }
/* Smoother Offcanvas Menu Transition */
.offcanvas {
transition: transform 0.4s cubic-bezier(0.77, 0.2, 0.05, 1.0) !important;
}
.offcanvas-backdrop {
transition: opacity 0.4s ease !important;
}
/* Fluid Hamburger Animation */
.hamburger {
transition: all 0.3s ease-in-out;
}
.hamburger span,
.hamburger::before,
.hamburger::after {
transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55) !important;
}
.hamburger.is-active span {
background-color: transparent !important;
}
.hamburger.is-active::before {
transform: translateY(6px) rotate(45deg) !important;
}
.hamburger.is-active::after {
transform: translateY(-6px) rotate(-45deg) !important;
}
</style>
@endpush
@push('scripts')
<script>
document.addEventListener('DOMContentLoaded', function() {
var offcanvases = document.querySelectorAll('.offcanvas-nav');
var hamburgers = document.querySelectorAll('.hamburger.offcanvas-nav-btn');
if (offcanvases.length > 0 && hamburgers.length > 0) {
offcanvases.forEach(function(oc) {
oc.addEventListener('show.bs.offcanvas', function () {
hamburgers.forEach(function(h) { h.classList.add('is-active'); });
});
oc.addEventListener('hide.bs.offcanvas', function () {
hamburgers.forEach(function(h) { h.classList.remove('is-active'); });
});
});
}
});
</script>
@endpush