From 754f88a44854403284ba5c023666749a129f03ef Mon Sep 17 00:00:00 2001 From: Zed Date: Wed, 10 Jun 2020 17:04:48 +0200 Subject: [PATCH] Show avatars in quotes, improve css --- src/sass/profile/_base.scss | 4 ++++ src/sass/tweet/_base.scss | 13 ++++++++----- src/sass/tweet/quote.scss | 11 ++++++----- src/views/tweet.nim | 10 +++++++--- 4 files changed, 25 insertions(+), 13 deletions(-) diff --git a/src/sass/profile/_base.scss b/src/sass/profile/_base.scss index 4e069af..23ac4f2 100644 --- a/src/sass/profile/_base.scss +++ b/src/sass/profile/_base.scss @@ -57,6 +57,10 @@ .timeline-container { width: 100% !important; + + .tab-item wide { + flex-grow: 1.4; + } } } diff --git a/src/sass/tweet/_base.scss b/src/sass/tweet/_base.scss index b009f7b..e9012a1 100644 --- a/src/sass/tweet/_base.scss +++ b/src/sass/tweet/_base.scss @@ -96,14 +96,17 @@ border-radius: 50%; } +.avatar.mini { + margin-right: 5px; + margin-top: -1px; + width: 20px; + height: 20px; +} + .attribution { display: flex; pointer-events: all; - margin: 10px 0; - - .avatar { - margin-right: 5px; - } + margin: 5px 0; strong { color: var(--fg_color); diff --git a/src/sass/tweet/quote.scss b/src/sass/tweet/quote.scss index e84add1..718c904 100644 --- a/src/sass/tweet/quote.scss +++ b/src/sass/tweet/quote.scss @@ -19,23 +19,24 @@ } .tweet-name-row { - padding: 4px 6px; + padding: 6px 8px; + margin-top: 1px; } .quote-text { overflow: hidden; white-space: pre-wrap; word-wrap: break-word; - padding: 0px 6px 6px 6px; + padding: 0px 8px 8px 8px; } .show-thread { - padding: 0px 6px 3px 6px; - margin-top: -3px; + padding: 0px 8px 6px 8px; + margin-top: -6px; } .replying-to { - padding: 0px 6px; + padding: 0px 8px; margin: unset; } } diff --git a/src/views/tweet.nim b/src/views/tweet.nim index 900d243..337c0fb 100644 --- a/src/views/tweet.nim +++ b/src/views/tweet.nim @@ -10,6 +10,11 @@ proc getSmallPic(url: string): string = result &= ":small" result = getPicUrl(result) +proc renderMiniAvatar(profile: Profile): VNode = + let url = getPicUrl(profile.getUserpic("_mini")) + buildHtml(): + img(class="avatar mini", src=url) + proc renderHeader(tweet: Tweet; retweet=""): VNode = buildHtml(tdiv): if retweet.len > 0: @@ -189,9 +194,8 @@ proc renderReply(tweet: Tweet): VNode = a(href=("/" & u)): text "@" & u proc renderAttribution(profile: Profile): VNode = - let avatarUrl = getPicUrl(profile.getUserpic("_200x200")) buildHtml(a(class="attribution", href=("/" & profile.username))): - img(class="avatar", width="20", height="20", src=avatarUrl) + renderMiniAvatar(profile) strong: text profile.fullname proc renderMediaTags(tags: seq[Profile]): VNode = @@ -207,7 +211,6 @@ proc renderQuoteMedia(quote: Tweet; prefs: Prefs; path: string): VNode = buildHtml(tdiv(class="quote-media-container")): if quote.photos.len > 0: renderAlbum(quote) - # genImg(quote.photos[0]) elif quote.video.isSome: renderVideo(quote.video.get(), prefs, path) elif quote.gif.isSome: @@ -227,6 +230,7 @@ proc renderQuote(quote: Tweet; prefs: Prefs; path: string): VNode = tdiv(class="tweet-name-row"): tdiv(class="fullname-and-username"): + renderMiniAvatar(quote.profile) linkUser(quote.profile, class="fullname") linkUser(quote.profile, class="username")