diff options
| author | Vincent Ambo <mail@tazj.in> | 2018-05-22T08·17+0200 |
|---|---|---|
| committer | Vincent Ambo <github@tazj.in> | 2018-05-22T08·37+0200 |
| commit | d90dc2d77fd813257e24a45456cb6b10791999e6 (patch) | |
| tree | be95c6b21fbc96232a4a9a5c19bf51b512759bb3 | |
| parent | ff697ff7925066dcad27f383e0cd1a76d2342b80 (diff) | |
fix(templates): Fix layout of user info on desktop view
| -rw-r--r-- | static/styles.css | 10 | ||||
| -rw-r--r-- | templates/thread.html | 5 |
2 files changed, 10 insertions, 5 deletions
diff --git a/static/styles.css b/static/styles.css index b2a16b7a6473..b57fd899ea8d 100644 --- a/static/styles.css +++ b/static/styles.css @@ -95,10 +95,16 @@ html, body { max-width: 860px; } .converse .mdl-card .avatar-card { - margin-left: auto; - margin-right: auto; + display: flex; + flex-direction: column; + text-align: center; margin-top: 30px; } +.desktop-avatar { + width: 80px; + margin-right: auto; + margin-left: auto; +} .mobile-avatar { width: 30px; border-radius: 8px; diff --git a/templates/thread.html b/templates/thread.html index c3902a456f9b..bd6d031bc2ba 100644 --- a/templates/thread.html +++ b/templates/thread.html @@ -38,9 +38,8 @@ {# card to display avatars on desktop #} <div class="mdl-card mdl-shadow--2dp mdl-cell--2-col mdl-cell--hide-phone mdl-cell--hide-tablet avatar-box"> <div class="avatar-card"> - <img src="https://www.gravatar.com/avatar/{{ post.author_gravatar }}?d=monsterid&s=160" style="width: 80px;"/> - <br> - <span class="user-name">{{ post.author_name }}</span> + <img class="desktop-avatar" src="https://www.gravatar.com/avatar/{{ post.author_gravatar }}?d=monsterid&s=160" /> + <p class="user-name">{{ post.author_name }}</p> </div> </div> {# card for main post content #} |