aljaz/connect
1
1
Fork 0
mirror of https://github.com/nostr-connect/connect.git synced 2025-12-17 05:04:20 +01:00
Code Issues Packages Projects Releases Wiki Activity

bg white and includeMargin

Browse Source
This commit is contained in:
tiero
2023-12-06 19:52:12 +01:00
parent 6ae464b85c
commit cc43ada5e7
1 changed files with 9 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
example/index.tsx
View File

@@ -6,9 +6,9 @@ import * as ReactDOM from 'react-dom';
import { broadcastToRelay, Connect, connectToRelay, ConnectURI } from '@nostr-connect/connect'; import { broadcastToRelay, Connect, connectToRelay, ConnectURI } from '@nostr-connect/connect';
import { QRCodeSVG } from 'qrcode.react'; import { QRCodeSVG } from 'qrcode.react';
import { getEventHash, getPublicKey, Event } from 'nostr-tools'; import { getEventHash, getPublicKey, generatePrivateKey, Event } from 'nostr-tools';
const secretKey = "5acff99d1ad3e1706360d213fd69203312d9b5e91a2d5f2e06100cc6f686e5b3"; const secretKey = generatePrivateKey();
const connectURI = new ConnectURI({ const connectURI = new ConnectURI({
target: getPublicKey(secretKey), target: getPublicKey(secretKey),
relay: 'wss://nostr.vulpem.com', relay: 'wss://nostr.vulpem.com',
@@ -161,21 +161,21 @@ const App = () => {
} }
return ( return (
<div className='hero is-fullheight has-background-black has-text-white'> <div className='hero is-fullheight has-text-dark'>
<section className="container"> <section className="container">
<div className='content'> <div className='content'>
<h1 className='title has-text-white'>Nostr Connect Playground</h1> <h1 className='title'>Nostr Connect Playground</h1>
</div> </div>
<div className='content'> <div className='content'>
<p className='subtitle is-6 has-text-white'><b>Nostr ID</b> {getPublicKey(secretKey)}</p> <p className='subtitle is-6'><b>Nostr ID</b> {getPublicKey(secretKey)}</p>
</div> </div>
<div className='content'> <div className='content'>
<p className='subtitle is-6 has-text-white'><b>Status</b> {isConnected() ? '🟢 Connected' : '🔴 Disconnected'}</p> <p className='subtitle is-6'><b>Status</b> {isConnected() ? '🟢 Connected' : '🔴 Disconnected'}</p>
</div> </div>
{ {
isConnected() && <div className='content'> isConnected() && <div className='content'>
<button className='button is-danger' onClick={disconnect}> <button className='button is-danger' onClick={disconnect}>
<p className='subtitle is-6 has-text-white'>💤 <i>Disconnect</i></p> <p className='subtitle is-6'>💤 <i>Disconnect</i></p>
</button> </button>
</div> </div>
} }
@@ -183,7 +183,8 @@ const App = () => {
<div className='notification is-dark'> <div className='notification is-dark'>
<h2 className='title is-5'>Connect with Nostr</h2> <h2 className='title is-5'>Connect with Nostr</h2>
<QRCodeSVG value={connectURI.toString()} />
<QRCodeSVG value={connectURI.toString()} includeMargin={true} />
<input <input
className='input is-info' className='input is-info'
type='text' type='text'