feat: update company history module with new hero section, enhanced localization support, and improved layout for better user experience

This commit is contained in:
Ümit Tunç
2026-05-21 19:36:28 +03:00
parent c82dd5c6b6
commit 4150931ac8
6 changed files with 94 additions and 32 deletions
+1 -1
View File
@@ -66,7 +66,7 @@ class PageSeeder extends Seeder
'author_id' => $author->id,
'parent_id' => $corporate->id,
'title' => 'Hakkımızda',
'excerpt' => 'Biz kimiz?',
'excerpt' => 'Trunçgil Teknoloji olarak yazılım, e-ticaret, sağlık teknolojileri ve eğitim alanlarında kalite odaklı, uzun vadeli çözümler sunuyoruz.',
'content' => '<p>Trunçgil Teknoloji olarak 2014 yılından bu yana yazılım, e-ticaret, sağlık teknolojileri ve eğitim alanlarında yenilikçi çözümler üretiyoruz.</p>',
'template' => 'hakkimizda',
'status' => 'published',
+7
View File
@@ -38,6 +38,13 @@ return [
'updated_successfully' => 'History item updated successfully.',
'deleted_successfully' => 'History item deleted successfully.',
'hero_title_before' => 'Your ',
'hero_highlight' => 'trusted',
'hero_title_after' => ' technology partner since 2014',
'hero_subtitle' => 'At Trunçgil Technology, we deliver quality-focused, long-term solutions in software, e-commerce, health tech, and education.',
'hero_cta' => 'Explore Our History',
'hero_illustration_alt' => 'Trunçgil Technology — digital solutions illustration',
'timeline_start' => 'START',
'timeline_finish' => 'TODAY',
'timeline_section_badge' => 'Our History',
+7
View File
@@ -38,6 +38,13 @@ return [
'updated_successfully' => 'Tarihçe öğesi başarıyla güncellendi.',
'deleted_successfully' => 'Tarihçe öğesi başarıyla silindi.',
'hero_title_before' => '2014\'ten bugüne teknoloji yolculuğumuzda ',
'hero_highlight' => 'güvenilir',
'hero_title_after' => ' iş ortağınız',
'hero_subtitle' => 'Trunçgil Teknoloji olarak yazılım, e-ticaret, sağlık teknolojileri ve eğitim alanlarında kalite odaklı, uzun vadeli çözümler sunuyoruz.',
'hero_cta' => 'Tarihçemizi Keşfet',
'hero_illustration_alt' => 'Trunçgil Teknoloji — dijital çözümler illüstrasyonu',
'timeline_start' => 'BAŞLANGIÇ',
'timeline_finish' => 'BUGÜN',
'timeline_section_badge' => 'Tarihçemiz',
@@ -0,0 +1,67 @@
@props([
'titleBefore' => null,
'highlight' => null,
'titleAfter' => null,
'subtitle' => null,
'ctaLabel' => null,
'ctaUrl' => '#company-history-timeline',
'illustration' => null,
])
@php
$titleBefore = $titleBefore ?? __('company_history.hero_title_before');
$highlight = $highlight ?? __('company_history.hero_highlight');
$titleAfter = $titleAfter ?? __('company_history.hero_title_after');
$subtitle = $subtitle ?? __('company_history.hero_subtitle');
$ctaLabel = $ctaLabel ?? __('company_history.hero_cta');
$illustration = $illustration ?? asset('assets/img/illustrations/i28.png');
$highlightClasses = "!relative z-[1] style-1 primary before:content-[''] before:z-[-1] before:absolute before:opacity-100 before:block before:-translate-x-2/4 before:-translate-y-2/4 before:-rotate-1 before:w-[111%] before:h-[110%] before:rounded-[80%] before:border-t-0 before:border-[3px] before:border-solid before:border-[#e31e24] before:left-2/4 before:!top-[52%] after:content-[''] after:z-[-1] after:absolute after:opacity-100 after:block after:[background-size:100%_100%] after:bg-no-repeat after:bg-bottom after:bottom-[-0.1em] after:-translate-x-2/4 after:-translate-y-2/4 after:-rotate-2 after:w-[107%] after:h-[111%] after:rounded-[80%] after:border-l-0 after:border-b-0 after:border-[3px] after:border-solid after:border-[#e31e24] after:left-2/4 after:top-[52%] max-xl:before:!hidden max-xl:after:!hidden max-lg:before:!hidden max-lg:after:!hidden max-md:before:!hidden max-md:after:!hidden max-sm:before:!hidden max-sm:after:!hidden";
@endphp
<section class="wrapper !bg-[#ffffff]">
<div class="container pt-12 xl:pt-16 lg:pt-16 md:pt-16 pb-36 xl:pb-28 lg:pb-28 md:pb-28 !text-center">
<div class="flex flex-wrap mx-[-15px]">
<div class="lg:w-9/12 xl:w-8/12 xxl:w-7/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto" data-cues="slideInDown" data-group="page-title" data-delay="500">
<h1 class="xl:!text-[3.2rem] !text-[calc(1.445rem_+_2.34vw)] font-bold !leading-[1.15] !tracking-[-0.03em] !mb-4 md:!px-8 lg:!px-0">
{{ $titleBefore }}
@if($highlight)
<span class="{{ $highlightClasses }}"><em>{{ $highlight }}</em></span>
@endif
{{ $titleAfter }}
</h1>
@if($subtitle)
<p class="lead !text-[1.2rem] !leading-[1.5] !mb-7 !text-[#60697b]">{{ $subtitle }}</p>
@endif
@if($ctaLabel)
<div>
<a
href="{{ $ctaUrl }}"
class="btn btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24] active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] rounded !mb-10 xxl:!mb-5"
>{{ $ctaLabel }}</a>
</div>
@endif
</div>
</div>
<div class="flex flex-wrap mx-[-15px]">
<div class="lg:w-10/12 xl:w-9/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !mt-[3rem] !mb-[-12.5rem] relative z-[3]">
<figure class="m-0 p-0">
<img
class="max-w-full h-auto"
src="{{ $illustration }}"
alt="{{ __('company_history.hero_illustration_alt') }}"
loading="lazy"
decoding="async"
>
</figure>
</div>
</div>
</div>
<div class="overflow-hidden">
<div class="divider !text-[#f4f6f8] mx-[-0.5rem]">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 70" aria-hidden="true">
<path fill="currentColor" d="M1440,70H0V45.16a5762.49,5762.49,0,0,1,1440,0Z" />
</svg>
</div>
</div>
</section>
@@ -14,7 +14,7 @@
@endphp
@if($historyItems->isNotEmpty())
<section class="company-history-timeline-section wrapper !bg-[#f4f6f8]">
<section class="company-history-timeline-section wrapper !bg-[#f4f6f8] !pt-8 xl:!pt-12 lg:!pt-12 md:!pt-12">
<div class="container py-20 xl:py-28 lg:py-28 md:py-28">
@if($showHeader)
<div class="flex flex-wrap mx-[-15px] !mb-14 !text-center">
+11 -30
View File
@@ -1,41 +1,22 @@
@extends('layouts.site', [
'header' => 'partials.header-demo31',
'header' => 'partials.header',
'footer' => 'partials.footer',
])
@section('content')
@php
$historyItems = \App\Models\CompanyHistoryItem::active()->ordered()->get();
$pageTitle = $page ? ($page->translate('title') ?: $page->title) : __('company_history.timeline_section_title');
$pageExcerpt = $page ? ($page->translate('excerpt') ?: $page->excerpt) : null;
$heroSubtitle = $page
? ($page->translate('excerpt') ?: $page->excerpt)
: null;
@endphp
<section class="wrapper !bg-[#ffffff]">
<div class="container pt-12 xl:pt-16 lg:pt-16 md:pt-16 pb-10 xl:pb-14 lg:pb-14 md:pb-14 !text-center">
<div class="flex flex-wrap mx-[-15px]">
<div class="lg:w-9/12 xl:w-8/12 xxl:w-7/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
<h1 class="xl:!text-[3.2rem] !text-[calc(1.445rem_+_2.34vw)] font-bold !leading-[1.15] !tracking-[-0.03em] !mb-4 md:!px-8 lg:!px-0">
{{ $pageTitle }}
</h1>
@if($pageExcerpt)
<p class="lead !text-[1.2rem] !leading-[1.5] !mb-0 !text-[#60697b]">
{{ $pageExcerpt }}
</p>
@endif
</div>
</div>
<x-company-history.hero
:subtitle="$heroSubtitle ?: __('company_history.hero_subtitle')"
cta-url="#company-history-timeline"
/>
@if($page && ($page->translate('content') ?: $page->content))
<div class="flex flex-wrap mx-[-15px] !mt-10">
<div class="lg:w-9/12 xl:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
<div class="prose max-w-none !text-[#60697b] !text-center">
{!! $page->translate('content') ?: $page->content !!}
</div>
</div>
</div>
@endif
</div>
</section>
<x-company-history.timeline :items="$historyItems" />
<div id="company-history-timeline">
<x-company-history.timeline :items="$historyItems" :show-header="true" />
</div>
@endsection