Apply some way sexier styling to the profiles section of the h-card
This commit is contained in:
parent
ad6d783dea
commit
332d5f9953
2 changed files with 23 additions and 12 deletions
|
@ -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
|
||||||
|
|
|
@ -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}
|
||||||
|
|
Loading…
Reference in a new issue