mirror of
https://github.com/sp-tarkov/forge.git
synced 2025-02-13 04:30:41 -05:00
Refringe
787f796ad7
Worked on: - Mod component templating - Added dark mode styles for homepage - Added benchmarking to the wolt import command - Added MySQL natural sort function Short todo: - Add updated time to mod component - Implement naturalsort function into homepage queries and measure performance difference - Migrate top navigation from old-build
41 lines
2.9 KiB
PHP
41 lines
2.9 KiB
PHP
@props(['mods', 'versionScope'])
|
|
|
|
<div class="grid grid-cols-1 gap-6 lg:grid-cols-2">
|
|
@foreach ($mods as $mod)
|
|
<a href="/mod/{{ $mod->id }}/{{ $mod->slug }}">
|
|
<div class="flex flex-col group h-full w-full max-w-md mx-auto bg-white dark:bg-gray-950 rounded-xl shadow-md dark:shadow-gray-950 drop-shadow-2xl overflow-hidden md:max-w-2xl hover:shadow-lg hover:bg-gray-50 dark:hover:bg-black hover:shadow-gray-400 dark:hover:shadow-black transition-all duration-200">
|
|
<div class="h-auto md:h-full md:flex">
|
|
<div class="h-auto md:h-full md:shrink-0 overflow-hidden">
|
|
@if(empty($mod->thumbnail))
|
|
<img src="https://placehold.co/450x450/EEE/31343C?font=source-sans-pro&text={{ $mod->name }}" alt="{{ $mod->name }}" class="block dark:hidden h-48 w-full object-cover md:h-full md:w-48 transform group-hover:scale-110 transition-all duration-200">
|
|
<img src="https://placehold.co/450x450/31343C/EEE?font=source-sans-pro&text={{ $mod->name }}" alt="{{ $mod->name }}" class="hidden dark:block h-48 w-full object-cover md:h-full md:w-48 transform group-hover:scale-110 transition-all duration-200">
|
|
@else
|
|
<img src="{{ $mod->thumbnail }}" alt="{{ $mod->name }}" class="h-48 w-full object-cover md:h-full md:w-48 transform group-hover:scale-110 transition-all duration-200">
|
|
@endif
|
|
</div>
|
|
<div class="flex flex-col w-full justify-between p-5">
|
|
<div>
|
|
<div class="flex justify-between items-center space-x-3">
|
|
<h3 class="block mt-1 text-lg leading-tight font-medium text-black dark:text-white group-hover:underline">{{ $mod->name }}</h3>
|
|
<span class="badge-version {{ $mod->{$versionScope}->sptVersion->color_class }} inline-flex items-center rounded-md px-2 py-1 text-xs font-medium text-nowrap">
|
|
{{ $mod->{$versionScope}->sptVersion->version }}
|
|
</span>
|
|
</div>
|
|
<p class="mt-2 text-slate-500 dark:text-gray-300">{{ $mod->teaser }}</p>
|
|
</div>
|
|
<p class="text-slate-700 dark:text-gray-300 text-sm">
|
|
<span>By {{ $mod->user->name }}</span>
|
|
@if (!is_null($mod->total_downloads))
|
|
<span>– {{ Number::format($mod->total_downloads) }} downloads</span>
|
|
@endif
|
|
@if(!is_null($mod->updated_at))
|
|
<span>– updated {{ $mod->updated_at }}</span>
|
|
@endif
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
@endforeach
|
|
</div>
|