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

Refactor Featured Products Section in Menu Item Component: Updated the layout and styling of the featured products section in the menu-item Blade component for improved visual appeal and user experience. Enhanced the structure for better responsiveness and consistency in design.

Browse Source
This commit is contained in:
Ümit Tunç
2026-01-01 20:00:34 +03:00
parent 0ca75829bb
commit 89eb9f5c4e
1 changed files with 23 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/views/components/front/menu-item.blade.php
+23 -21
View File
@@ -40,28 +40,30 @@
</ul> </ul>
</div> </div>
<div class="xl:w-9/12 lg:w-9/12 w-full flex-[0_0_auto] max-w-full xl:border-l-[rgba(164,174,198,0.2)] xl:border-l xl:border-solid lg:border-l-[rgba(164,174,198,0.2)] lg:border-l lg:border-solid xl:p-[50px] lg:pl-[50px] px-6 gradient-2 rounded-[.4rem]"> <div class="xl:w-9/12 lg:w-9/12 w-full flex-[0_0_auto] max-w-full px-6 xl:!pl-8 lg:!pl-8">
<h6 class="dropdown-header !text-white mb-6 !p-0">{{ __('Öne Çıkan Ürünler') }}</h6> <div class="h-full xl:p-[50px] lg:pl-[50px] px-6 pt-2 gradient-5 rounded-[.4rem]">
<div class="flex flex-wrap gap-4 mx-6"> <h6 class="dropdown-header !text-white mb-6 mt-6 !p-0">{{ __('Öne Çıkan Ürünler') }}</h6>
@foreach($featuredProducts as $item) <div class="flex flex-wrap gap-4 mx-5 pt-5">
<div class="flex-none" style="width: 183px;"> @foreach($featuredProducts as $item)
<a class="group !bg-transparent mt-2 mb-2 !p-0 block transition-transform duration-300 hover:-translate-y-1" <div class="flex-none " style="width: 183px;">
href="{{ route('products.show', $item->slug) }}" <a class="group !bg-transparent !p-0 block transition-transform duration-300 hover:-translate-y-1"
data-bs-toggle="tooltip" href="{{ route('products.show', $item->slug) }}"
data-bs-placement="top" data-bs-toggle="tooltip"
title="{{ $item->translate('title') }}"> data-bs-placement="top"
<figure style="width: 183px; height: 103px;" title="{{ $item->translate('title') }}">
class="!rounded-[.4rem] lift overflow-hidden !mb-2 shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.57)] mx-auto block transition-transform duration-300 group-hover:-translate-y-1 hidden xl:block lg:block "> <figure style="width: 183px; height: 103px;"
@if($item->hero_image) class="!rounded-[.4rem] lift overflow-hidden shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.57)] mx-auto block transition-transform duration-300 group-hover:-translate-y-1 hidden xl:block lg:block ">
<img style="width: 183px; height: 103px;" class="!rounded-[.4rem] object-cover block" src="{{ \Storage::url($item->hero_image) }}" alt="{{ $item->translate('title') }}"> @if($item->hero_image)
@else <img style="width: 183px; height: 103px;" class="!rounded-[.4rem] object-cover block" src="{{ \Storage::url($item->hero_image) }}" alt="{{ $item->translate('title') }}">
<img style="width: 183px; height: 103px;" class="!rounded-[.4rem] object-cover block" src="https://placehold.co/185x135?text={{ urlencode($item->translate('title')) }}" alt="{{ $item->translate('title') }}"> @else
@endif <img style="width: 183px; height: 103px;" class="!rounded-[.4rem] object-cover block" src="https://placehold.co/185x135?text={{ urlencode($item->translate('title')) }}" alt="{{ $item->translate('title') }}">
</figure> @endif
<span class="xl:!hidden lg:!hidden">{{ $item->translate('title') }}</span> </figure>
</a> <span class="xl:!hidden lg:!hidden">{{ $item->translate('title') }}</span>
</a>
</div>
@endforeach
</div> </div>
@endforeach
</div> </div>
</div> </div>
<!--/column --> <!--/column -->