refactor: reorganize finance page layout by swapping rates and logo columns

This commit is contained in:
Ümit Tunç
2026-05-26 23:27:04 +03:00
parent 01a708b054
commit fe3d88c467
@@ -26,18 +26,11 @@
after:bottom-[-4rem] after:content-[''] after:block after:absolute after:z-0 after:border-l-[100vw] after:border-r-transparent after:border-b-[4rem] after:border-y-transparent after:border-[#262b32] after:border-0 after:border-solid after:right-0">
<div class="container pt-7 xl:pt-12 lg:pt-12 md:pt-12 pb-8 relative z-10">
{{-- Top Row: Logo (No borders, transparent bg, centered/left at the very top) --}}
<div class="w-full text-left !mb-10">
<a href="https://finance.truncgil.com/" target="_blank" class="inline-block transition-transform duration-300 hover:scale-105">
<img src="{{ asset('assets/img/finance-logo.svg') }}" alt="Trunçgil Finance Logo" class="h-16 w-auto" style="max-height: 64px;">
</a>
</div>
{{-- Main Row: Text & Rates Side-by-Side --}}
{{-- Main Row: Rates on the Left, Logo on the Right --}}
<div class="flex flex-wrap mx-0 !mt-[-30px] items-center">
{{-- Left Column: Headline and Descriptions --}}
<div class="lg:w-5/12 xl:w-5/12 w-full flex-[0_0_auto] max-w-full px-0 !mt-[30px] lg:!pr-8">
{{-- Left Column: Live Rates Cards & Descriptions --}}
<div class="lg:w-7/12 xl:w-7/12 w-full flex-[0_0_auto] max-w-full px-0 !mt-[30px] lg:!pr-8">
<h1 class="!text-[calc(1.375rem_+_1.5vw)] font-bold !leading-[1.15] xl:!text-[2.3rem] !text-white !mb-4">
{!! t('Trunçgil Finance ile') !!} <br>
<span class="typer !text-[#009846] whitespace-nowrap" data-delay="100" data-words="{{ t('anlık döviz kurlarına,canlı altın fiyatlarına,kripto para verilerine') }}"></span>
@@ -46,19 +39,8 @@
<p class="lead !text-[1.1rem] !leading-[1.5] !text-white !mb-7">
{!! t('Gecikmesiz, anlık ve yüksek frekanslı tüm finansal piyasa verilerini tek bir JSON/RESTful API uç noktasından saniyeler içinde sistemlerinize entegre edin.') !!}
</p>
<div>
<a href="https://finance.truncgil.com/docs" target="_blank" class="btn btn-green !text-white !bg-[#009846] border-[#009846] hover:text-white hover:bg-[#007f3a] hover:!border-[#007f3a] focus:shadow-[rgba(0,152,70,0.5)] active:!text-white active:bg-[#007f3a] active:border-[#007f3a] disabled:bg-[#009846] disabled:border-[#009846] rounded mr-3">
{!! t('Dokümantasyon') !!}
</a>
<a href="{{ route('page.show', ['slug' => 'iletisim']) }}" class="btn btn-outline-white text-white border-white hover:bg-white hover:text-[#262b32] rounded">
{!! t('Teklif Alın') !!}
</a>
</div>
</div>
{{-- Right Column: Live Rates Cards Side-by-Side --}}
<div class="lg:w-7/12 xl:w-7/12 w-full flex-[0_0_auto] max-w-full px-0 !mt-[30px]">
<div class="w-full p-4 rounded-2xl bg-[rgba(255,255,255,0.03)] border border-[rgba(255,255,255,0.06)]" style="backdrop-filter: blur(15px);">
<div class="w-full p-4 rounded-2xl bg-[rgba(255,255,255,0.03)] border border-[rgba(255,255,255,0.06)] !mb-7" style="backdrop-filter: blur(15px);">
<div class="flex items-center gap-2 mb-3 px-1">
<span class="w-2 h-2 rounded-full bg-[#00e676] animate-pulse"></span>
<span class="text-[#cacaca] text-[0.75rem] font-bold tracking-wider uppercase">{!! t('Canlı Piyasalar') !!}</span>
@@ -135,6 +117,22 @@
</div>
</div>
<div>
<a href="https://finance.truncgil.com/docs" target="_blank" class="btn btn-green !text-white !bg-[#009846] border-[#009846] hover:text-white hover:bg-[#007f3a] hover:!border-[#007f3a] focus:shadow-[rgba(0,152,70,0.5)] active:!text-white active:bg-[#007f3a] active:border-[#007f3a] disabled:bg-[#009846] disabled:border-[#009846] rounded mr-3">
{!! t('Dokümantasyon') !!}
</a>
<a href="{{ route('page.show', ['slug' => 'iletisim']) }}" class="btn btn-outline-white text-white border-white hover:bg-white hover:text-[#262b32] rounded">
{!! t('Teklif Alın') !!}
</a>
</div>
</div>
{{-- Right Column: Logo (No borders, transparent bg, centered cleanly) --}}
<div class="lg:w-5/12 xl:w-5/12 w-full flex-[0_0_auto] max-w-full px-0 !mt-[30px] flex justify-center lg:justify-end">
<a href="https://finance.truncgil.com/" target="_blank" class="inline-block transition-transform duration-300 hover:scale-105">
<img src="{{ asset('assets/img/finance-logo.svg') }}" alt="Trunçgil Finance Logo" class="w-full h-auto" style="max-width: 320px;">
</a>
</div>
</div>