přidám button
This commit is contained in:
parent
3df3035146
commit
837b7804d9
|
@ -6,7 +6,7 @@
|
|||
</script>
|
||||
|
||||
<div class="w-full h-full flex relative overflow-hidden">
|
||||
<div class="h-full w-full absolute flex justify-center gap-8 flex-wrap flex-col items-center bg-[#3A3A3A] p-[12.5%]">
|
||||
<div class="h-full w-full absolute flex justify-center gap-4 flex-wrap flex-col items-center bg-[#3A3A3A] p-[12.5%]">
|
||||
<div class="h-[40vh] w-[40vh] max-w-[75vw] max-h-[75vw] rounded-[20px] bg-white flex justify-center items-center">
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<mask id="mask0_1505_2457" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="2" y="2" width="20" height="20">
|
||||
|
@ -34,7 +34,7 @@
|
|||
/>
|
||||
</svg>
|
||||
</div>
|
||||
<input bind:value type="text" placeholder="The code" class="block p-3 border rounded-[15px] w-full" />
|
||||
<button class="w-[50%] min-w-[200px] rounded-[20px] bg-white z-10 h-14" on:click={() => dispatch('submit', value)}>submit</button>
|
||||
<input bind:value type="text" placeholder="The code" class="block p-3 border rounded-[15px] w-[40vh] max-w-[75vw] mt-4" />
|
||||
<button class="w-[40vh] max-w-[75vw] rounded-[15px] bg-white z-10 h-[52px] bg-[#4263EB] text-white" on:click={() => dispatch('submit', value)}>Continue</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -13,6 +13,7 @@
|
|||
qrbox: { width: (3 / 4) * width, height: (1 / 2) * height },
|
||||
aspectRatio: width / height,
|
||||
}
|
||||
|
||||
// @ts-ignore
|
||||
html5QrCode.start({ facingMode: 'environment' }, config, (text, result) => {
|
||||
html5QrCode.stop()
|
||||
|
|
|
@ -9,12 +9,12 @@
|
|||
</script>
|
||||
|
||||
{#if switched === 'scan'}
|
||||
<div class={'h-[70px] w-[340px] max-w-full bg-[#282828] p-[8px] flex flex-wrap flex-col gap-[8px] rounded-[30px] ' + className}>
|
||||
<div class={'h-[80px] w-[340px] max-w-[95%] bg-[#282828] p-[8px] flex flex-wrap flex-col gap-[8px] rounded-[30px] ' + className}>
|
||||
<button class="rounded-[20px] bg-[#4263EB] text-white h-full"> Scan QR </button>
|
||||
<button on:click={() => (switched = 'input')} class="rounded-[20px] bg-[#282828] text-[#8A8A8A] h-full"> Type in code </button>
|
||||
</div>
|
||||
{:else if switched === 'input'}
|
||||
<div class={'h-[70px] w-[340px] max-w-full bg-[#282828] p-[8px] flex flex-wrap flex-col gap-[8px] rounded-[30px] ' + className}>
|
||||
<div class={'h-[80px] w-[340px] max-w-[95%] bg-[#282828] p-[8px] flex flex-wrap flex-col gap-[8px] rounded-[30px] ' + className}>
|
||||
<button on:click={() => (switched = 'scan')} class="rounded-[20px] bg-[#282828] text-[#8A8A8A] h-full"> Scan QR </button>
|
||||
<button class="rounded-[20px] bg-[#4263EB] text-white h-full"> Type in code </button>
|
||||
</div>
|
||||
|
|
Loading…
Reference in New Issue