Small tweaks

web/main.go

@@ -277,7 +277,7 @@ func main() {
 		}
 
 		// dont pass the op post. only replies
-		views.ThreadPosts(posts[1:]).Render(r.Context(), w)
+		views.PostReplies(posts[1:]).Render(r.Context(), w)
 	})
 
 	// -----------------

web/static/index.css

@@ -175,6 +175,7 @@ body {
 }
 
 .post-header {
+    clear: none;
     margin-bottom: 10px;
 }
 
@@ -186,19 +187,20 @@ body {
     color: #13A82A;
 }
 
-.post-img-container {
+.post-img {
+    display: block;
     float: left;
     margin: 4px 12px 4px 0;
-}
-
-.post-img {
     cursor: pointer;
     height: auto;
     max-width: 100%;
 }
 
 .post-body {
-    overflow-wrap: break-word;
+    margin-top: 10px;
+    margin-left: 5px;
+    clear: none;
+    word-wrap: break-word;
     line-height: 1.3;
 }
 
@@ -211,6 +213,12 @@ body {
     color: #789922
 }
 
+.post-filename {
+    color: rgb(52, 52, 92);
+    text-decoration: underline;
+    cursor: pointer;
+}
+
 .reply-link {
     color: #D00;
     text-decoration: underline;

web/views/thread.templ

@@ -8,31 +8,22 @@ import (
 	"strconv"
 )
 
-func getPostClass(isOp bool) string {
-	if isOp {
-		return "post-op"
-	}
-	return "post"
-}
-
-templ ThreadPost(post database.Post, thread *database.Thread) {
-	{{ isOp := thread != nil }}
-	<article id={ fmt.Sprintf("post-%d", post.Id) } class={ getPostClass(isOp) }>
-		if post.MediaPath != "" {
-			<div class="post-img-container">
-				<img
-					onclick="togglePostImage(this)"
-					loading="lazy"
-					src={ fmt.Sprintf("/static/img/posts/thumb/%s",
-			post.MediaPath) }
-					class="post-img"
-				/>
-			</div>
-		}
+templ PostOriginal(post database.Post, thread *database.Thread) {
+	<article id={ fmt.Sprintf("post-%d", post.Id) } class="post-op">
+		<div>
+			File:
+			<a href={ templ.URL("/static/img/posts/full/" + post.MediaPath) } class="post-filename">
+				{ post.MediaPath }
+			</a>
+		</div>
+		<img
+			onclick="togglePostImage(this)"
+			loading="lazy"
+			src={ fmt.Sprintf("/static/img/posts/thumb/%s", post.MediaPath) }
+			class="post-img"
+		/>
 		<header class="post-header">
-			if isOp && thread.Subject != "" {
-				<h1 class="thread-subject">{ thread.Subject } -</h1>
-			}
+			<h1 class="thread-subject">{ thread.Subject } -</h1>
 			<span class="post-author">{ post.Author }</span>
 			<span class="post-date">{ post.CreatedAt.Format("01/02/2006") }</span>
 			<span class="post-time">{ post.CreatedAt.Format("15:04") }</span>
@@ -42,17 +33,54 @@ templ ThreadPost(post database.Post, thread *database.Thread) {
 			>
 				No.{ strconv.Itoa(post.Id) }
 			</span>
-			<div class="post-replies"></div>
+			<span class="post-replies"></span>
 		</header>
-		<p>
+		<p class="post-body">
 			@templ.Raw(util.EnrichPost(post.Body))
 		</p>
 	</article>
 }
 
-templ ThreadPosts(posts []database.Post) {
+templ PostReply(post database.Post) {
+	<article id={ fmt.Sprintf("post-%d", post.Id) } class="post">
+		<header class="post-header">
+			<span class="post-author">{ post.Author }</span>
+			<span class="post-date">{ post.CreatedAt.Format("01/02/2006") }</span>
+			<span class="post-time">{ post.CreatedAt.Format("15:04") }</span>
+			<span
+				_={ fmt.Sprintf("on click set #newPostBody.value to #newPostBody.value + '>>%d\n'", post.Id) }
+				class=" post-num"
+			>
+				No.{ strconv.Itoa(post.Id) }
+			</span>
+			<span class="post-replies"></span>
+		</header>
+		if post.MediaPath != "" {
+			<div>
+				<div style="margin-bottom: 2px;">
+					File:
+					<a href={ templ.URL("/static/img/posts/full/" + post.MediaPath) } class="post-filename">
+						{ post.MediaPath }
+					</a>
+				</div>
+				<img
+					onclick="togglePostImage(this)"
+					loading="lazy"
+					src={ fmt.Sprintf("/static/img/posts/thumb/%s",
+			post.MediaPath) }
+					class="post-img"
+				/>
+			</div>
+		}
+		<p class="post-body">
+			@templ.Raw(util.EnrichPost(post.Body))
+		</p>
+	</article>
+}
+
+templ PostReplies(posts []database.Post) {
 	for _, post := range (posts) {
-		@ThreadPost(post, nil)
+		@PostReply(post)
 		<br/>
 	}
 }
@@ -97,13 +125,13 @@ templ Thread(board database.Board, thread database.Thread, posts []database.Post
 			</form>
 		</div>
 		<div class="thread">
-			@ThreadPost(posts[0], &thread)
+			@PostOriginal(posts[0], &thread)
 			<div
 				hx-get={ fmt.Sprintf("/hx/%s/threads/%d/posts", board.Slug, thread.Id) }
 				hx-trigger="refreshPosts from:body"
 				_="on htmx:afterSwap call insertHeaderReplies()"
 			>
-				@ThreadPosts(posts[1:])
+				@PostReplies(posts[1:])
 			</div>
 		</div>
 	}