spt/forge
spt/forge
0
0
Fork 0
mirror of https://github.com/sp-tarkov/forge.git synced 2025-02-13 04:30:41 -05:00
Code Issues Packages Projects Releases Wiki Activity

setup and style dropdown options

Browse Source
This commit is contained in:
IsWaffle 2024-11-22 14:28:13 -05:00
parent a7e545d3c1
commit f9378b2044
3 changed files with 56 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
app/Livewire/Mod/ModerationOptions.php
View File

@ -2,6 +2,7 @@
namespace App\Livewire\Mod;
use Illuminate\Support\Facades\Log;
use Livewire\Component;
class ModerationOptions extends Component
@ -10,4 +11,14 @@ class ModerationOptions extends Component
{
return view('livewire.mod.moderation-options');
}
public function deleteMod(): void
{
Log::info('delete');
}
public function disableMod(): void
{
Log::info('disable');
}
}

8
resources/views/components/mod-card.blade.php
View File

@ -6,10 +6,12 @@
@endif
<div class="flex flex-col group h-full w-full bg-white dark:bg-gray-950 rounded-xl shadow-md dark:shadow-gray-950 drop-shadow-2xl overflow-hidden hover:shadow-lg hover:bg-gray-50 dark:hover:bg-black hover:shadow-gray-400 dark:hover:shadow-black transition-colors ease-out duration-700">
<div class="h-auto md:h-full md:flex">
@if (auth()->check() && auth()->user()->isAdmin())
<div class="absolute right-0 z-50 m-2">
<livewire:mod.moderation-options />
</div>
@endif
<div class="relative h-auto md:h-full md:shrink-0 overflow-hidden">
<div class="absolute right-0 z-50 text-blue-400 dark:text-blue-500 m-2">
<livewire:mod.moderation-options />
</div>
@if ($mod->thumbnail)
<img src="{{ $mod->thumbnailUrl }}" 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">
@else

48
resources/views/livewire/mod/moderation-options.blade.php
View File

@ -1,11 +1,43 @@
<div>
{{-- Icon (shield with keyhole) --}}
<svg width="24" height="24" fill="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path d="M3 5.75V11c0 5.001 2.958 8.676 8.725 10.948a.75.75 0 0 0 .55 0C18.042 19.676 21 16 21 11V5.75a.75.75 0 0 0-.75-.75c-2.663 0-5.258-.943-7.8-2.85a.75.75 0 0 0-.9 0C9.008 4.057 6.413 5 3.75 5a.75.75 0 0 0-.75.75ZM13.995 11a2 2 0 0 1-1.245 1.852v2.398a.75.75 0 0 1-1.5 0v-2.394A2 2 0 1 1 13.995 11Z"/>
</svg>
<x-dropdown alignment="right" contentClasses="py-1 rounded-full bg-gray-200 dark:bg-gray-800">
<x-slot name="trigger">
{{-- wire:click.prevent here to stop from following mod card links --}}
<button class="relative text-blue-400 dark:text-blue-500 hover:text-blue-600 dark:hover:text-blue-700" wire:click.prevent="">
{{-- Icon (shield with keyhole) --}}
<svg width="24" height="24" fill="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path d="M3 5.75V11c0 5.001 2.958 8.676 8.725 10.948a.75.75 0 0 0 .55 0C18.042 19.676 21 16 21 11V5.75a.75.75 0 0 0-.75-.75c-2.663 0-5.258-.943-7.8-2.85a.75.75 0 0 0-.9 0C9.008 4.057 6.413 5 3.75 5a.75.75 0 0 0-.75.75ZM13.995 11a2 2 0 0 1-1.245 1.852v2.398a.75.75 0 0 1-1.5 0v-2.394A2 2 0 1 1 13.995 11Z"/>
</svg>
</button>
</x-slot>
{{-- Another good option for an icon if the shield is too much (option dials)--}}
{{-- <svg width="24" height="24" fill="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">--}}
{{-- <path d="M8.75 13.5a3.251 3.251 0 0 1 3.163 2.5h9.337a.75.75 0 0 1 .102 1.493l-.102.007h-9.337a3.251 3.251 0 0 1-6.326 0H2.75a.75.75 0 0 1-.102-1.493L2.75 16h2.837a3.251 3.251 0 0 1 3.163-2.5Zm6.5-9.5a3.251 3.251 0 0 1 3.163 2.5h2.837a.75.75 0 0 1 .102 1.493L21.25 8h-2.837a3.251 3.251 0 0 1-6.326 0H2.75a.75.75 0 0 1-.102-1.493L2.75 6.5h9.337A3.251 3.251 0 0 1 15.25 4Z"/>--}}
{{-- </svg>--}}
<x-slot name="content">
<div>
<button wire:click.prevent="disableMod" wire:confirm="Disable the mod?" class="p-2 h-full w-full text-blue-500 dark:text-blue-500 bg-gray-200 dark:bg-gray-800 hover:text-blue-400 dark:hover:text-blue-400">
<div class="flex">
<span class="pr-2">
{{-- Icon (circle with dash) --}}
<svg width="24" height="24" fill="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path d="M12 2.001c5.524 0 10 4.477 10 10s-4.476 10-10 10c-5.522 0-10-4.477-10-10s4.478-10 10-10Zm4.25 9.25h-8.5a.75.75 0 0 0 0 1.5h8.5a.75.75 0 0 0 0-1.5Z" />
</svg>
</span>
{{ __('Disable') }}
</div>
</button>
</div>
<div>
<button wire:click.prevent="deleteMod" wire:confirm="Delete the mod?" class="p-2 h-full w-full text-red-500 dark:text-red-500 bg-gray-200 dark:bg-gray-800 hover:text-red-400 dark:hover:text-red-400">
<div class="flex">
<span class="pr-2">
{{-- Icon (trash can) --}}
<svg width="24" height="24" fill="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path d="M21.5 6a1 1 0 0 1-.883.993L20.5 7h-.845l-1.231 12.52A2.75 2.75 0 0 1 15.687 22H8.313a2.75 2.75 0 0 1-2.737-2.48L4.345 7H3.5a1 1 0 0 1 0-2h5a3.5 3.5 0 1 1 7 0h5a1 1 0 0 1 1 1Zm-7.25 3.25a.75.75 0 0 0-.743.648L13.5 10v7l.007.102a.75.75 0 0 0 1.486 0L15 17v-7l-.007-.102a.75.75 0 0 0-.743-.648Zm-4.5 0a.75.75 0 0 0-.743.648L9 10v7l.007.102a.75.75 0 0 0 1.486 0L10.5 17v-7l-.007-.102a.75.75 0 0 0-.743-.648ZM12 3.5A1.5 1.5 0 0 0 10.5 5h3A1.5 1.5 0 0 0 12 3.5Z" />
</svg>
</span>
{{ __('Delete') }}
</div>
</button>
</div>
</x-slot>
</x-dropdown>
</div>