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

This commit is contained in:
Danielle McLean 2017-10-04 16:01:07 +11:00
parent ad6d783dea
commit 332d5f9953
Signed by: 00dani
GPG key ID: 5A5D2D1AFF12EEC5
2 changed files with 23 additions and 12 deletions

View file

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

View file

@ -1,6 +1,6 @@
<div .card.h-card> <div .card.h-card>
$maybe route <- mcurrentRoute $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 $maybe avatar <- maybeAvatar
<img .card-img-top.u-photo src=#{avatar} alt="Avatar for #{userFullName user}"> <img .card-img-top.u-photo src=#{avatar} alt="Avatar for #{userFullName user}">
@ -13,10 +13,14 @@
#{prettyPgp key} #{prettyPgp key}
<link rel="pgpkey" type="application/pgp-keys" href=@{routeFromPgp key}> <link rel="pgpkey" type="application/pgp-keys" href=@{routeFromPgp key}>
<p .card-text.p-note .text-muted>#{userNote user} <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> <i .fa.fa-envelope>
#{userEmail user} #{userEmail user}
$forall (site, profile) <- userProfiles $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}> <i .fa.fa-#{siteIcon site}>
#{profileUsername profile} #{profileUsername profile}