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

refactor: optimize mega menu spacing and alignment using inline styles for consistent layout density

Browse Source
This commit is contained in:
Ümit Tunç
2026-05-27 07:07:34 +03:00
parent 5bc2fd0029
commit 38b06f9d1c
1 changed files with 19 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/views/components/front/menu-item.blade.php
+19 -16
View File
@@ -56,19 +56,20 @@
<li class="mega-menu-content"> <li class="mega-menu-content">
<div class="flex flex-wrap mx-0 xl:mx-[-10px] lg:mx-[-10px]"> <div class="flex flex-wrap mx-0 xl:mx-[-10px] lg:mx-[-10px]">
<!-- Sütun 1: Ürünlerimiz --> <!-- Sütun 1: Ürünlerimiz -->
<div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] max-w-full px-5 xl:border-r border-[#0000000a] dark:border-[#ffffff0a] mb-4 lg:mb-0"> <div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] max-w-full px-5 xl:border-r border-[#0000000a] dark:border-[#ffffff0a] mb-2 lg:mb-0">
<h6 class="dropdown-header !text-[#e31e24] mb-3 mt-1 !pl-0 text-uppercase tracking-wider font-bold text-xs flex items-center"> <h6 class="dropdown-header !text-[#e31e24] !pl-0 text-uppercase tracking-wider font-bold text-xs flex items-center" style="margin-top: 5px !important; margin-bottom: 8px !important; padding: 0px !important;">
<i class="uil uil-cube text-lg mr-2.5"></i> <i class="uil uil-cube text-lg mr-2.5"></i>
{{ __('Ürünlerimiz') }} {{ __('Ürünlerimiz') }}
</h6> </h6>
<ul class="pl-0 list-none mb-0"> <ul class="pl-0 list-none mb-0">
@foreach($products as $prod) @foreach($products as $prod)
<li class="w-full mb-1.5"> <li class="w-full" style="margin-bottom: 0px !important; padding: 0px !important;">
<a class='dropdown-item hover:!text-[#e31e24] !pl-0 !py-0.5 !bg-transparent flex items-center transition-all duration-200 hover:translate-x-1' <a class='dropdown-item hover:!text-[#e31e24] !pl-0 !bg-transparent flex items-center transition-all duration-200 hover:translate-x-1'
style="padding-top: 2px !important; padding-bottom: 2px !important; padding-left: 0px !important; padding-right: 0px !important; margin: 0px !important; line-height: 1.2 !important;"
href="{{ $prod->external_url ? $prod->external_url : route('products.show', $prod->slug) }}" href="{{ $prod->external_url ? $prod->external_url : route('products.show', $prod->slug) }}"
@if($prod->external_url) target="_blank" @endif> @if($prod->external_url) target="_blank" @endif>
<i class="uil uil-angle-right text-[#e31e24] mr-3 text-[15px] opacity-80"></i> <i class="uil uil-angle-right text-[#e31e24] mr-1 text-[15px] opacity-80"></i>
<span class="font-medium text-[13.5px] tracking-wide">{{ $prod->translate('title') }}</span> <span class="font-medium text-[13.5px] tracking-wide" style="line-height: 1.2 !important;">{{ $prod->translate('title') }}</span>
</a> </a>
</li> </li>
@endforeach @endforeach
@@ -76,19 +77,20 @@
</div> </div>
<!-- Sütun 2: Hizmetlerimiz --> <!-- Sütun 2: Hizmetlerimiz -->
<div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] max-w-full px-5 xl:border-r border-[#0000000a] dark:border-[#ffffff0a] mb-4 lg:mb-0"> <div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] max-w-full px-5 xl:border-r border-[#0000000a] dark:border-[#ffffff0a] mb-2 lg:mb-0">
<h6 class="dropdown-header !text-[#e31e24] mb-3 mt-1 !pl-0 text-uppercase tracking-wider font-bold text-xs flex items-center"> <h6 class="dropdown-header !text-[#e31e24] !pl-0 text-uppercase tracking-wider font-bold text-xs flex items-center" style="margin-top: 5px !important; margin-bottom: 8px !important; padding: 0px !important;">
<i class="uil uil-cog text-lg mr-2.5"></i> <i class="uil uil-cog text-lg mr-2.5"></i>
{{ __('Hizmetlerimiz') }} {{ __('Hizmetlerimiz') }}
</h6> </h6>
<ul class="pl-0 list-none mb-0"> <ul class="pl-0 list-none mb-0">
@foreach($services as $serv) @foreach($services as $serv)
<li class="w-full mb-1.5"> <li class="w-full" style="margin-bottom: 0px !important; padding: 0px !important;">
<a class='dropdown-item hover:!text-[#e31e24] !pl-0 !py-0.5 !bg-transparent flex items-center transition-all duration-200 hover:translate-x-1' <a class='dropdown-item hover:!text-[#e31e24] !pl-0 !bg-transparent flex items-center transition-all duration-200 hover:translate-x-1'
style="padding-top: 2px !important; padding-bottom: 2px !important; padding-left: 0px !important; padding-right: 0px !important; margin: 0px !important; line-height: 1.2 !important;"
href="{{ $serv->external_url ? $serv->external_url : route('products.show', $serv->slug) }}" href="{{ $serv->external_url ? $serv->external_url : route('products.show', $serv->slug) }}"
@if($serv->external_url) target="_blank" @endif> @if($serv->external_url) target="_blank" @endif>
<i class="uil uil-angle-right text-[#e31e24] mr-3 text-[15px] opacity-80"></i> <i class="uil uil-angle-right text-[#e31e24] mr-1 text-[15px] opacity-80"></i>
<span class="font-medium text-[13.5px] tracking-wide">{{ $serv->translate('title') }}</span> <span class="font-medium text-[13.5px] tracking-wide" style="line-height: 1.2 !important;">{{ $serv->translate('title') }}</span>
</a> </a>
</li> </li>
@endforeach @endforeach
@@ -97,18 +99,19 @@
<!-- Sütun 3: Projelerimiz & Başarı Hikayeleri --> <!-- Sütun 3: Projelerimiz & Başarı Hikayeleri -->
<div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] max-w-full px-5"> <div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] max-w-full px-5">
<h6 class="dropdown-header !text-[#e31e24] mb-3 mt-1 !pl-0 text-uppercase tracking-wider font-bold text-xs flex items-center"> <h6 class="dropdown-header !text-[#e31e24] !pl-0 text-uppercase tracking-wider font-bold text-xs flex items-center" style="margin-top: 5px !important; margin-bottom: 8px !important; padding: 0px !important;">
<i class="uil uil-award text-lg mr-2.5"></i> <i class="uil uil-award text-lg mr-2.5"></i>
{{ $locale === 'tr' ? 'Projelerimiz / Başarılar' : ($locale === 'se' ? 'Projekt & Framgångar' : 'Projects & Successes') }} {{ $locale === 'tr' ? 'Projelerimiz / Başarılar' : ($locale === 'se' ? 'Projekt & Framgångar' : 'Projects & Successes') }}
</h6> </h6>
<ul class="pl-0 list-none mb-0"> <ul class="pl-0 list-none mb-0">
@foreach($projectLinks as $proj) @foreach($projectLinks as $proj)
<li class="w-full mb-1.5"> <li class="w-full" style="margin-bottom: 0px !important; padding: 0px !important;">
<a class='dropdown-item hover:!text-[#e31e24] !pl-0 !py-0.5 !bg-transparent flex items-center justify-between transition-all duration-200 hover:translate-x-1' <a class='dropdown-item hover:!text-[#e31e24] !pl-0 !bg-transparent flex items-center justify-between transition-all duration-200 hover:translate-x-1'
style="padding-top: 2px !important; padding-bottom: 2px !important; padding-left: 0px !important; padding-right: 0px !important; margin: 0px !important; line-height: 1.2 !important;"
href="{{ $proj['url'] }}"> href="{{ $proj['url'] }}">
<span class="flex items-center"> <span class="flex items-center">
<i class="uil {{ $proj['icon'] }} text-[#e31e24] mr-3 text-[15px] opacity-90"></i> <i class="uil {{ $proj['icon'] }} text-[#e31e24] mr-3 text-[15px] opacity-90"></i>
<span class="font-medium text-[13.5px] tracking-wide">{{ $proj['title'] }}</span> <span class="font-medium text-[13.5px] tracking-wide" style="line-height: 1.2 !important;">{{ $proj['title'] }}</span>
</span> </span>
@if($proj['badge']) @if($proj['badge'])
<span class="badge bg-[#e31e24]/10 text-[#e31e24] text-[10px] px-2 py-0.5 rounded-full font-semibold ml-2">{{ $proj['badge'] }}</span> <span class="badge bg-[#e31e24]/10 text-[#e31e24] text-[10px] px-2 py-0.5 rounded-full font-semibold ml-2">{{ $proj['badge'] }}</span>