update qr skeleton

This commit is contained in:
keyan 2024-04-16 16:05:59 -05:00
parent 1a25179a98
commit 02fe4d5d92
1 changed files with 5 additions and 1 deletions

View File

@ -3,6 +3,7 @@ import { CopyInput, InputSkeleton } from './form'
import InvoiceStatus from './invoice-status' import InvoiceStatus from './invoice-status'
import { useEffect } from 'react' import { useEffect } from 'react'
import { useWebLN } from './webln' import { useWebLN } from './webln'
import SimpleCountdown from './countdown'
export default function Qr ({ asIs, value, webLn, statusVariant, description, status }) { export default function Qr ({ asIs, value, webLn, statusVariant, description, status }) {
const qrValue = asIs ? value : 'lightning:' + value.toUpperCase() const qrValue = asIs ? value : 'lightning:' + value.toUpperCase()
@ -42,11 +43,14 @@ export function QrSkeleton ({ status, description }) {
return ( return (
<> <>
<div className='h-auto mx-auto w-100 clouds' style={{ paddingTop: 'min(300px, 100%)', maxWidth: 'calc(300px)' }} /> <div className='h-auto mx-auto w-100 clouds' style={{ paddingTop: 'min(300px, 100%)', maxWidth: 'calc(300px)' }} />
{description && <div className='mt-1 fst-italic text-center text-muted invisible'>.</div>} {description && <div className='mt-1 fst-italic text-center text-muted invisible'>i'm invisible</div>}
<div className='my-3 w-100'> <div className='my-3 w-100'>
<InputSkeleton /> <InputSkeleton />
</div> </div>
<InvoiceStatus variant='default' status={status} /> <InvoiceStatus variant='default' status={status} />
<div className='text-muted text-center invisible'>
<SimpleCountdown date={Date.now()} />
</div>
</> </>
) )
} }