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) ## Todo (roughly in this order)
- Line connecting posts in threads
- "Show Thread" button - "Show Thread" button
- Twitter "Cards" (link previews) - Twitter "Cards" (link previews)
- Nitter link previews - Nitter link previews

View file

@ -472,11 +472,29 @@ nav {
letter-spacing: .01em; letter-spacing: .01em;
} }
.thread { .reply {
background-color: #161616; background-color: #161616;
margin-bottom: 10px; 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 { .panel {
margin: auto; margin: auto;
font-size: 130%; font-size: 130%;

View file

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