Forms, upvote button, modal, notifications and several pages had no dark: classes and rendered as white blocks in dark mode. Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
47 lines
1.5 KiB
PHP
47 lines
1.5 KiB
PHP
@props(['product'])
|
|
|
|
@php
|
|
$isBookmarked = auth()->check() && $product->isBookmarkedBy(auth()->user());
|
|
@endphp
|
|
|
|
<div x-data="{
|
|
bookmarked: {{ $isBookmarked ? 'true' : 'false' }},
|
|
loading: false,
|
|
toggleBookmark() {
|
|
if (this.loading) return;
|
|
this.loading = true;
|
|
|
|
fetch('{{ route('products.bookmark', $product) }}', {
|
|
method: 'POST',
|
|
headers: {
|
|
'X-CSRF-TOKEN': '{{ csrf_token() }}',
|
|
'Content-Type': 'application/json',
|
|
'Accept': 'application/json',
|
|
},
|
|
})
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
this.bookmarked = data.bookmarked;
|
|
})
|
|
.catch(error => {
|
|
console.error('Error:', error);
|
|
})
|
|
.finally(() => {
|
|
this.loading = false;
|
|
});
|
|
}
|
|
}">
|
|
<button @click="toggleBookmark()"
|
|
:disabled="loading"
|
|
:title="bookmarked ? 'Remove bookmark' : 'Bookmark this product'"
|
|
class="text-gray-400 dark:text-gray-500 hover:text-primary-600 transition-colors disabled:opacity-50">
|
|
<svg class="h-5 w-5"
|
|
:class="{ 'animate-pulse': loading }"
|
|
:fill="bookmarked ? 'currentColor' : 'none'"
|
|
stroke="currentColor"
|
|
viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 5a2 2 0 012-2h10a2 2 0 012 2v16l-7-3.5L5 21V5z"></path>
|
|
</svg>
|
|
</button>
|
|
</div>
|