fix: #14042, adopt plugin-feed's show-more/less logic/scss

public/language/en-GB/world.json

@@ -21,5 +21,7 @@
 	"onboard.why": "There's a lot that goes on outside of this forum, and not all of it is relevant to your interests. That's why following people is the best way to signal that you want to see more from someone.",
 	"onboard.how": "In the meantime, you can click on the shortcut buttons at the top to see what else this forum knows about, and start discovering some new content!",
 
-	"category-search": "Find a category..."
+	"category-search": "Find a category...",
+	"see-more": "See more",
+	"see-less": "See less"
 }

public/src/client/world.js

@@ -22,6 +22,7 @@ define('forum/world', [
 		handleImages();
 		handleButtons();
 		handleHelp();
+		handleShowMoreButtons();
 
 		categoryTools.init($('#world-feed'));
 		socket.on('event:new_post', onNewPost);
@@ -208,6 +209,31 @@ define('forum/world', [
 		$('[component="post/content"] img:not(.not-responsive)').addClass('img-fluid');
 	}
 
+	function handleShowMoreButtons() {
+		const feedEl = document.getElementById('world-feed');
+		if (!feedEl) {
+			return;
+		}
+
+		feedEl.querySelectorAll('[component="post/content"]').forEach((el) => {
+			if (el.clientHeight < el.scrollHeight - 1) {
+				el.parentNode.querySelector('[component="show/more"]').classList.remove('hidden');
+			}
+		});
+
+		feedEl.addEventListener('click', (e) => {
+			const subselector = e.target.closest('[component="show/more"]');
+			if (subselector) {
+				const postContent = subselector.closest('.post-body').querySelector('[component="post/content"]');
+				const isShowingMore = parseInt(subselector.getAttribute('ismore'), 10) === 1;
+				postContent.classList.toggle('line-clamp-6', isShowingMore);
+				postContent.classList.toggle('clamp-fade-6', isShowingMore);
+				$(subselector).translateText(isShowingMore ? '[[world:see-more]]' : '[[world:see-less]]');
+				subselector.setAttribute('ismore', isShowingMore ? 0 : 1);
+			}
+		});
+	}
+
 	function updateDropdowns(modified_cids, state) {
 		modified_cids.forEach(function (cid) {
 			const category = $('[data-cid="' + cid + '"]');

src/views/partials/feed/item.tpl

@@ -54,12 +54,12 @@
 				</div>
 			</div>
 
-			<div component="post/content" class="content text-sm text-break position-relative truncate-post-content">
+			<div component="post/content" class="content text-sm text-break position-relative line-clamp-6 clamp-fade-6">
 				<a href="{config.relative_path}/post/{./pid}" class="stretched-link"></a>
 				{./content}
 			</div>
 			<div class="position-relative hover-visible">
-				<button component="show/more" class="btn btn-light btn-sm rounded-pill position-absolute start-50 translate-middle-x bottom-0 z-1 hidden ff-secondary">[[feed:see-more]]</button>
+				<button component="show/more" class="btn btn-light btn-sm rounded-pill position-absolute start-50 translate-middle-x bottom-0 z-1 hidden ff-secondary">[[world:see-more]]</button>
 			</div>
 			<hr class="my-2"/>
 			<div class="d-flex justify-content-between">