rm copy to clipboard for tauri and fix invisible icons

master
Laurin Weger 10 months ago
parent 8685ec3027
commit 328f0d4864
  1. 90
      ng-app/src/lib/components/CopyToClipboard.svelte
  2. 3
      ng-app/src/routes/WalletCreate.svelte

@ -4,11 +4,21 @@
let has_success: boolean = false; let has_success: boolean = false;
const tauri_platform = import.meta.env.TAURI_PLATFORM;
const setClipboard = async (text: string) => {
if (tauri_platform) {
// TODO: this won't work for tauri platform.
// const { writeText } = await import("@tauri-apps/api/clipboard");
// await writeText(text);
} else {
navigator.clipboard.writeText(text);
}
};
const on_click = (e) => { const on_click = (e) => {
has_success = true; has_success = true;
setTimeout(() => (has_success = false), 2_000); setTimeout(() => (has_success = false), 2_000);
setClipboard(value);
navigator.clipboard.writeText(value);
}; };
</script> </script>
@ -22,44 +32,46 @@
disabled disabled
readonly readonly
/> />
<button {#if !tauri_platform}
on:click={on_click} <button
class="absolute end-2 top-1/2 -translate-y-1/2 bg-gray-50 shadow-none text-gray-600 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-800 rounded-lg p-2 inline-flex items-center justify-center" on:click={on_click}
> class="absolute inset-y-0 right-0 p-3 flex items-center text-sm leading-5 bg-transparent shadow-none"
<span id="default-icon" class:hidden={has_success}>
<svg
class="w-3.5 h-3.5"
aria-hidden="true"
xmlns="http://www.w3.org/2000/svg"
fill="currentColor"
viewBox="0 0 18 20"
>
<path
d="M16 1h-3.278A1.992 1.992 0 0 0 11 0H7a1.993 1.993 0 0 0-1.722 1H2a2 2 0 0 0-2 2v15a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V3a2 2 0 0 0-2-2Zm-3 14H5a1 1 0 0 1 0-2h8a1 1 0 0 1 0 2Zm0-4H5a1 1 0 0 1 0-2h8a1 1 0 1 1 0 2Zm0-5H5a1 1 0 0 1 0-2h2V2h4v2h2a1 1 0 1 1 0 2Z"
/>
</svg>
</span>
<span
id="success-icon"
class="inline-flex items-center"
class:hidden={!has_success}
> >
<svg <span id="default-icon" class:hidden={has_success}>
class="w-3.5 h-3.5 text-blue-700 dark:text-blue-500" <svg
aria-hidden={!has_success} class="w-3.5 h-3.5"
xmlns="http://www.w3.org/2000/svg" aria-hidden="true"
fill="none" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 16 12" fill="currentColor"
viewBox="0 0 18 20"
>
<path
d="M16 1h-3.278A1.992 1.992 0 0 0 11 0H7a1.993 1.993 0 0 0-1.722 1H2a2 2 0 0 0-2 2v15a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V3a2 2 0 0 0-2-2Zm-3 14H5a1 1 0 0 1 0-2h8a1 1 0 0 1 0 2Zm0-4H5a1 1 0 0 1 0-2h8a1 1 0 1 1 0 2Zm0-5H5a1 1 0 0 1 0-2h2V2h4v2h2a1 1 0 1 1 0 2Z"
/>
</svg>
</span>
<span
id="success-icon"
class="inline-flex items-center"
class:hidden={!has_success}
> >
<path <svg
stroke="currentColor" class="w-3.5 h-3.5 text-blue-700 dark:text-blue-500"
stroke-linecap="round" aria-hidden={!has_success}
stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg"
stroke-width="2" fill="none"
d="M1 5.917 5.724 10.5 15 1.5" viewBox="0 0 16 12"
/> >
</svg> <path
</span> stroke="currentColor"
</button> stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M1 5.917 5.724 10.5 15 1.5"
/>
</svg>
</span>
</button>
{/if}
</div> </div>
</div> </div>

@ -10,6 +10,7 @@
--> -->
<!-- <!--
@component
Wallet creation page. Wallet creation page.
This component manages the whole UX flow, gives infos about wallets, This component manages the whole UX flow, gives infos about wallets,
offers available brokers, handles wallet creation, offers available brokers, handles wallet creation,
@ -1689,7 +1690,7 @@
> >
<svelte:component <svelte:component
this={emoji.svg?.default} this={emoji.svg?.default}
class="text-5xl" class="text-5xl w-full"
/> />
</div> </div>
<div class="flex flex-col ml-4"> <div class="flex flex-col ml-4">

Loading…
Cancel
Save