feat: update YouTube API integration with enhanced release date parsing, improved topic channel resolution, and localization updates for music productions
This commit is contained in:
Ümit Tunç
@@ -15,31 +15,33 @@
|
||||
<section class="wrapper !bg-[#ffffff]">
|
||||
<div class="container !pb-[4.5rem] xl:!pb-24 lg:!pb-24 md:!pb-24">
|
||||
@if($productions->count() > 0)
|
||||
<div class="projects-masonry !mt-[-10rem] xl:!mt-[-12rem] lg:!mt-[-12rem] md:!mt-[-10rem] !mb-10">
|
||||
<div class="flex flex-wrap mx-[-20px] xl:mx-[-25px] lg:mx-[-25px] !mt-[-2rem] xl:!mt-[-2.5rem] lg:!mt-[-2.5rem]">
|
||||
<div class="itemgrid grid-view projects-masonry !mt-[-10rem] xl:!mt-[-12rem] lg:!mt-[-12rem] md:!mt-[-10rem] !mb-10">
|
||||
<div class="flex flex-wrap mx-[-20px] xl:mx-[-25px] lg:mx-[-25px] !mt-[-2rem] xl:!mt-[-2.5rem] lg:!mt-[-2.5rem] isotope">
|
||||
@php
|
||||
$accentColors = [
|
||||
['border' => '#54a8c7', 'text' => '#54a8c7', 'tooltip' => 'itooltip-aqua'],
|
||||
['border' => '#747ed1', 'text' => '#747ed1', 'tooltip' => 'itooltip-purple'],
|
||||
['border' => '#fab758', 'text' => '#fab758', 'tooltip' => 'itooltip-yellow'],
|
||||
['border' => '#e2626b', 'text' => '#e2626b', 'tooltip' => 'itooltip-red'],
|
||||
['border' => '#f78b77', 'text' => '#f78b77', 'tooltip' => 'itooltip-orange'],
|
||||
['border' => '#7cb798', 'text' => '#7cb798', 'tooltip' => 'itooltip-leaf'],
|
||||
['border' => '#d16b86', 'text' => '#d16b86', 'tooltip' => 'itooltip-pink'],
|
||||
['border' => '#45c4a0', 'text' => '#45c4a0', 'tooltip' => 'itooltip-green'],
|
||||
['border' => '#a07cc5', 'text' => '#a07cc5', 'tooltip' => 'itooltip-violet'],
|
||||
['border' => '#54a8c7', 'text' => '#54a8c7', 'tooltip' => 'itooltip-aqua', 'filter' => 'workshop'],
|
||||
['border' => '#747ed1', 'text' => '#747ed1', 'tooltip' => 'itooltip-purple', 'filter' => 'product'],
|
||||
['border' => '#fab758', 'text' => '#fab758', 'tooltip' => 'itooltip-yellow', 'filter' => 'product'],
|
||||
['border' => '#e2626b', 'text' => '#e2626b', 'tooltip' => 'itooltip-red', 'filter' => 'workshop'],
|
||||
['border' => '#f78b77', 'text' => '#f78b77', 'tooltip' => 'itooltip-orange', 'filter' => 'still-life'],
|
||||
['border' => '#7cb798', 'text' => '#7cb798', 'tooltip' => 'itooltip-leaf', 'filter' => 'concept'],
|
||||
['border' => '#d16b86', 'text' => '#d16b86', 'tooltip' => 'itooltip-pink', 'filter' => 'product'],
|
||||
['border' => '#45c4a0', 'text' => '#45c4a0', 'tooltip' => 'itooltip-green', 'filter' => 'workshop'],
|
||||
['border' => '#a07cc5', 'text' => '#a07cc5', 'tooltip' => 'itooltip-violet', 'filter' => 'concept'],
|
||||
];
|
||||
@endphp
|
||||
@foreach($productions as $index => $production)
|
||||
@php
|
||||
$color = $accentColors[$index % count($accentColors)];
|
||||
$categoryLabel = $production->translate('client_name') ?: __('music_productions.card_category_default');
|
||||
$detailUrl = route('music-productions.show', $production->slug);
|
||||
@endphp
|
||||
<div class="project item xl:w-4/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] max-w-full px-[20px] xl:!px-[25px] lg:!px-[25px] !mt-[2rem] xl:!mt-[2.5rem] lg:!mt-[2.5rem]">
|
||||
<div class="card !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)] transition-all duration-300 hover:!shadow-[0_0.5rem_2.5rem_rgba(30,34,40,0.12)] hover:translate-y-[-0.15rem]">
|
||||
<figure class="card-img-top overflow-hidden rounded-t group {{ $color['tooltip'] }}" title='<h5 class="!mb-0">{!! t("Detayları Görüntüle") !!}</h5>'>
|
||||
<a href="{{ route('music-productions.show', $production->slug) }}">
|
||||
<div class="project item xl:w-4/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] max-w-full {{ $color['filter'] }} px-[20px] xl:!px-[25px] lg:!px-[25px] !mt-[2rem] xl:!mt-[2.5rem] lg:!mt-[2.5rem]">
|
||||
<div class="card !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)]">
|
||||
<figure class="card-img-top itooltip {{ $color['tooltip'] }}" title='<h5 class="!mb-0">{{ e(__('music_productions.view_details_tooltip')) }}</h5>'>
|
||||
<a href="{{ $detailUrl }}">
|
||||
@if($production->cover_image_url)
|
||||
<img class="transition-all duration-[0.35s] ease-in-out group-hover:scale-105" src="{{ $production->cover_image_url }}" alt="{{ $production->translate('title') }}">
|
||||
<img src="{{ $production->cover_image_url }}" alt="{{ $production->translate('title') }}">
|
||||
@else
|
||||
<div class="bg-gradient-to-br from-gray-200 to-gray-300 flex items-center justify-center" style="height: 250px;">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" class="w-16 h-16 text-gray-400">
|
||||
@@ -51,28 +53,23 @@
|
||||
</figure>
|
||||
<div class="card-body p-7">
|
||||
<div class="post-header">
|
||||
@if($production->client_name)
|
||||
<div class="inline-flex uppercase !tracking-[0.02rem] text-[0.7rem] font-semibold text-line relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 !mb-2" style="color: {{ $color['text'] }}; --tw-before-bg: {{ $color['border'] }}; before:bg-[{{ $color['border'] }}];">
|
||||
<span style="color: {{ $color['text'] }}">{{ $production->translate('client_name') }}</span>
|
||||
<div class="inline-flex uppercase !tracking-[0.02rem] text-[0.7rem] font-semibold text-line relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 !mb-2" style="color: {{ $color['text'] }};">
|
||||
{{ $categoryLabel }}
|
||||
</div>
|
||||
@endif
|
||||
@if($production->production_date)
|
||||
<div class="text-[0.65rem] text-[#aab0bc] !mb-1">
|
||||
{{ $production->production_date->format('d.m.Y') }}
|
||||
</div>
|
||||
@endif
|
||||
<h3 class="!mb-0">
|
||||
<a href="{{ route('music-productions.show', $production->slug) }}" class="hover:text-[{{ $color['text'] }}] transition-colors duration-200">
|
||||
{{ $production->translate('title') }}
|
||||
</a>
|
||||
</h3>
|
||||
<h3 class="!mb-0">{{ $production->translate('title') }}</h3>
|
||||
</div>
|
||||
<!-- /.post-header -->
|
||||
</div>
|
||||
<!-- /.card-body -->
|
||||
</div>
|
||||
<!-- /.card -->
|
||||
</div>
|
||||
<!-- /.project -->
|
||||
@endforeach
|
||||
</div>
|
||||
<!-- /.isotope -->
|
||||
</div>
|
||||
<!-- /.itemgrid -->
|
||||
|
||||
{{-- Pagination --}}
|
||||
@if($productions->hasPages())
|
||||
@@ -149,26 +146,6 @@
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
/* Masonry item entrance animation */
|
||||
.project.item {
|
||||
animation: fadeInUp 0.6s ease forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
@keyframes fadeInUp {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: translateY(30px);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
@for($i = 0; $i < 9; $i++)
|
||||
.project.item:nth-child({{ $i + 1 }}) {
|
||||
animation-delay: {{ $i * 0.1 }}s;
|
||||
}
|
||||
@endfor
|
||||
</style>
|
||||
@endpush
|
||||
@endsection
|
||||
|
||||
Reference in New Issue
Block a user