Display sensitive quotes properly

This commit is contained in:
Zed 2019-06-25 02:58:33 +02:00
parent a098d3ea84
commit 94b2187453
4 changed files with 34 additions and 2 deletions

View file

@ -652,6 +652,7 @@ video {
.quote-media { .quote-media {
display: flex; display: flex;
justify-content: center; justify-content: center;
pointer-events: none;
} }
.quote-media img { .quote-media img {
@ -676,3 +677,22 @@ video {
font-size: 12px; font-size: 12px;
font-weight: bold; font-weight: bold;
} }
.quote-sensitive {
background: #353535;
width: 102px;
height: 102px;
border-radius: 12px;
display: flex;
justify-content: center;
align-items: center;
}
.quote-sensitive-icon {
font-size: 25px;
width: 37px;
height: 32px;
background-color: #4e4e4e;
padding-bottom: 5px;
margin: 0;
}

View file

@ -135,6 +135,11 @@ proc getTweetMedia*(tweet: Tweet; node: XmlNode) =
tweet.video = some(Video()) tweet.video = some(Video())
proc getQuoteMedia*(quote: var Quote; node: XmlNode) = proc getQuoteMedia*(quote: var Quote; node: XmlNode) =
let sensitive = node.querySelector(".QuoteTweet--sensitive")
if not sensitive.isNil:
quote.sensitive = true
return
let media = node.querySelector(".QuoteMedia") let media = node.querySelector(".QuoteMedia")
if not media.isNil: if not media.isNil:
quote.thumb = some(media.selectAttr("img", "src")) quote.thumb = some(media.selectAttr("img", "src"))

View file

@ -48,6 +48,7 @@ type
profile*: Profile profile*: Profile
link*: string link*: string
text*: string text*: string
sensitive*: bool
thumb*: Option[string] thumb*: Option[string]
badge*: Option[string] badge*: Option[string]

View file

@ -30,19 +30,25 @@
#end proc #end proc
# #
#proc renderQuote(quote: Quote): string = #proc renderQuote(quote: Quote): string =
#let hasMedia = quote.thumb.isSome() #let hasMedia = quote.thumb.isSome() or quote.sensitive
<div class="quote"> <div class="quote">
<div class="quote-container" href="${quote.link}"> <div class="quote-container" href="${quote.link}">
<a class="quote-link" href="${quote.link}"></a> <a class="quote-link" href="${quote.link}"></a>
#if hasMedia: #if hasMedia:
<div class="quote-media-container"> <div class="quote-media-container">
<div class="quote-media"> <div class="quote-media">
#if quote.thumb.isSome():
<img src=${quote.thumb.get().getSigUrl("pic")}> <img src=${quote.thumb.get().getSigUrl("pic")}>
#if quote.badge.isSome: #if quote.badge.isSome():
<div class="quote-badge"> <div class="quote-badge">
<div class="quote-badge-text">${quote.badge.get()}</div> <div class="quote-badge-text">${quote.badge.get()}</div>
</div> </div>
#end if #end if
#elif quote.sensitive:
<div class="quote-sensitive">
<span class="icon quote-sensitive-icon">❗</span>
</div>
#end if
</div> </div>
</div> </div>
#end if #end if