Better presentation, clear on resubmit

src/App.css

@@ -32,3 +32,9 @@ body {
 .App .Main form * {
   margin: 0 5px;
 }
+
+.App .Main ul {
+  text-align: left;
+  width: 50%;
+  margin: 0 auto;
+}

src/App.js

@@ -1,7 +1,7 @@
 import React from 'react';
 
 import { 
-  Heading, IconButton, StarIcon, Pane, TextInput, Text, Spinner, Textarea
+  Heading, IconButton, StarIcon, Pane, TextInput, Text, Spinner, Textarea, ListItem, UnorderedList
 } from 'evergreen-ui'
 
 import './App.css';
@@ -19,6 +19,7 @@ class Form extends React.Component {
     event.preventDefault();
     this.setState({
       loading: true,
+      name: null
     });
 
     if (!event.target.checkValidity()) {
@@ -50,15 +51,11 @@ class Form extends React.Component {
       meetingid: data_id.id,
       phone: data_numbers.numbers.UK,
       loading: false,
-      str: `Notes: https://pad.riseup.net/p/${name}
-        Computer / app: https://meet.jit.si/${name}
-        Phone: ${data_numbers.numbers.UK}
-        PIN: ${data_id.id}`
     })
   }
 
   render() {
-  	const { str, name, meetingid, invalid, phone, loading, displayErrors } = this.state;
+  	const { name, meetingid, invalid, phone, loading, displayErrors } = this.state;
     return (
     	<div>
         <form
@@ -86,9 +83,22 @@ class Form extends React.Component {
             <Spinner marginX="auto" />
           )}
           {!invalid && name && (
-          	<Pane>
+          	<Pane className="center">
               <h3>Copy Pasta</h3>
-              <Textarea value={str} />
+              <UnorderedList size={500}>
+                <ListItem>
+                  Notes: https://pad.riseup.net/p/{name}
+                </ListItem>
+                <ListItem>
+                  Computer / app: https://meet.jit.si/{name}
+                </ListItem>
+                <ListItem>
+                  Phone: {phone}
+                </ListItem>
+                <ListItem>
+                  PIN: {meetingid}
+                </ListItem>
+              </UnorderedList>
           	</Pane>
           )}
         </div>