Display lines between threads

This commit is contained in:
Zed 2019-06-25 12:57:19 +02:00
parent 13dc5efcf6
commit 0155607ed3
3 changed files with 28 additions and 8 deletions

View file

@ -25,7 +25,6 @@ is on implementing missing features.
## Todo (roughly in this order)
- Line connecting posts in threads
- "Show Thread" button
- Twitter "Cards" (link previews)
- Nitter link previews

View file

@ -472,11 +472,29 @@ nav {
letter-spacing: .01em;
}
.thread {
.reply {
background-color: #161616;
margin-bottom: 10px;
}
.after-tweet .status-el::before, .before-tweet .status-el::before, .thread .status-el::before {
background: #8a3731;
content: '';
position: relative;
width: 3px;
left: 26px;
top: 56px;
margin-bottom: 37px;
margin-left: -3px;
border-radius: 2px;
}
.thread-last .status-el::before {
background: unset;
width: 0;
margin: 0;
}
.panel {
margin: auto;
font-size: 130%;

View file

@ -113,13 +113,15 @@
#end for
</div>
#end if
#let afterClass = if conversation.after.len > 0: "thread" else: ""
<div class="main-tweet">
${renderTweet(conversation.tweet)}
${renderTweet(conversation.tweet, class=afterClass)}
</div>
#if conversation.after.len > 0:
<div class="after-tweet">
#for tweet in conversation.after:
${renderTweet(tweet)}
#for i, tweet in conversation.after:
#let class = if i == conversation.after.high: "thread-last" else: ""
${renderTweet(tweet, class=class)}
#end for
</div>
#end if
@ -127,9 +129,10 @@
#if conversation.replies.len > 0:
<div class="replies">
#for thread in conversation.replies:
<div class="thread">
#for tweet in thread:
${renderTweet(tweet)}
<div class="reply thread">
#for i, tweet in thread:
#let class = if i == thread.high: "thread-last" else: ""
${renderTweet(tweet, class=class)}
#end for
</div>
#end for