Render markdown correctly in text post previews by using selftext_html. (#335)

* Render markdown correctly in text post previews by using selftext_html.

I was mistakenly under the impression that we somehow render markdown ourselves, but turns out we just take whatever HTML reddit gives us, and we also need to do this for text previews.

Use CSS to limit the size of the previews instead of truncating in the template.

Fix table CSS.

* Fix post_body padding and trim post_previews

Co-authored-by: spikecodes <19519553+spikecodes@users.noreply.github.com>
This commit is contained in:
mikupls 2021-11-22 00:17:52 +01:00 committed by GitHub
parent 2ef7957a66
commit 768820cd4c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 6 additions and 8 deletions

View File

@ -251,11 +251,8 @@ 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"));
// selftext_html is set for text posts when browsing.
let mut body = rewrite_urls(&val(post, "selftext_html"));
if body == "" {
body = rewrite_urls(&val(post, "body_html"))
}

View File

@ -838,14 +838,16 @@ a.search_subreddit:hover {
.post_body {
opacity: 0.9;
font-weight: normal;
padding: 5px 15px;
padding: 5px 15px 5px 12px;
grid-area: post_body;
width: calc(100% - 30px);
}
/* Used only for text post preview */
.post_preview {
mask-image: linear-gradient(180deg,#000 60%,transparent);
opacity: 0.8;
max-height: 250px;
}
.post_footer {
@ -1223,7 +1225,6 @@ input[type="submit"] {
.md table {
margin: 5px;
display: block;
overflow-x: auto;
}

View File

@ -132,7 +132,7 @@
<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) }}
{{ post.body }}
</div>
<div class="post_footer">
<a href="{{ post.permalink }}" class="post_comments" title="{{ post.comments.1 }} comments">{{ post.comments.0 }} comments</a>