some styling for create link form

src/Link.js

@@ -67,7 +67,7 @@ function orderedUnique(array) {
 }
 
 export class Link {
-	static parseFragment(fragment) {
+	static parse(fragment) {
 		if (!fragment) {
 			return null;
 		}

src/RootViewModel.js

@@ -49,7 +49,7 @@ export class RootViewModel extends ViewModel {
 
 	updateHash(hash) {
 		const oldLink = this.link;
-		this.link = Link.parseFragment(hash);
+		this.link = Link.parse(hash);
 		this._updateChildVMs(oldLink);
 	}
 

src/create/CreateLinkView.js

@@ -20,14 +20,28 @@ import {PreviewView} from "../preview/PreviewView.js";
 export class CreateLinkView extends TemplateView {
 	render(t, vm) {
 		return t.div({className: "CreateLinkView card"}, [
+			t.h1(
+				{className: {hidden: vm => vm.previewViewModel}},
+				"Create shareable links to Matrix rooms, users or messages without being tied to any app"
+			),
 			t.mapView(vm => vm.previewViewModel, childVM => childVM ? new PreviewView(childVM) : null),
 			t.h2({className: {hidden: vm => !vm.linkUrl}}, t.a({href: vm => vm.linkUrl}, vm => vm.linkUrl)),
-			t.div(t.input({
-				className: "fullwidth",
-				type: "text",
-				onChange: evt => vm.createLink(evt.target.value),
-				placeholder: "#room:example.com, @user:example.com"
-			})),
+			t.form({action: "#", onSubmit: evt => this._onSubmit(evt)}, [
+				t.div(t.input({
+					className: "fullwidth large",
+					type: "text",
+					name: "identifier",
+					placeholder: "#room:example.com, @user:example.com"
+				})),
+				t.div(t.input({className: "primary fullwidth", type: "submit", value: "Create link"}))
+			]),
 		]);
 	}
+
+	_onSubmit(evt) {
+		evt.preventDefault();
+		const form = evt.target;
+		const identifier = form.elements.identifier.value;
+		this.value.createLink(identifier);
+	}
 }

src/create/CreateLinkViewModel.js

@@ -25,7 +25,7 @@ export class CreateLinkViewModel extends ViewModel {
 	}
 
     async createLink(identifier) {
-        this._link = Link.parseFragment(identifier);
+        this._link = Link.parse(identifier);
         if (this._link) {
         	// TODO: abort previous load
         	this.previewViewModel = new PreviewViewModel(this.childOptions({
@@ -34,6 +34,8 @@ export class CreateLinkViewModel extends ViewModel {
         	}));
         	this.emitChange();
         	await this.previewViewModel.load();
+        } else {
+        	this.previewViewModel = null;
         }
         this.emitChange();
     }