feat: add dynamic scroll-based resizing for academy logo in header

This commit is contained in:
Ümit Tunç
2026-05-26 21:27:18 +03:00
parent f2b5a29b15
commit 4e98034536
@@ -1,16 +1,40 @@
{{-- demo1.html: center-nav, !bg-[#fff8ee], #fab758 vurgu --}}
<style>
.akademi-logo {
transition: height 0.3s ease, max-height 0.3s ease;
}
@media (min-width: 992px) {
/* Scroll en üstteyken (fixed yokken) */
.navbar:not(.fixed) .akademi-logo {
height: 100px !important;
max-height: 100px !important;
}
/* Scroll edildiğinde (fixed varken) */
.navbar.fixed .akademi-logo {
height: 50px !important;
max-height: 50px !important;
}
}
@media (max-width: 991.98px) {
/* Mobil */
.akademi-logo {
height: 40px !important;
max-height: 40px !important;
}
}
</style>
<header class="relative wrapper !bg-[#fff8ee]">
<nav class="navbar navbar-expand-lg center-nav transparent navbar-light">
<div class="container xl:!flex-row lg:!flex-row !flex-nowrap items-center">
<div class="navbar-brand w-full">
<a href="{{ url('/') }}">
<img src="{{ asset('logos/akademi-logo.svg') }}" alt="Trunçgil Akademi" style="height: 50px; max-height: 50px;" fetchpriority="high" decoding="async">
<img class="akademi-logo" src="{{ asset('logos/akademi-logo.svg') }}" alt="Trunçgil Akademi" fetchpriority="high" decoding="async">
</a>
</div>
<div class="navbar-collapse offcanvas offcanvas-nav offcanvas-start">
<div class="offcanvas-header xl:!hidden lg:!hidden flex items-center justify-between flex-row p-6">
<a href="{{ url('/') }}">
<img style="height: 40px; max-height: 40px;" src="{{ asset('logos/akademi-logo.svg') }}" alt="Trunçgil Akademi" decoding="async">
<img class="akademi-logo" src="{{ asset('logos/akademi-logo.svg') }}" alt="Trunçgil Akademi" decoding="async">
</a>
<button type="button" class="btn-close" data-bs-dismiss="offcanvas" aria-label="{{ __('Close') }}"></button>
</div>