iridium/redsunlib
iridium/redsunlib
2
2
Fork 0
Code Issues 2 Pull Requests Packages Projects Releases 4 Wiki Activity

Add text post previews. (#328)

Browse Source 
* Add text post previews.

* Add mask gradient over post preview text

* Increase post title font weight for contrast

Co-authored-by: spikecodes <19519553+spikecodes@users.noreply.github.com>
This commit is contained in:
mikupls 2021-11-20 22:13:50 +01:00 committed by GitHub
parent 3a9e6b4ca0
commit c2053524c7
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 21 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
src/utils.rs
View File

@ -251,11 +251,20 @@ impl Post {
// Determine the type of media along with the media URL
let (post_type, media, gallery) = Media::parse(data).await;
// selftext is set for text posts when browsing a (sub)reddit.
// Do NOT use selftext_html, because we truncate this content
// in the template code, and using selftext_html might result
// in truncated html.
let mut body = rewrite_urls(&val(post, "selftext"));
if body == "" {
body = rewrite_urls(&val(post, "body_html"))
}
posts.push(Self {
id: val(post, "id"),
title: esc!(if title.is_empty() { fallback_title.clone() } else { title }),
community: val(post, "subreddit"),
body: rewrite_urls(&val(post, "body_html")),
body,
author: Author {
name: val(post, "author"),
flair: Flair {

8
static/style.css
View File

@ -722,6 +722,7 @@ a.search_subreddit:hover {
.post_title {
font-size: 16px;
font-weight: 500;
line-height: 1.5;
margin: 5px 15px;
grid-area: post_title;
@ -837,11 +838,16 @@ a.search_subreddit:hover {
.post_body {
opacity: 0.9;
font-weight: normal;
margin: 5px 15px;
padding: 5px 15px;
grid-area: post_body;
width: calc(100% - 30px);
}
.post_preview {
mask-image: linear-gradient(180deg,#000 60%,transparent);
opacity: 0.8;
}
.post_footer {
display: flex;
justify-content: space-between;

4
templates/utils.html
View File

@ -130,6 +130,10 @@
{% endif %}
<div class="post_score" title="{{ post.score.1 }}">{{ post.score.0 }}<span class="label"> Upvotes</span></div>
<div class="post_body post_preview">
<!-- preview of selfposts when browsing subreddits -->
{{ post.body|truncate(1000) }}
</div>
<div class="post_footer">
<a href="{{ post.permalink }}" class="post_comments" title="{{ post.comments.1 }} comments">{{ post.comments.0 }} comments</a>
</div>