Add: parse author string

install-usercss/external.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
+  <path d="M4,4h5v2H6v8h8v-3h2v5H4V4z M11,3h6v6l-2-2l-4,4L9,9l4-4L11,3z"></path>
+</svg>

install-usercss/install-usercss.css

@@ -8,6 +8,11 @@ body {
   box-sizing: border-box;
 }
 
+img.icon {
+  height: 1.4em;
+  vertical-align: middle;
+}
+
 .container {
   display: flex;
   height: 100vh;

install-usercss/install-usercss.js

@@ -71,7 +71,8 @@
     $('.meta-description').textContent = data.description;
 
     $('.meta-author').parentNode.style.display = data.author ? '' : 'none';
-    $('.meta-author').textContent = data.author;
+    $('.meta-author').textContent = '';
+    $('.meta-author').appendChild(makeAuthor(data.author));
 
     $('.meta-license').parentNode.style.display = data.license ? '' : 'none';
     $('.meta-license').textContent = data.license;
@@ -87,6 +88,41 @@
       $('.external-link').appendChild(externalLink);
     }
 
+    function makeAuthor(text) {
+      const match = text.match(/^(.+?)(?:\s+<(.+?)>)?(?:\s+\((.+?)\))$/);
+      if (!match) {
+        return document.createTextNode(text);
+      }
+      const [, name, email, url] = match;
+      const frag = document.createDocumentFragment();
+      if (email) {
+        frag.appendChild($element({
+          tag: 'a',
+          textContent: name,
+          href: `mailto:${email}`
+        }));
+      } else {
+        frag.appendChild($element({
+          tag: 'span',
+          textContent: name
+        }));
+      }
+      if (url) {
+        frag.appendChild($element({
+          tag: 'a',
+          href: url,
+          target: '_blank',
+          rel: 'noopener',
+          appendChild: $element({
+            tag: 'img',
+            className: 'icon',
+            src: '/install-usercss/external.svg'
+          })
+        }));
+      }
+      return frag;
+    }
+
     function makeExternalLink() {
       const urls = [];
       if (data.homepageURL) {