Add settings helper for HLS toggle

* 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>

.github/ISSUE_TEMPLATE/feature_parity.md

@@ -0,0 +1,28 @@
+---
+name: ✨ Feature parity
+about: Suggest implementing a feature into Libreddit that is found in Reddit.com
+title: ''
+labels: feature parity
+assignees: ''
+
+---
+
+## How does this feature work on Reddit?
+<!--
+  A clear and concise description of what the feature is.
+-->
+
+## Describe the implementation into Libreddit
+<!--
+  A clear and concise description of what you want to happen.
+-->
+
+## Describe alternatives you've considered
+<!--
+  A clear and concise description of any alternative solutions or features you've considered.
+-->
+
+## Additional context
+<!--
+  Add any other context or screenshots about the feature parity request here.
+-->

.github/ISSUE_TEMPLATE/feature_request.md

@@ -1,6 +1,6 @@
 ---
 name: 💡 Feature request
-about: Suggest an idea for this project
+about: Suggest a feature for Libreddit that is not found in Reddit
 title: ''
 labels: enhancement
 assignees: ''

.github/workflows/rust.yml

@@ -2,9 +2,10 @@ name: Rust
 
 on:
   push:
-    branches: [master]
-  pull_request:
-    branches: [master]
+    paths-ignore:
+      - "**.md"
+    branches:
+      - master
 
 env:
   CARGO_TERM_COLOR: always

.replit

@@ -0,0 +1,2 @@
+run = "while true; do wget -O libreddit https://github.com/spikecodes/libreddit/releases/latest/download/libreddit;chmod +x libreddit;./libreddit -H 63115200;sleep 1;done"
+language = "bash"

Cargo.lock

@@ -125,9 +125,9 @@ checksum = "bef38d45163c2f1dde094a7dfd33ccf595c92905c8f8f4fdc18d06fb1037718a"
 
 [[package]]
 name = "bitvec"
