feat: add spoiler badge to post title

This commit is contained in:
pimlie 2024-06-22 12:38:13 +02:00
parent 3301da1ef1
commit 1d44bd180e
2 changed files with 13 additions and 1 deletions

View File

@ -52,6 +52,7 @@
--visited: #aaa; --visited: #aaa;
--shadow: 0 1px 3px rgba(0, 0, 0, 0.5); --shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
--popup: #b80a27; --popup: #b80a27;
--spoiler: #ddd;
/* Hint color theme to browser for scrollbar */ /* Hint color theme to browser for scrollbar */
color-scheme: dark; color-scheme: dark;
@ -71,6 +72,7 @@
--highlighted: white; --highlighted: white;
--visited: #555; --visited: #555;
--shadow: 0 1px 3px rgba(0, 0, 0, 0.1); --shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
--spoiler: #0f0f0f;
/* Hint color theme to browser for scrollbar */ /* Hint color theme to browser for scrollbar */
color-scheme: light; color-scheme: light;
@ -929,6 +931,15 @@ a.search_subreddit:hover {
font-weight: bold; font-weight: bold;
} }
.spoiler {
color: var(--spoiler);
margin-left: 5px;
border: 1px solid var(--spoiler);
padding: 3px;
font-size: 12px;
border-radius: 5px;
}
.post_media_content, .post .__NoScript_PlaceHolder__, .gallery { .post_media_content, .post .__NoScript_PlaceHolder__, .gallery {
max-width: calc(100% - 40px); max-width: calc(100% - 40px);
grid-area: post_media; grid-area: post_media;

View File

@ -93,6 +93,7 @@
style="color:{{ post.flair.foreground_color }}; background:{{ post.flair.background_color }};">{% call render_flair(post.flair.flair_parts) %}</a> style="color:{{ post.flair.foreground_color }}; background:{{ post.flair.background_color }};">{% call render_flair(post.flair.flair_parts) %}</a>
{% endif %} {% endif %}
{% if post.flags.nsfw %} <small class="nsfw">NSFW</small>{% endif %} {% if post.flags.nsfw %} <small class="nsfw">NSFW</small>{% endif %}
{% if post.flags.spoiler %} <small class="spoiler">Spoiler</small>{% endif %}
</h1> </h1>
<!-- POST MEDIA --> <!-- POST MEDIA -->
@ -223,7 +224,7 @@
style="color:{{ post.flair.foreground_color }}; background:{{ post.flair.background_color }};" style="color:{{ post.flair.foreground_color }}; background:{{ post.flair.background_color }};"
dir="ltr">{% call render_flair(post.flair.flair_parts) %}</a> dir="ltr">{% call render_flair(post.flair.flair_parts) %}</a>
{% endif %} {% endif %}
<a href="{{ post.permalink }}">{{ post.title }}</a>{% if post.flags.nsfw %} <small class="nsfw">NSFW</small>{% endif %} <a href="{{ post.permalink }}">{{ post.title }}</a>{% if post.flags.nsfw %} <small class="nsfw">NSFW</small>{% endif %}{% if post.flags.spoiler %} <small class="spoiler">Spoiler</small>{% endif %}
</h2> </h2>
<!-- POST MEDIA/THUMBNAIL --> <!-- POST MEDIA/THUMBNAIL -->
{% if (prefs.layout.is_empty() || prefs.layout == "card") && post.post_type == "image" %} {% if (prefs.layout.is_empty() || prefs.layout == "card") && post.post_type == "image" %}