minor UI improvements to Verification screen

src/element/Nip5Service.tsx

@@ -183,9 +183,9 @@ export default function Nip5Service(props: Nip05ServiceProps) {
             <LNURLTip invoice={registerResponse?.invoice} show={showInvoice} onClose={() => setShowInvoice(false)} title={`Buying ${handle}@${domain}`} />
             {registerStatus?.paid && <div className="flex f-col">
                 <h4>Order Paid!</h4>
-                Your new NIP-05 handle is: <code>{handle}@{domain}</code>
+                <p>Your new NIP-05 handle is: <code>{handle}@{domain}</code></p>
                 <h3>Account Support</h3>
-                Please make sure to save the following password in order to manage your handle in the future
+                <p>Please make sure to save the following password in order to manage your handle in the future</p>
                 <Copy text={registerStatus.password} />
                 <p>Go to <a href={props.supportLink} target="_blank" rel="noreferrer">account page</a></p>
                 <h4>Activate Now</h4>

src/pages/Verification.css

@@ -0,0 +1,3 @@
+.verification a {
+    color: var(--highlight);
+}

src/pages/Verification.tsx

@@ -1,5 +1,7 @@
 import Nip5Service from "../element/Nip5Service";
 
+import './Verification.css'
+
 export default function VerificationPage() {
     const services = [
         /*{
@@ -20,7 +22,7 @@ export default function VerificationPage() {
     ];
 
     return (
-        <>
+        <div className="verification">
             <h2>Get Verified</h2>
             <p>
                 NIP-05 is a DNS based verification spec which helps to validate you as a real user.
@@ -33,6 +35,6 @@ export default function VerificationPage() {
             </ul>
 
             {services.map(a => <Nip5Service key={a.name} {...a} />)}
-        </>
+        </div>
     )
 }