-version = "0.19.5"
+version = "0.19.6"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "8942c8d352ae1838c9dda0b0ca2ab657696ef2232a20147cf1b30ae1a9cb4321"
+checksum = "55f93d0ef3363c364d5976646a38f04cf67cfe1d4c8d160cdea02cab2c116b33"
 dependencies = [
  "funty",
  "radium",
@@ -236,15 +236,6 @@ version = "0.8.3"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "5827cebf4670468b8772dd191856768aedcb1b0278a04f989f7766351917b9dc"
 
-[[package]]
-name = "ct-logs"
-version = "0.8.0"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "c1a816186fa68d9e426e3cb4ae4dff1fcd8e4a2c34b781bf7a822574a0d0aac8"
-dependencies = [
- "sct",
-]
-
 [[package]]
 name = "darling"
 version = "0.13.0"
@@ -496,15 +487,15 @@ checksum = "acd94fdbe1d4ff688b67b04eee2e17bd50995534a61539e45adfefb45e5e5503"
 
 [[package]]
 name = "httpdate"
-version = "1.0.1"
+version = "1.0.2"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "6456b8a6c8f33fee7d958fcd1b60d55b11940a79e63ae87013e6d22e26034440"
+checksum = "c4a1e36c821dbe04574f602848a19f742f4fb3c98d40449f11bcad18d6b17421"
 
 [[package]]
 name = "hyper"
-version = "0.14.14"
+version = "0.14.15"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "2b91bb1f221b6ea1f1e4371216b70f40748774c2fb5971b450c07773fb92d26b"
+checksum = "436ec0091e4f20e655156a30a0df3770fe2900aa301e548e08446ec794b6953c"
 dependencies = [
  "bytes",
  "futures-channel",
@@ -526,19 +517,17 @@ dependencies = [
 
 [[package]]
 name = "hyper-rustls"
-version = "0.22.1"
+version = "0.23.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "5f9f7a97316d44c0af9b0301e65010573a853a9fc97046d7331d7f6bc0fd5a64"
+checksum = "d87c48c02e0dc5e3b849a2041db3029fd066650f8f717c07bf8ed78ccb895cac"
 dependencies = [
- "ct-logs",
- "futures-util",
+ "http",
  "hyper",
  "log",
  "rustls",
  "rustls-native-certs",
  "tokio",
  "tokio-rustls",
- "webpki",
 ]
 
 [[package]]
@@ -613,13 +602,13 @@ dependencies = [
 
 [[package]]
 name = "libc"
-version = "0.2.107"
+version = "0.2.108"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "fbe5e23404da5b4f555ef85ebed98fb4083e55a00c317800bc2a50ede9f3d219"
+checksum = "8521a1b57e76b1ec69af7599e75e38e7b7fad6610f037db8c79b127201b5d119"
 
 [[package]]
 name = "libreddit"
-version = "0.17.0"
+version = "0.19.1"
 dependencies = [
  "askama",
  "async-recursion",
@@ -877,11 +866,10 @@ dependencies = [
 
 [[package]]
 name = "rustls"
-version = "0.19.1"
+version = "0.20.2"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "35edb675feee39aec9c99fa5ff985081995a06d594114ae14cbe797ad7b7a6d7"
+checksum = "d37e5e2290f3e040b594b1a9e04377c2c671f1a1cfd9bfdef82106ac1c113f84"
 dependencies = [
- "base64",
  "log",
  "ring",
  "sct",
@@ -890,16 +878,25 @@ dependencies = [
 
 [[package]]
 name = "rustls-native-certs"
-version = "0.5.0"
+version = "0.6.1"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "5a07b7c1885bd8ed3831c289b7870b13ef46fe0e856d288c30d9cc17d75a2092"
+checksum = "5ca9ebdfa27d3fc180e42879037b5338ab1c040c06affd00d8338598e7800943"
 dependencies = [
  "openssl-probe",
- "rustls",
+ "rustls-pemfile",
  "schannel",
  "security-framework",
 ]
 
+[[package]]
+name = "rustls-pemfile"
+version = "0.2.1"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "5eebeaeb360c87bfb72e84abdb3447159c0eaececf1bef2aecd65a8be949d1c9"
+dependencies = [
+ "base64",
+]
+
 [[package]]
 name = "ryu"
 version = "1.0.5"
@@ -924,9 +921,9 @@ checksum = "d29ab0c6d3fc0ee92fe66e2d99f700eab17a8d57d1c1d3b748380fb20baa78cd"
 
 [[package]]
 name = "sct"
-version = "0.6.1"
+version = "0.7.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "b362b83898e0e69f38515b82ee15aa80636befe47c3b6d3d89a911e78fc228ce"
+checksum = "d53dcdb7c9f8158937a7981b48accfd39a43af418591a5d008c7b22b5e1b7ca4"
 dependencies = [
  "ring",
  "untrusted",
@@ -992,9 +989,9 @@ dependencies = [
 
 [[package]]
 name = "serde_json"
-version = "1.0.70"
+version = "1.0.71"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "e277c495ac6cd1a01a58d0a0c574568b4d1ddf14f59965c6a58b8d96400b54f3"
+checksum = "063bf466a64011ac24040a49009724ee60a57da1b437617ceb32e53ad61bfb19"
 dependencies = [
  "itoa",
  "ryu",
@@ -1195,9 +1192,9 @@ checksum = "cda74da7e1a664f795bb1f8a87ec406fb89a02522cf6e50620d016add6dbbf5c"
 
 [[package]]
 name = "tokio"
-version = "1.13.0"
+version = "1.14.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "588b2d10a336da58d877567cd8fb8a14b463e2104910f8132cd054b4b96e29ee"
+checksum = "70e992e41e0d2fb9f755b37446f20900f64446ef54874f40a60c78f021ac6144"
 dependencies = [
  "autocfg",
  "bytes",
@@ -1215,9 +1212,9 @@ dependencies = [
 
 [[package]]
 name = "tokio-macros"
-version = "1.5.1"
+version = "1.6.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "114383b041aa6212c579467afa0075fbbdd0718de036100bc0ba7961d8cb9095"
+checksum = "c9efc1aba077437943f7515666aa2b882dfabfbfdf89c819ea75a8d6e9eaba5e"
 dependencies = [
  "proc-macro2",
  "quote",
@@ -1226,9 +1223,9 @@ dependencies = [
 
 [[package]]
 name = "tokio-rustls"
-version = "0.22.0"
+version = "0.23.1"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "bc6844de72e57df1980054b38be3a9f4702aba4858be64dd700181a8a6d0e1b6"
+checksum = "4baa378e417d780beff82bf54ceb0d195193ea6a00c14e22359e7f39456b5689"
 dependencies = [
  "rustls",
  "tokio",
@@ -1414,9 +1411,9 @@ dependencies = [
 
 [[package]]
 name = "webpki"
-version = "0.21.4"
+version = "0.22.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "b8e38c0608262c46d4a56202ebabdeb094cef7e560ca7a226c6bf055188aa4ea"
+checksum = "f095d78192e208183081cc07bc5515ef55216397af48b873e5edcd72637fa1bd"
 dependencies = [
  "ring",
  "untrusted",

Cargo.toml

@@ -3,7 +3,7 @@ name = "libreddit"
 description = " Alternative private front-end to Reddit"
 license = "AGPL-3.0"
 repository = "https://github.com/spikecodes/libreddit"
-version = "0.17.0"
+version = "0.19.1"
 authors = ["spikecodes <19519553+spikecodes@users.noreply.github.com>"]
 edition = "2018"
 
@@ -16,10 +16,10 @@ regex = "1.5.4"
 serde = { version = "1.0.130", features = ["derive"] }
 cookie = "0.15.1"
 futures-lite = "1.12.0"
-hyper = { version = "0.14.14", features = ["full"] }
-hyper-rustls = "0.22.1"
+hyper = { version = "0.14.15", features = ["full"] }
+hyper-rustls = "0.23.0"
 route-recognizer = "0.3.1"
-serde_json = "1.0.70"
-tokio = { version = "1.13.0", features = ["full"] }
+serde_json = "1.0.71"
+tokio = { version = "1.14.0", features = ["full"] }
 time = "0.2.7"
 url = "2.2.2"

README.md

@@ -40,7 +40,7 @@ Feel free to [open an issue](https://github.com/spikecodes/libreddit/issues/new)
 | [libreddit.exonip.de](https://libreddit.exonip.de) | 🇩🇪 DE |  |
 | [libreddit.domain.glass](https://libreddit.domain.glass) | 🇺🇸 US | ✅ |
 | [libreddit.sugoma.tk](https://libreddit.sugoma.tk) | 🇺🇸 US | |
-| [libreddit.trevorthalacker.com](https://libreddit.trevorthalacker.com) | 🇺🇸 US | ✅ |
+| [libreddit.jamiethalacker.dev](https://libreddit.jamiethalacker.dev) | 🇺🇸 US | ✅ |
 | [reddit.artemislena.eu](https://reddit.artemislena.eu) | 🇩🇪 DE |  |
 | [r.nf](https://r.nf) | 🇩🇪 DE | ✅ |
 | [libreddit.awesomehub.io](https://libreddit.awesomehub.io) | 🇫🇮 FI |  |
@@ -55,6 +55,7 @@ Feel free to [open an issue](https://github.com/spikecodes/libreddit/issues/new)
 | [lr.oversold.host](https://lr.oversold.host) | 🇱🇺 LU | |
 | [libreddit.de](https://libreddit.de) | 🇩🇪 DE |  |
 | [libreddit.pussthecat.org](https://libreddit.pussthecat.org) | 🇩🇪 DE |  |
+| [libreddit.mutahar.rocks](https://libreddit.mutahar.rocks) | 🇫🇷 FR |  |
 | [spjmllawtheisznfs7uryhxumin26ssv2draj7oope3ok3wuhy43eoyd.onion](http://spjmllawtheisznfs7uryhxumin26ssv2draj7oope3ok3wuhy43eoyd.onion) | 🇮🇳 IN |  |
 | [fwhhsbrbltmrct5hshrnqlqygqvcgmnek3cnka55zj4y7nuus5muwyyd.onion](http://fwhhsbrbltmrct5hshrnqlqygqvcgmnek3cnka55zj4y7nuus5muwyyd.onion) | 🇩🇪 DE |  |
 | [kphht2jcflojtqte4b4kyx7p2ahagv4debjj32nre67dxz7y57seqwyd.onion](http://kphht2jcflojtqte4b4kyx7p2ahagv4debjj32nre67dxz7y57seqwyd.onion) | 🇳🇱 NL |  |
@@ -194,19 +195,13 @@ yay -S libreddit-git
 
 If you're on Linux and none of these methods work for you, you can grab a Linux binary from [the newest release](https://github.com/spikecodes/libreddit/releases/latest).
 
-## 5) Replit
+## 5) Replit/Heroku/Glitch
 
-**Note:** Replit is a free option but they are *not* private and will monitor server usage to prevent abuse. If you need a free and easy setup, this method may work best for you.
-
-1. Create a Replit account (see note above)
-2. Visit [the official Repl](https://replit.com/@spikethecoder/libreddit) and fork it
-3. Hit the run button to download the latest Libreddit version and start it
-
-In the web preview (defaults to top right), you should see your instance hosted where you can assign a [custom domain](https://docs.replit.com/repls/web-hosting#custom-domains).
-
-## 6) Heroku
+**Note:** These are free hosting options but they are *not* private and will monitor server usage to prevent abuse. If you need a free and easy setup, this method may work best for you.
 
+<a href="https://repl.it/github/spikecodes/libreddit"><img src="https://repl.it/badge/github/spikecodes/libreddit" alt="Run on Repl.it" height="32" /></a>
 [![Deploy](https://www.herokucdn.com/deploy/button.svg)](https://heroku.com/deploy?template=https://github.com/spikecodes/libreddit)
+[![Remix on Glitch](https://cdn.glitch.com/2703baf2-b643-4da7-ab91-7ee2a2d00b5b%2Fremix-button-v2.svg)](https://glitch.com/edit/#!/remix/libreddit)
 
 ---
 

src/client.rs

@@ -23,7 +23,7 @@ async fn stream(url: &str, req: &Request<Body>) -> Result<Response<Body>, String
 	let url = Uri::from_str(url).map_err(|_| "Couldn't parse URL".to_string())?;
 
 	// Prepare the HTTPS connector.
-	let https = hyper_rustls::HttpsConnector::with_native_roots();
+	let https = hyper_rustls::HttpsConnectorBuilder::new().with_native_roots().https_only().enable_http1().build();
 
 	// Build the hyper client from the HTTPS connector.
 	let client: client::Client<_, hyper::Body> = client::Client::builder().build(https);
@@ -63,7 +63,7 @@ async fn stream(url: &str, req: &Request<Body>) -> Result<Response<Body>, String
 
 fn request(url: String, quarantine: bool) -> Boxed<Result<Response<Body>, String>> {
 	// Prepare the HTTPS connector.
-	let https = hyper_rustls::HttpsConnector::with_native_roots();
+	let https = hyper_rustls::HttpsConnectorBuilder::new().with_native_roots().https_or_http().enable_http1().build();
 
 	// Construct the hyper client from the HTTPS connector.
 	let client: client::Client<_, hyper::Body> = client::Client::builder().build(https);

src/main.rs

@@ -133,8 +133,7 @@ async fn main() {
 		.get_matches();
 
 	let address = matches.value_of("address").unwrap_or("0.0.0.0");
-	let port = std::env::var("PORT")
-        .unwrap_or_else(|_| matches.value_of("port").unwrap_or("8080").to_string());
+	let port = std::env::var("PORT").unwrap_or_else(|_| matches.value_of("port").unwrap_or("8080").to_string());
 	let hsts = matches.value_of("hsts");
 
 	let listener = [address, ":", &port].concat();

src/post.rs

@@ -184,6 +184,14 @@ fn parse_comments(json: &serde_json::Value, post_link: &str, post_author: &str,
 			let id = val(&comment, "id");
 			let highlighted = id == highlighted_comment;
 
+			// Many subreddits have a default comment posted about the sub's rules etc.
+			// Many libreddit users do not wish to see this kind of comment by default.
+			// Reddit does not tell us which users are "bots", so a good heuristic is to
+			// collapse stickied moderator comments.
+			let is_moderator_comment = data["distinguished"].as_str().unwrap_or_default() == "moderator";
+			let is_stickied = data["stickied"].as_bool().unwrap_or_default();
+			let collapsed = is_moderator_comment && is_stickied;
+
 			Comment {
 				id,
 				kind,
@@ -216,6 +224,7 @@ fn parse_comments(json: &serde_json::Value, post_link: &str, post_author: &str,
 				edited,
 				replies,
 				highlighted,
+				collapsed,
 			}
 		})
 		.collect()

src/search.rs

@@ -16,6 +16,7 @@ struct SearchParams {
 	before: String,
 	after: String,
 	restrict_sr: String,
+	typed: String,
 }
 
 // STRUCTS
@@ -55,10 +56,12 @@ pub async fn find(req: Request<Body>) -> Result<Response<Body>, String> {
 		return Ok(random);
 	}
 
+	let typed = param(&path, "type").unwrap_or_default();
+
 	let sort = param(&path, "sort").unwrap_or_else(|| "relevance".to_string());
 
 	// If search is not restricted to this subreddit, show other subreddits in search results
-	let subreddits = param(&path, "restrict_sr").map_or(search_subreddits(&query).await, |_| Vec::new());
+	let subreddits = param(&path, "restrict_sr").map_or(search_subreddits(&query, &typed).await, |_| Vec::new());
 
 	let url = String::from(req.uri().path_and_query().map_or("", |val| val.as_str()));
 
@@ -74,6 +77,7 @@ pub async fn find(req: Request<Body>) -> Result<Response<Body>, String> {
 				before: param(&path, "after").unwrap_or_default(),
 				after,
 				restrict_sr: param(&path, "restrict_sr").unwrap_or_default(),
+				typed,
 			},
 			prefs: Preferences::new(req),
 			url,
@@ -89,8 +93,9 @@ pub async fn find(req: Request<Body>) -> Result<Response<Body>, String> {
 	}
 }
 
-async fn search_subreddits(q: &str) -> Vec<Subreddit> {
-	let subreddit_search_path = format!("/subreddits/search.json?q={}&limit=3", q.replace(' ', "+"));
+async fn search_subreddits(q: &str, typed: &str) -> Vec<Subreddit> {
+	let limit = if typed == "sr_user" { "50" } else { "3" };
+	let subreddit_search_path = format!("/subreddits/search.json?q={}&limit={}", q.replace(' ', "+"), limit);
 
 	// Send a request to the url
 	json(subreddit_search_path, false).await.unwrap_or_default()["data"]["children"]
@@ -101,9 +106,7 @@ async fn search_subreddits(q: &str) -> Vec<Subreddit> {
 		.map(|subreddit| {
 			// For each subreddit from subreddit list
 			// Fetch subreddit icon either from the community_icon or icon_img value
-			let icon = subreddit["data"]["community_icon"]
-				.as_str()
-				.map_or_else(|| val(subreddit, "icon_img"), ToString::to_string);
+			let icon = subreddit["data"]["community_icon"].as_str().map_or_else(|| val(subreddit, "icon_img"), ToString::to_string);
 
 			Subreddit {
 				name: val(subreddit, "display_name_prefixed"),

src/utils.rs

@@ -251,11 +251,17 @@ impl Post {
 			// Determine the type of media along with the media URL
 			let (post_type, media, gallery) = Media::parse(data).await;
 
+			// 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"))
+			}
+
 			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 {
@@ -334,6 +340,7 @@ pub struct Comment {
 	pub edited: (String, String),
 	pub replies: Vec<Comment>,
 	pub highlighted: bool,
+	pub collapsed: bool,
 }
 
 #[derive(Template)]
@@ -534,12 +541,14 @@ pub fn rewrite_urls(input_text: &str) -> String {
 	})
 }
 
-// Append `m` and `k` for millions and thousands respectively
+// Format vote count to a string that will be displayed.
+// Append `m` and `k` for millions and thousands respectively, and
+// round to the nearest tenth.
 pub fn format_num(num: i64) -> (String, String) {
 	let truncated = if num >= 1_000_000 || num <= -1_000_000 {
-		format!("{}m", num / 1_000_000)
+		format!("{:.1}m", num as f64 / 1_000_000.0)
 	} else if num >= 1000 || num <= -1000 {
-		format!("{}k", num / 1_000)
+		format!("{:.1}k", num as f64 / 1_000.0)
 	} else {
 		num.to_string()
 	};
@@ -618,3 +627,17 @@ pub async fn error(req: Request<Body>, msg: String) -> Result<Response<Body>, St
 
 	Ok(Response::builder().status(404).header("content-type", "text/html").body(body.into()).unwrap_or_default())
 }
+
+#[cfg(test)]
+mod tests {
+	use super::format_num;
+
+	#[test]
+	fn format_num_works() {
+		assert_eq!(format_num(567), ("567".to_string(), "567".to_string()));
+		assert_eq!(format_num(1234), ("1.2k".to_string(), "1234".to_string()));
+		assert_eq!(format_num(1999), ("2.0k".to_string(), "1999".to_string()));
+		assert_eq!(format_num(1001), ("1.0k".to_string(), "1001".to_string()));
+		assert_eq!(format_num(1_999_999), ("2.0m".to_string(), "1999999".to_string()));
+	}
+}

static/style.css

@@ -658,6 +658,13 @@ a.search_subreddit:hover {
 	opacity: 0.5;
 }
 
+#more_subreddits {
+	justify-content: center;
+	color: var(--accent);
+	font-weight: 600;
+	text-align: center;
+}
+
 /* Post */
 
 .sep {
@@ -697,12 +704,12 @@ a.search_subreddit:hover {
 
 .post_score {
 	padding-top: 16px;
+	padding-left: 12px;
 	font-size: 13px;
 	font-weight: bold;
-	text-align: end;
 	color: var(--accent);
 	grid-area: post_score;
-	text-align: end;
+	text-align: center;
 	border-radius: 5px 0 0 5px;
 	transition: 0.2s background;
 }
@@ -712,7 +719,7 @@ a.search_subreddit:hover {
 } 
 
 .post_header {
-	margin: 15px 20px 5px 15px;
+	margin: 15px 20px 5px 12px;
 	grid-area: post_header;
 }
 
@@ -722,8 +729,9 @@ a.search_subreddit:hover {
 
 .post_title {
 	font-size: 16px;
+	font-weight: 500;
 	line-height: 1.5;
-	margin: 5px 15px;
+	margin: 5px 15px 5px 12px;
 	grid-area: post_title;
 }
 
@@ -776,7 +784,7 @@ a.search_subreddit:hover {
 	font-weight: bold;
 }
 
-.post_media_image, .post .__NoScript_PlaceHolder__, .post_media_video, .gallery  {
+.post_media_image, .post .__NoScript_PlaceHolder__, .post_media_video, .gallery {
 	max-width: calc(100% - 40px);
 	grid-area: post_media;
 	margin: 15px auto 5px auto;
@@ -837,11 +845,20 @@ a.search_subreddit:hover {
 .post_body {
 	opacity: 0.9;
 	font-weight: normal;
-	margin: 5px 15px;
+	padding: 5px 15px 5px 12px;
 	grid-area: post_body;
 	width: calc(100% - 30px);
 }
 
+/* Used only for text post preview */
+.post_preview {
+	-webkit-mask-image: linear-gradient(180deg,#000 60%,transparent);;
+	mask-image: linear-gradient(180deg,#000 60%,transparent);
+	opacity: 0.8;
+	max-height: 250px;
+	overflow: hidden;
+}
+
 .post_footer {
 	display: flex;
 	justify-content: space-between;
@@ -961,7 +978,8 @@ a.search_subreddit:hover {
 	min-width: 40px;
 	border-radius: 5px;
 	padding: 10px 0;
-	font-size: 16px;
+	font-size: 14px;
+	font-weight: 600;
 }
 
 .comment_right {
@@ -1033,7 +1051,7 @@ a.search_subreddit:hover {
 }
 
 summary.comment_data {
-    cursor: pointer;
+	cursor: pointer;
 }
 
 .moderator, .admin { opacity: 1; }
@@ -1070,7 +1088,7 @@ summary.comment_data {
 }
 
 .compact .post_header {
-	margin: 15px 15px 2.5px 15px;
+	margin: 15px 15px 2.5px 12px;
 	font-size: 14px;
 }
 
@@ -1078,6 +1096,10 @@ summary.comment_data {
 	margin: 2.5px 15px;
 }
 
+.compact .post_preview {
+	display: none;
+}
+
 .compact .post_media {
 	max-width: calc(100% - 30px);
 	margin: 2.5px auto;
@@ -1133,6 +1155,10 @@ summary.comment_data {
 	margin-top: 10px;
 }
 
+.prefs > p {
+	font-weight: 500;
+}
+
 .prefs select {
 	border-radius: 5px;
 	box-shadow: var(--shadow);
@@ -1161,6 +1187,16 @@ input[type="submit"] {
 	margin-left: 30px;
 }
 
+#settings_subs a {
+	color: var(--accent);
+}
+
+.helper {
+	padding: 10px;
+	width: 250px;
+	background: var(--highlighted) !important;
+}
+
 /* Markdown */
 
 .md {
@@ -1213,7 +1249,6 @@ input[type="submit"] {
 
 .md table {
 	margin: 5px;
-	display: block;
 	overflow-x: auto;
 }
 

templates/base.html

@@ -12,7 +12,7 @@
 		<meta name="apple-mobile-web-app-title" content="Libreddit">
 		<meta name="apple-mobile-web-app-capable" content="yes">
 		<meta name="apple-mobile-web-app-status-bar-style" content="default">
-		<!-- Android  -->
+		<!-- Android -->
 		<meta name="mobile-web-app-capable" content="yes">
 		<!-- iOS Logo -->
 		<link href="/touch-icon-iphone.png" rel="apple-touch-icon">

templates/comment.html

@@ -2,13 +2,13 @@
 
 {% if kind == "more" && parent_kind == "t1" %}
 <a class="deeper_replies" href="{{ post_link }}{{ parent_id }}">&rarr; More replies</a>
-{% else if kind == "t1"  %}
+{% else if kind == "t1" %}
 <div id="{{ id }}" class="comment">
 	<div class="comment_left">
 		<p class="comment_score" title="{{ score.1 }}">{{ score.0 }}</p>
 		<div class="line"></div>
 	</div>
-	<details class="comment_right" open>
+	<details class="comment_right" {% if collapsed == false %}open{% endif %}>
 		<summary class="comment_data">
 			<a class="comment_author {{ author.distinguished }} {% if author.name == post_author %}op{% endif %}" href="/user/{{ author.name }}">u/{{ author.name }}</a>
 			{% if author.flair.flair_parts.len() > 0 %}

templates/post.html

@@ -71,7 +71,7 @@
 			{% else if post.post_type == "video" || post.post_type == "gif" %}
 			{% if prefs.use_hls == "on" && !post.media.alt_url.is_empty() %}
 			<script src="/hls.min.js"></script>
-			<video class="post_media_video short hls_autoplay" width="{{ post.media.width }}" height="{{ post.media.height }}" poster="{{ post.media.poster }}" preload="none" controls {% if prefs.autoplay_videos == "on" %}autoplay{% endif %}>
+			<video class="post_media_video short {% if prefs.autoplay_videos == "on" %}hls_autoplay{% endif %}" width="{{ post.media.width }}" height="{{ post.media.height }}" poster="{{ post.media.poster }}" preload="none" controls>
 				<source src="{{ post.media.alt_url }}" type="application/vnd.apple.mpegurl" />
 				<source src="{{ post.media.url }}" type="video/mp4" />
 			</video>

templates/search.html

@@ -17,6 +17,7 @@
 				<label for="restrict_sr" class="search_label">in r/{{ sub }}</label>
 			</div>
 			{% endif %}
+			{% if params.typed == "sr_user" %}<input type="hidden" name="type" value="sr_user">{% endif %}
 			<select id="sort_options" name="sort" title="Sort results by">
 				{% call utils::options(params.sort, ["relevance", "hot", "top", "new", "comments"], "") %}
 			</select>{% if params.sort != "new" %}<select id="timeframe" name="t" title="Timeframe"> 
@@ -30,8 +31,11 @@
 				</button>
 		</form>
 		
-		{% if subreddits.len() > 0 %}
+		{% if subreddits.len() > 0 || params.typed == "sr_user" %}
 		<div id="search_subreddits">
+			{% if params.typed == "sr_user" %}
+			<a href="?q={{ params.q }}&sort={{ params.sort }}&t={{ params.t }}" class="search_subreddit" id="more_subreddits">← Back to post/comment results</a>
+			{% endif %}
 			{% for subreddit in subreddits %}
 			<a href="{{ subreddit.url }}" class="search_subreddit">
 				<div class="search_subreddit_left">{% if subreddit.icon != "" %}<img loading="lazy" src="{{ subreddit.icon }}" alt="r/{{ subreddit.name }} icon">{% endif %}</div>
@@ -45,34 +49,39 @@
 				</div>
 			</a>
 			{% endfor %}
+			{% if params.typed != "sr_user" %}
+			<a href="?q={{ params.q }}&sort={{ params.sort }}&t={{ params.t }}&type=sr_user" class="search_subreddit" id="more_subreddits">More subreddit results →</a>
+			{% endif %}
 		</div>
-		{%  endif %}
-		{% for post in posts %}
-
-		{% if post.flags.nsfw && prefs.show_nsfw != "on" %}
-		{% else if post.title != "Comment" %}
-		{% call utils::post_in_list(post) %}
-		{% else %}
-			<div class="comment">
-				<div class="comment_left">
-					<p class="comment_score" title="{{ post.score.1 }}">{{ post.score.0 }}</p>
-					<div class="line"></div>
-				</div>
-				<details class="comment_right" open>
-					<summary class="comment_data">
-						<a class="comment_link" href="{{ post.permalink }}">COMMENT</a>
-						<span class="created" title="{{ post.created }}">{{ post.rel_time }}</span>
-					</summary>
-					<p class="comment_body">{{ post.body }}</p>
-				</details>
-			</div>
 		{% endif %}
-		{% endfor %}
+		{% if params.typed != "sr_user" %}
+			{% for post in posts %}
+				{% if post.flags.nsfw && prefs.show_nsfw != "on" %}
+				{% else if post.title != "Comment" %}
+					{% call utils::post_in_list(post) %}
+				{% else %}
+					<div class="comment">
+						<div class="comment_left">
+							<p class="comment_score" title="{{ post.score.1 }}">{{ post.score.0 }}</p>
+							<div class="line"></div>
+						</div>
+						<details class="comment_right" open>
+							<summary class="comment_data">
+								<a class="comment_link" href="{{ post.permalink }}">COMMENT</a>
+								<span class="created" title="{{ post.created }}">{{ post.rel_time }}</span>
+							</summary>
+							<p class="comment_body">{{ post.body }}</p>
+						</details>
+					</div>
+				{% endif %}
+			{% endfor %}
+		{% endif %}
 		{% if prefs.use_hls == "on" %}
 		<script src="/hls.min.js"></script>
 		<script src="/playHLSVideo.js"></script>
 		{% endif %}
 
+		{% if params.typed != "sr_user" %}
 		<footer>
 			{% if params.before != "" %}
 			<a href="?q={{ params.q }}&restrict_sr={{ params.restrict_sr }}
@@ -86,5 +95,6 @@
 				&after={{ params.after }}">NEXT</a>
 			{% endif %}
 		</footer>
+		{% endif %}
 	</div>
 {% endblock %}

templates/settings.html

@@ -60,7 +60,12 @@
 				<input type="checkbox" name="autoplay_videos" {% if prefs.autoplay_videos == "on" %}checked{% endif %}>
 			</div>
 			<div id="use_hls">
-				<label for="use_hls">Use HLS for videos</label>
+				<label for="use_hls">Use HLS for videos
+					<details id="feeds">
+						<summary>Why?</summary>
+						<div id="feed_list" class="helper">Reddit videos require JavaScript (via HLS.js) to be enabled to be played with audio. Therefore, this toggle lets you either use Libreddit JS-free or utilize this feature.</div>
+					</details>
+				</label>
 				<input type="hidden" value="off" name="use_hls">
 				<input type="checkbox" name="use_hls" {% if prefs.use_hls == "on" %}checked{% endif %}>
 			</div>
@@ -77,7 +82,9 @@
 			<p>Subscribed Feeds</p>
 			{% for sub in prefs.subscriptions %}
 			<div>
-				<span>{% if sub.starts_with("u_") -%}{{ format!("u/{}", &sub[2..]) }}{% else -%}{{ format!("r/{}", sub) }}{% endif -%}</span>
+				{% let feed -%}
+				{% if sub.starts_with("u_") -%}{% let feed = format!("u/{}", &sub[2..]) -%}{% else -%}{% let feed = format!("r/{}", sub) -%}{% endif -%}
+				<a href="/{{ feed }}">{{ feed }}</a>
 				<form action="/r/{{ sub }}/unsubscribe/?redirect=settings" method="POST">
 						<button class="unsubscribe">Unsubscribe</button>
 				</form>

templates/subreddit.html

@@ -104,16 +104,16 @@
 			<details class="panel" id="sidebar">
 				<summary id="sidebar_label">Sidebar</summary>
 				<div id="sidebar_contents">
-                                  {{ sub.info }}
-                                  {# <hr>
-                                  <h2>Moderators</h2>
-                                  <br>
-                                  <ul>
-                                  {% for moderator in sub.moderators %}
-                                  <li><a style="color: var(--accent)" href="/u/{{ moderator }}">{{ moderator }}</a></li>
-                                  {% endfor %}
-                                  </ul> #}
-                                </div>
+					{{ sub.info }}
+					{# <hr>
+					<h2>Moderators</h2>
+					<br>
+					<ul>
+					{% for moderator in sub.moderators %}
+					<li><a style="color: var(--accent)" href="/u/{{ moderator }}">{{ moderator }}</a></li>
+					{% endfor %}
+					</ul> #}
+				</div>
 			</details>
 		</aside>
 		{% endif %}

templates/utils.html

@@ -87,7 +87,7 @@
 	</p>
 	<!-- POST MEDIA/THUMBNAIL -->
 	{% if (prefs.layout.is_empty() || prefs.layout == "card") && post.post_type == "image" %}
-	<a href="{{ post.media.url }}" class="post_media_image {% if post.media.height /  post.media.width < 2 %}short{% endif %}" >
+	<a href="{{ post.media.url }}" class="post_media_image {% if post.media.height / post.media.width < 2 %}short{% endif %}" >
 		<svg
 			width="{{ post.media.width }}px" 
 			height="{{ post.media.height }}px" 
@@ -102,7 +102,7 @@
 	<video class="post_media_video short" src="{{ post.media.url }}" width="{{ post.media.width }}" height="{{ post.media.height }}" poster="{{ post.media.poster }}" preload="none" controls loop {% if prefs.autoplay_videos == "on" %}autoplay{% endif %}><a href={{ post.media.url }}>Video</a></video>
 	{% else if (prefs.layout.is_empty() || prefs.layout == "card") && post.post_type == "video" %}
 	{% if prefs.use_hls == "on" && !post.media.alt_url.is_empty() %}
-	<video class="post_media_video short" width="{{ post.media.width }}" height="{{ post.media.height }}" poster="{{ post.media.poster }}" controls preload="none" {% if prefs.autoplay_videos == "on" %}autoplay{% endif %}>
+	<video class="post_media_video short {% if prefs.autoplay_videos == "on" %}hls_autoplay{% endif %}" width="{{ post.media.width }}" height="{{ post.media.height }}" poster="{{ post.media.poster }}" controls preload="none">
 		<source src="{{ post.media.alt_url }}" type="application/vnd.apple.mpegurl" />
 		<source src="{{ post.media.url }}" type="video/mp4" />
 	</video>
@@ -119,7 +119,7 @@
 		</svg>
 		{% else %}
 		<svg width="{{ post.thumbnail.width }}px" height="{{ post.thumbnail.height }}px" xmlns="http://www.w3.org/2000/svg">
-			<image  width="100%" height="100%" href="{{ post.thumbnail.url }}"/>
+			<image width="100%" height="100%" href="{{ post.thumbnail.url }}"/>
 			<desc>
 				<img loading="lazy" alt="Thumbnail" src="{{ post.thumbnail.url }}"/>
 			</desc>
@@ -130,6 +130,9 @@
 	{% endif %}
 
 	<div class="post_score" title="{{ post.score.1 }}">{{ post.score.0 }}<span class="label"> Upvotes</span></div>
+	<div class="post_body post_preview">
+		{{ post.body }}
+	</div>
 	<div class="post_footer">
 		<a href="{{ post.permalink }}" class="post_comments" title="{{ post.comments.1 }} comments">{{ post.comments.0 }} comments</a>
 	</div>

templates/wall.html

@@ -4,10 +4,10 @@
 {% block content %}
 	<div id="wall">
 		<h1>{{ title }}</h1>
-                <br>
+		<br>
 		<p>{{ msg }}</p>
-                <form action="/r/{{ sub }}?redir={{ url }}" method="POST">
+		<form action="/r/{{ sub }}?redir={{ url }}" method="POST">
 			<input id="save" type="submit" value="Continue">
-                </form>
+		</form>
 	</div>
 {% endblock %}