polish

src/open/ClientView.js

@@ -43,7 +43,11 @@ export class ClientView extends TemplateView {
 			t.div({className: "header"}, [
 				t.div({className: "description"}, [
 					t.h3(vm.name),
-					t.p(vm.description),
+					t.p([vm.description, " ", t.a({
+                        href: vm.homepage,
+                        target: "_blank",
+                        rel: "noopener noreferrer"
+                    }, "Learn more")]),
 					t.p({className: "platforms"}, formatPlatforms(vm.availableOnPlatformNames)),
 				]),
 				t.img({className: "clientIcon", src: vm.iconUrl})
@@ -80,6 +84,8 @@ class InstallClientView extends TemplateView {
 		if (textInstructions) {
             const copyButton = t.button({
                 className: "copy",
+                title: "Copy instructions",
+                "aria-label": "Copy instructions",
                 onClick: evt => {
                     if (copy(vm.copyString, copyButton.parentElement)) {
                         copyButton.className = "tick";
@@ -131,9 +137,8 @@ class InstallClientView extends TemplateView {
 }
 
 function showBack(t, vm) {
-    return t.p({className: {previewSource: true, hidden: vm => !vm.showBack}}, [
-        `Continue with ${vm.name}.`,
-        " ",
+    return t.p({className: {caption: true, "back": true, hidden: vm => !vm.showBack}}, [
+        `Continue with ${vm.name} · `,
         t.button({className: "text", onClick: () => vm.back()}, "Change"),
     ]);
 }

src/open/ClientViewModel.js

@@ -76,6 +76,10 @@ export class ClientViewModel extends ViewModel {
 		return actions;
 	}
 
+    get homepage() {
+        return this._client.homepage;
+    }
+
 	get identifier() {
 		return this._link.identifier;
 	}
@@ -102,7 +106,7 @@ export class ClientViewModel extends ViewModel {
 
 	get textInstructions() {
         let instructions = this._client.getLinkInstructions(this._proposedPlatform, this._link);
-        if (!Array.isArray(instructions)) {
+        if (instructions && !Array.isArray(instructions)) {
             instructions = [instructions];
         }
 		return instructions;

src/open/OpenLinkView.js

@@ -35,9 +35,9 @@ class ShowLinkView extends TemplateView {
         return t.div([
             t.view(new PreviewView(vm.previewViewModel)),
             t.view(new ClientListView(vm.clientsViewModel)),
-            t.p({className: {previewSource: true, hidden: vm => !vm.previewDomain}}, [
-                vm => vm.previewFailed ? `${vm.previewDomain} has not returned a preview.` : `Preview provided by ${vm.previewDomain}.`,
-                " ",
+            t.p({className: {caption: true, hidden: vm => !vm.previewDomain}}, [
+                vm => vm.previewFailed ? `${vm.previewDomain} has not returned a preview.` : `Preview provided by ${vm.previewDomain}`,
+                " · ",
                 t.button({className: "text", onClick: () => vm.changeServer()}, "Change"),
             ]),
         ]);

src/open/clients/Element.js

@@ -40,7 +40,7 @@ export class Element {
 	get name() {return "Element"; }
 	get description() { return 'Fully-featured Matrix client, used by millions.'; }
 
-	get homepage() { return ; } // prevents a visit app homepage button from appearing
+	get homepage() { return "https://element.io"; }
 	get author() { return "Element"; }
 
 	getMaturity(platform) { return Maturity.Stable; }