📋 Add copy-to-clipboard feature for service URLs: Enhance user experience by allowing easy copying of clearnet, onion, I2P, and pkdns links.

This commit is contained in:
HolgerHatGarKeineNode
2025-12-07 06:28:06 +01:00
parent c4cea2ae7a
commit 14c1d9df15

View File

@@ -107,40 +107,68 @@ class extends Component {
<flux:table.cell> <flux:table.cell>
<div class="flex flex-col gap-1"> <div class="flex flex-col gap-1">
@if($service->url_clearnet) @if($service->url_clearnet)
<flux:tooltip content="{{ $service->url_clearnet }}"> <div class="flex items-center gap-2">
<flux:link :href="$service->url_clearnet" external <flux:tooltip content="{{ $service->url_clearnet }}">
class="text-blue-600 dark:text-blue-400"> <flux:link :href="$service->url_clearnet" external
<flux:icon.globe-alt variant="mini" class="inline"/> class="text-blue-600 dark:text-blue-400">
Clearnet <flux:icon.globe-alt variant="mini" class="inline"/>
</flux:link> Clearnet
</flux:tooltip> </flux:link>
</flux:tooltip>
<div x-copy-to-clipboard="'{{ $service->url_clearnet }}'">
<flux:button icon="clipboard" size="xs" variant="ghost" class="cursor-pointer">
{{ __('Copy') }}
</flux:button>
</div>
</div>
@endif @endif
@if($service->url_onion) @if($service->url_onion)
<flux:tooltip content="{{ $service->url_onion }}"> <div class="flex items-center gap-2">
<flux:link :href="$service->url_onion" external <flux:tooltip content="{{ $service->url_onion }}">
class="text-purple-600 dark:text-purple-400"> <flux:link :href="$service->url_onion" external
<flux:icon.lock-closed variant="mini" class="inline"/> class="text-purple-600 dark:text-purple-400">
Onion <flux:icon.lock-closed variant="mini" class="inline"/>
</flux:link> Onion
</flux:tooltip> </flux:link>
</flux:tooltip>
<div x-copy-to-clipboard="'{{ $service->url_onion }}'">
<flux:button icon="clipboard" size="xs" variant="ghost" class="cursor-pointer">
{{ __('Copy') }}
</flux:button>
</div>
</div>
@endif @endif
@if($service->url_i2p) @if($service->url_i2p)
<flux:tooltip content="{{ $service->url_i2p }}"> <div class="flex items-center gap-2">
<flux:link :href="$service->url_i2p" external <flux:tooltip content="{{ $service->url_i2p }}">
class="text-green-600 dark:text-green-400"> <flux:link :href="$service->url_i2p" external
<flux:icon.link variant="mini" class="inline"/> class="text-green-600 dark:text-green-400">
I2P <flux:icon.link variant="mini" class="inline"/>
</flux:link> I2P
</flux:tooltip> </flux:link>
</flux:tooltip>
<div x-copy-to-clipboard="'{{ $service->url_i2p }}'">
<flux:button icon="clipboard" size="xs" variant="ghost" class="cursor-pointer">
{{ __('Copy') }}
</flux:button>
</div>
</div>
@endif @endif
@if($service->url_pkdns) @if($service->url_pkdns)
<flux:tooltip content="{{ $service->url_pkdns }}"> <div class="flex items-center gap-2">
<flux:link :href="$service->url_pkdns" external <flux:tooltip content="{{ $service->url_pkdns }}">
class="text-orange-600 dark:text-orange-400"> <flux:link :href="$service->url_pkdns" external
<flux:icon.link variant="mini" class="inline"/> class="text-orange-600 dark:text-orange-400">
pkdns <flux:icon.link variant="mini" class="inline"/>
</flux:link> pkdns
</flux:tooltip> </flux:link>
</flux:tooltip>
<div x-copy-to-clipboard="'{{ $service->url_pkdns }}'">
<flux:button icon="clipboard" size="xs" variant="ghost" class="cursor-pointer">
{{ __('Copy') }}
</flux:button>
</div>
</div>
@endif @endif
@if($service->ip) @if($service->ip)
<div class="flex items-center gap-2"> <div class="flex items-center gap-2">