Ümit Tunç
93 lines
4.9 KiB
PHP
93 lines
4.9 KiB
PHP
|
||
@extends('layouts.site', ['headerTemplate' => 'Demo27 Header'])
|
||
|
||
@php
|
||
use Illuminate\Support\Facades\Storage;
|
||
@endphp
|
||
|
||
@section('title', $product->translate('title') ?? 'Ürün Detayı')
|
||
@section('meta_description', Str::limit(strip_tags($product->translate('content')), 160))
|
||
@php
|
||
$landingData = $product->landing_page_data ?? [];
|
||
$hero = $landingData['hero'] ?? [];
|
||
|
||
// Fallback if hero data is empty
|
||
if (empty($hero['slogan']) && empty($hero['sub_slogan']) && empty($hero['featured_image'])) {
|
||
$hero['slogan'] = $product->translate('title');
|
||
$hero['sub_slogan'] = Str::limit(strip_tags($product->translate('content')), 160);
|
||
$hero['featured_image'] = $product->hero_image;
|
||
}
|
||
|
||
$currentLang = app()->getLocale();
|
||
|
||
// Helper function to get translated value with fallback
|
||
$getTranslated = function($item, $key, $default = '') use ($currentLang) {
|
||
if (isset($item["{$key}_{$currentLang}"])) {
|
||
return $item["{$key}_{$currentLang}"];
|
||
}
|
||
return $item[$key] ?? $default;
|
||
};
|
||
@endphp
|
||
|
||
@section('content')
|
||
{{-- Hero Section --}}
|
||
@if(!empty($hero))
|
||
<section class="wrapper image-wrapper bg-full bg-image bg-overlay bg-overlay-light-600 [background-size:100%] bg-[center_center] bg-no-repeat bg-scroll relative z-0 before:content-[''] before:block before:absolute before:z-[1] before:w-full before:h-full before:left-0 before:top-0 before:bg-[rgba(255,255,255,.6)]" data-image-src="{{ !empty($hero['background_image']) ? asset($hero['background_image']) : asset('assets/img/photos/bg23.webp') }}">
|
||
<div class="container pt-24 xl:pt-32 lg:pt-32 md:pt-32 pb-9">
|
||
<div class="flex flex-wrap mx-0 !mt-[-50px] items-center text-center lg:text-left xl:text-left">
|
||
<div class="xl:w-5/12 lg:w-5/12 xxl:w-4/12 w-full flex-[0_0_auto] max-w-full !relative !mt-[50px]" data-cues="slideInDown" data-group="page-title" data-delay="700">
|
||
@if($slogan = $getTranslated($hero, 'slogan'))
|
||
<h1 class="xl:!text-[2.5rem] !text-[calc(1.375rem_+_1.5vw)] font-semibold !leading-[1.15] !mb-4">
|
||
{!! nl2br(e($slogan)) !!}
|
||
</h1>
|
||
@endif
|
||
@if($subSlogan = $getTranslated($hero, 'sub_slogan'))
|
||
<p class="lead !text-[1.2rem] !leading-[1.5] !font-normal !mb-7">{{ $subSlogan }}</p>
|
||
@endif
|
||
<div class="flex justify-center lg:!justify-start xl:!justify-start" data-cues="slideInDown" data-group="page-title-buttons" data-delay="1800">
|
||
@if(!empty($hero['app_store_link']))
|
||
<span class="inline-flex"><a href="{{ $hero['app_store_link'] }}" target="_blank" class="!mr-2 field">
|
||
<img src="{{ asset('assets/img/photos/button-appstore.svg') }}" class="!h-[3rem] !rounded-[0.8rem]" alt="App Store" loading="lazy">
|
||
</a></span>
|
||
@endif
|
||
@if(!empty($hero['google_play_link']))
|
||
<span class="inline-flex"><a href="{{ $hero['google_play_link'] }}" target="_blank" class="inline-block">
|
||
<img src="{{ asset('assets/img/photos/button-google-play.svg') }}" class="!h-[3rem] !rounded-[0.8rem]" alt="Google Play" loading="lazy">
|
||
</a></span>
|
||
@endif
|
||
</div>
|
||
</div>
|
||
<!-- /column -->
|
||
@if(!empty($hero['featured_image']))
|
||
<div class="xl:w-7/12 lg:w-7/12 w-full flex-[0_0_auto] max-w-full !ml-auto !mb-[-10rem] xxl:!mb-[-15rem] !mt-[50px] flex justify-center items-center" data-cues="slideInDown" data-delay="600" style="z-index:2;">
|
||
<figure class="m-0 p-0 w-full flex justify-center items-center">
|
||
<img class="w-[95%] max-w-[850px] !h-auto xl:!max-h-[540px] lg:!max-h-[440px] object-contain drop-shadow-2xl rounded-xl"
|
||
src="{{ Storage::url($hero['featured_image']) }}"
|
||
alt="{{ $product->translate('title') }}" loading="lazy"
|
||
|
||
>
|
||
</figure>
|
||
</div>
|
||
<!-- /column -->
|
||
@endif
|
||
</div>
|
||
<!-- /.row -->
|
||
</div>
|
||
<!-- /.container -->
|
||
<div class="overflow-hidden" style="z-index:1;">
|
||
<div class="divider !text-[#fefefe] mx-[-0.5rem]">
|
||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 100">
|
||
<g fill="currentColor">
|
||
<polygon points="1440 100 0 100 0 85 1440 0 1440 100" />
|
||
</g>
|
||
</svg>
|
||
</div>
|
||
</div>
|
||
<!-- /.overflow-hidden -->
|
||
</section>
|
||
<!-- /section -->
|
||
@endif
|
||
|
||
@endsection
|
||
|