diff --git a/app.json b/app.json index 8573671..fd41fc8 100644 --- a/app.json +++ b/app.json @@ -32,6 +32,9 @@ "LIBREDDIT_DEFAULT_SHOW_NSFW": { "required": false }, + "LIBREDDIT_DEFAULT_BLUR_NSFW": { + "required": false + }, "LIBREDDIT_USE_HLS": { "required": false }, diff --git a/src/settings.rs b/src/settings.rs index 9cdd266..0fd2640 100644 --- a/src/settings.rs +++ b/src/settings.rs @@ -19,7 +19,7 @@ struct SettingsTemplate { // CONSTANTS -const PREFS: [&str; 10] = [ +const PREFS: [&str; 11] = [ "theme", "front_page", "layout", @@ -27,6 +27,7 @@ const PREFS: [&str; 10] = [ "comment_sort", "post_sort", "show_nsfw", + "blur_nsfw", "use_hls", "hide_hls_notification", "autoplay_videos", diff --git a/src/utils.rs b/src/utils.rs index a458cd8..0f15537 100644 --- a/src/utils.rs +++ b/src/utils.rs @@ -462,6 +462,7 @@ pub struct Preferences { pub layout: String, pub wide: String, pub show_nsfw: String, + pub blur_nsfw: String, pub hide_hls_notification: String, pub use_hls: String, pub autoplay_videos: String, @@ -493,6 +494,7 @@ impl Preferences { layout: setting(&req, "layout"), wide: setting(&req, "wide"), show_nsfw: setting(&req, "show_nsfw"), + blur_nsfw: setting(&req, "blur_nsfw"), use_hls: setting(&req, "use_hls"), hide_hls_notification: setting(&req, "hide_hls_notification"), autoplay_videos: setting(&req, "autoplay_videos"), diff --git a/static/style.css b/static/style.css index 1552c22..ba07fc2 100644 --- a/static/style.css +++ b/static/style.css @@ -716,22 +716,39 @@ a.search_subreddit:hover { font-weight: bold; } -.post_media_image, .post .__NoScript_PlaceHolder__, .post_media_video, .gallery { +.post_media_content, .post .__NoScript_PlaceHolder__, .gallery { max-width: calc(100% - 40px); grid-area: post_media; margin: 15px auto 5px auto; + width: auto; height: auto; + overflow: hidden; } - -.post_media_video.short { - max-height: 512px; +.post_media_video { width: auto; + height: auto; + max-width: 100%; + max-height: 512px; + display: block; + margin: auto; } .post_media_image.short svg, .post_media_image.short img{ - max-height: 512px; width: auto; + height: auto; + max-width: 100%; + max-height: 512px; + display: block; + margin: auto; +} + +.post_nsfw_blur { + filter: blur(1.5rem); +} + +.post_nsfw_blur:hover { + filter: none; } .post_media_image svg{ @@ -827,13 +844,25 @@ a.search_subreddit:hover { margin: 5px; } -.post_thumbnail svg { +.post_thumbnail div { grid-area: 1 / 1 / 2 / 2; - width: 100%; - height: auto; object-fit: cover; align-self: center; justify-self: center; + overflow: hidden; +} + +.post_thumbnail div svg { + width: 100%; + height: auto; +} + +.post_thumbnail span { + z-index: 0; +} + +.thumb_nsfw_blur { + filter: blur(0.3rem) } .post_thumbnail.no_thumbnail { diff --git a/templates/post.html b/templates/post.html index e447eb3..8f12131 100644 --- a/templates/post.html +++ b/templates/post.html @@ -68,27 +68,33 @@ {% if post.post_type == "image" %} - - - +
Note: settings and subscriptions are saved in browser cookies. Clearing your cookies will reset them.
You can restore your current settings and subscriptions after clearing your cookies using this link.
+You can restore your current settings and subscriptions after clearing your cookies using this link.