diff options
| author | Adam Soltys <[email protected]> | 2022-10-03 23:13:49 -0700 |
|---|---|---|
| committer | Adam Soltys <[email protected]> | 2022-10-03 23:13:49 -0700 |
| commit | 63f1a6780bab85ebb48ca1fc142cc6beaf772faa (patch) | |
| tree | b498ac8dd1a8ac5ffd517e6a8050399d9d7a86a1 /src/components/Qr.svelte | |
| parent | 8906099f391acf19f7b8eb91527b027cedd65b5e (diff) | |
| download | coinos-ui-63f1a6780bab85ebb48ca1fc142cc6beaf772faa.tar.gz coinos-ui-63f1a6780bab85ebb48ca1fc142cc6beaf772faa.zip | |
refactoring
Diffstat (limited to 'src/components/Qr.svelte')
| -rw-r--r-- | src/components/Qr.svelte | 19 |
1 files changed, 7 insertions, 12 deletions
diff --git a/src/components/Qr.svelte b/src/components/Qr.svelte index 35146ec3..988faf25 100644 --- a/src/components/Qr.svelte +++ b/src/components/Qr.svelte @@ -1,17 +1,20 @@ <script> + import screenfull from 'screenfull'; import { browser } from '$app/environment'; import { onMount } from 'svelte'; import { copy } from '$lib/utils'; export let image, text, qr, disabled; + let toggle = () => screenfull.toggle(qr.firstChild); + $: update(text); - let update = async (text) => { + let update = async (text, fullscreen) => { if (!(browser && text)) return; let { default: QRCodeStyling } = await import('qr-code-styling'); const qrCode = new QRCodeStyling({ - width: window.screen.width < 640 ? 250 : 300, + width: 300, type: 'canvas', data: text, backgroundOptions: { @@ -35,22 +38,14 @@ }; </script> -<div - bind:this={qr} - on:click={() => { - if (!disabled) copy(text); - }} -/> +<div bind:this={qr} on:click={toggle} /> <style> div { - @apply px-5 - md:px-0 - w-[300px] + @apply w-[300px] h-[300px] rounded-3xl block - md:flex justify-center items-center cursor-pointer |
