forked from coracle/flotilla
Re work modal scrolling
This commit is contained in:
@@ -8,6 +8,8 @@
|
||||
import Button from "@lib/components/Button.svelte"
|
||||
import FieldInline from "@lib/components/FieldInline.svelte"
|
||||
import Scanner from "@lib/components/Scanner.svelte"
|
||||
import Modal from "@lib/components/Modal.svelte"
|
||||
import ModalBody from "@lib/components/ModalBody.svelte"
|
||||
import ModalHeader from "@lib/components/ModalHeader.svelte"
|
||||
import ModalFooter from "@lib/components/ModalFooter.svelte"
|
||||
import {payInvoice} from "@app/core/commands"
|
||||
@@ -48,52 +50,54 @@
|
||||
let sats = $state(0)
|
||||
</script>
|
||||
|
||||
<div class="column gap-4">
|
||||
<ModalHeader>
|
||||
{#snippet title()}
|
||||
<div>Pay with Lightning</div>
|
||||
{/snippet}
|
||||
{#snippet info()}
|
||||
Use your Nostr wallet to send Bitcoin payments over lightning.
|
||||
{/snippet}
|
||||
</ModalHeader>
|
||||
{#if invoice}
|
||||
<div class="card2 bg-alt flex flex-col gap-2">
|
||||
{#if $session?.wallet?.type === "webln" && invoice.satoshi === 0}
|
||||
<p class="text-sm opacity-75">
|
||||
Uh oh! It looks like your current wallet doesn't support invoices without an amount. See
|
||||
if you can get a lightning invoice with a pre-set amount.
|
||||
</p>
|
||||
{:else}
|
||||
<FieldInline>
|
||||
{#snippet label()}
|
||||
Amount (satoshis)
|
||||
{/snippet}
|
||||
{#snippet input()}
|
||||
<div class="flex flex-grow justify-end">
|
||||
<label class="input input-bordered flex items-center gap-2">
|
||||
<Icon icon={Bolt} />
|
||||
<input
|
||||
bind:value={sats}
|
||||
type="number"
|
||||
class="w-14"
|
||||
disabled={invoice!.satoshi > 0} />
|
||||
</label>
|
||||
</div>
|
||||
{/snippet}
|
||||
</FieldInline>
|
||||
<p class="text-sm opacity-75">
|
||||
You're about to pay a bitcoin lightning invoice with the following description:
|
||||
<strong>{invoice.description || "[no description]"}</strong>"
|
||||
</p>
|
||||
{/if}
|
||||
</div>
|
||||
{:else}
|
||||
<Scanner onscan={onScan} />
|
||||
<p class="text-center text-sm opacity-75">
|
||||
To make a payment, scan a lightning invoice with your camera.
|
||||
</p>
|
||||
{/if}
|
||||
<Modal>
|
||||
<ModalBody>
|
||||
<ModalHeader>
|
||||
{#snippet title()}
|
||||
<div>Pay with Lightning</div>
|
||||
{/snippet}
|
||||
{#snippet info()}
|
||||
Use your Nostr wallet to send Bitcoin payments over lightning.
|
||||
{/snippet}
|
||||
</ModalHeader>
|
||||
{#if invoice}
|
||||
<div class="card2 bg-alt flex flex-col gap-2">
|
||||
{#if $session?.wallet?.type === "webln" && invoice.satoshi === 0}
|
||||
<p class="text-sm opacity-75">
|
||||
Uh oh! It looks like your current wallet doesn't support invoices without an amount. See
|
||||
if you can get a lightning invoice with a pre-set amount.
|
||||
</p>
|
||||
{:else}
|
||||
<FieldInline>
|
||||
{#snippet label()}
|
||||
Amount (satoshis)
|
||||
{/snippet}
|
||||
{#snippet input()}
|
||||
<div class="flex flex-grow justify-end">
|
||||
<label class="input input-bordered flex items-center gap-2">
|
||||
<Icon icon={Bolt} />
|
||||
<input
|
||||
bind:value={sats}
|
||||
type="number"
|
||||
class="w-14"
|
||||
disabled={invoice!.satoshi > 0} />
|
||||
</label>
|
||||
</div>
|
||||
{/snippet}
|
||||
</FieldInline>
|
||||
<p class="text-sm opacity-75">
|
||||
You're about to pay a bitcoin lightning invoice with the following description:
|
||||
<strong>{invoice.description || "[no description]"}</strong>"
|
||||
</p>
|
||||
{/if}
|
||||
</div>
|
||||
{:else}
|
||||
<Scanner onscan={onScan} />
|
||||
<p class="text-center text-sm opacity-75">
|
||||
To make a payment, scan a lightning invoice with your camera.
|
||||
</p>
|
||||
{/if}
|
||||
</ModalBody>
|
||||
<ModalFooter>
|
||||
<Button class="btn btn-link" onclick={back}>
|
||||
<Icon icon={AltArrowLeft} />
|
||||
@@ -108,4 +112,4 @@
|
||||
Confirm Payment
|
||||
</Button>
|
||||
</ModalFooter>
|
||||
</div>
|
||||
</Modal>
|
||||
|
||||
Reference in New Issue
Block a user