fix: standardize header width

This commit is contained in:
vilm3r
2022-06-23 11:08:34 -05:00
parent 6136599cac
commit f17c4b8a1d

View File

@@ -37,63 +37,65 @@ export default function Settings() {
/>
</Head>
<div className="bg-custom-green-dark min-h-screen">
<div className="p-5 max-w-[80rem] m-auto">
<Header />
<main className="max-w-[64rem] m-auto">
<Card>
<div className="max-w-[30rem] m-auto p-10">
<h2 className="text-2xl pb-5">Relays</h2>
<ul>
{settings.relays.map((relay) => (
<li key={relay.url}>
<div className="m-auto flex items-center pb-3">
<Toggle
checked={relay.enabled}
onChange={() => {
toggleRelay(relay.url)
setSettings({
...settings,
relays: getRelays(),
})
}}
/>
<label className="lg:text-lg flex-grow text-center p-2 truncate">
{relay.url}
</label>
<button
onClick={() => {
removeRelay(relay.url)
setSettings({
...settings,
relays: getRelays(),
})
}}
>
<MdDelete className="text-2xl" />
</button>
</div>
</li>
))}
</ul>
<Input className="pt-5" ref={newPool} placeholder="Relay url" />
<Button
className="pt-5"
onClick={() => {
addRelay({
url: newPool?.current?.value || "",
enabled: true,
})
setSettings({
...settings,
relays: getRelays(),
})
}}
>
Add Relay
</Button>
</div>
</Card>
</main>
<div className="p-5">
<div className="max-w-[80rem] mx-auto">
<Header />
<main className="max-w-[64rem] m-auto">
<Card>
<div className="max-w-[30rem] m-auto p-10">
<h2 className="text-2xl pb-5">Relays</h2>
<ul>
{settings.relays.map((relay) => (
<li key={relay.url}>
<div className="m-auto flex items-center pb-3">
<Toggle
checked={relay.enabled}
onChange={() => {
toggleRelay(relay.url)
setSettings({
...settings,
relays: getRelays(),
})
}}
/>
<label className="lg:text-lg flex-grow text-center p-2 truncate">
{relay.url}
</label>
<button
onClick={() => {
removeRelay(relay.url)
setSettings({
...settings,
relays: getRelays(),
})
}}
>
<MdDelete className="text-2xl" />
</button>
</div>
</li>
))}
</ul>
<Input className="pt-5" ref={newPool} placeholder="Relay url" />
<Button
className="pt-5"
onClick={() => {
addRelay({
url: newPool?.current?.value || "",
enabled: true,
})
setSettings({
...settings,
relays: getRelays(),
})
}}
>
Add Relay
</Button>
</div>
</Card>
</main>
</div>
</div>
</div>
</>