Apply some way sexier styling to the profiles section of the h-card

templates/hcard.cassius

@@ -1,7 +1,14 @@
 .card.h-card
   margin: 2em auto
   width: 22rem
-  .u-uid.u-url:first-child
-    display: none
-  .card-link
-    white-space: nowrap
+
+  ul.profiles
+    list-style: none
+    padding-left: 0
+    margin-bottom: 0
+    text-align: center
+    > li
+      display: inline-block
+      margin-right: 5px
+      &:last-child
+        margin-right: 0

templates/hcard.hamlet

@@ -1,6 +1,6 @@
 <div .card.h-card>
   $maybe route <- mcurrentRoute
-    <a .u-uid.u-url rel="me" href=@{route}>
+    <a .u-uid.u-url rel="me" href=@{route} hidden>
 
   $maybe avatar <- maybeAvatar
     <img .card-img-top.u-photo src=#{avatar} alt="Avatar for #{userFullName user}">
@@ -13,10 +13,14 @@
         #{prettyPgp key}
         <link rel="pgpkey" type="application/pgp-keys" href=@{routeFromPgp key}>
     <p .card-text.p-note .text-muted>#{userNote user}
-    <a .card-link.u-email rel="me" href="mailto:#{userEmail user}">
+
+    <ul .profiles>
+      <li>
+        <a .u-email rel="me" href="mailto:#{userEmail user}">
           <i .fa.fa-envelope>
           #{userEmail user}
       $forall (site, profile) <- userProfiles
-      <a .card-link.u-url rel="me" href="#{siteUrl site}#{profileUsername profile}">
+        <li>
+          <a .u-url rel="me" href="#{siteUrl site}#{profileUsername profile}">
             <i .fa.fa-#{siteIcon site}>
             #{profileUsername profile}