iptv-org-mirror/iptv-org.github.io
1
0
Fork 0
mirror of https://github.com/iptv-org/iptv-org.github.io.git synced 2025-05-13 02:20:06 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Update CopyToClipboard.svelte

Browse source
This commit is contained in:
freearhey 2023-10-10 06:13:37 +03:00
parent 768357b9ef
commit 5002b5305f
1 changed files with 17 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

33
src/components/CopyToClipboard.svelte
View file

@ -12,24 +12,12 @@
} }
</script> </script>
<style> <Clipboard {text} on:copy={onSuccess} let:copy>
.tooltip::after {
content: '';
position: absolute;
left: 100%;
top: 50%;
border-width: 7px;
border-style: solid;
transform: translate3d(0, -7px, 0px);
border-color: transparent transparent transparent black;
}
</style>
<Clipboard text="{text}" on:copy="{onSuccess}" let:copy>
<button <button
type="button" type="button"
on:click="{copy}" on:click={copy}
class="relative flex items-center p-1 text-xs text-gray-500 dark:text-gray-100" class="relative flex items-center p-1 text-xs text-gray-500 dark:text-gray-100"
area-label="Copy to Clipboard"
> >
<svg <svg
class="w-5 h-5" class="w-5 h-5"
@ -48,10 +36,23 @@
<span class="hidden">Copy to Clipboard</span> <span class="hidden">Copy to Clipboard</span>
<div <div
role="tooltip" role="tooltip"
class:hidden="{!showTooltip}" class:hidden={!showTooltip}
class="tooltip inline-block absolute right-10 top-0 py-2 px-3 text-xs text-gray-100 rounded-md bg-black" class="tooltip inline-block absolute right-10 top-0 py-2 px-3 text-xs text-gray-100 rounded-md bg-black"
> >
Copied! Copied!
</div> </div>
</button> </button>
</Clipboard> </Clipboard>
<style>
.tooltip::after {
content: '';
position: absolute;
left: 100%;
top: 50%;
border-width: 7px;
border-style: solid;
transform: translate3d(0, -7px, 0px);
border-color: transparent transparent transparent black;
}
</style>