Adds accessible drag-and-drop and browse controls, staged attachment editing, responsive lazy-loaded thread image grids, and UI regression coverage. Reviewed-on: #12 Co-authored-by: codegirl-007 <s.raide@gmail.com>
77 lines
3.2 KiB
HTML
77 lines
3.2 KiB
HTML
{{define "postActions"}}
|
|
<div class="post-actions">
|
|
{{if canReply .User .Root}}
|
|
<details class="post-composer">
|
|
<summary>Reply</summary>
|
|
<form class="post-form" method="post" action="/posts" enctype="multipart/form-data"
|
|
data-submit-once data-submitting-label="Posting…">
|
|
<input type="hidden" name="_csrf" value="{{.CSRF}}">
|
|
<input type="hidden" name="parent_id" value="{{.Post.ID}}">
|
|
<label for="reply-{{.Post.ID}}">Reply to {{.Post.AuthorName}}</label>
|
|
<textarea id="reply-{{.Post.ID}}" name="body" rows="5" required maxlength="12000"></textarea>
|
|
{{template "imagePicker" (newImagePicker (printf "reply-images-%s" .Post.ID))}}
|
|
<div class="post-form-actions">
|
|
<button type="submit" class="btn btn-primary" data-submit-button>Post reply</button>
|
|
<button type="reset" class="btn btn-ghost"
|
|
onclick="this.closest('details').removeAttribute('open')">Cancel</button>
|
|
</div>
|
|
</form>
|
|
</details>
|
|
{{end}}
|
|
{{if canEditPost .User .Post}}
|
|
<details class="post-composer">
|
|
<summary>Edit</summary>
|
|
<form class="post-form" method="post" action="/posts/{{.Post.ID}}/edit"
|
|
enctype="multipart/form-data"
|
|
data-submit-once data-submitting-label="Saving…">
|
|
<input type="hidden" name="_csrf" value="{{.CSRF}}">
|
|
<label for="edit-{{.Post.ID}}">Edit post</label>
|
|
<textarea id="edit-{{.Post.ID}}" name="body" rows="5" required
|
|
maxlength="12000">{{.Post.Body}}</textarea>
|
|
{{template "imagePicker" (imagePicker (printf "edit-images-%s" .Post.ID) .Post.Images)}}
|
|
<div class="post-form-actions">
|
|
<button type="submit" class="btn btn-primary" data-submit-button>Save changes</button>
|
|
<button type="reset" class="btn btn-ghost"
|
|
onclick="this.closest('details').removeAttribute('open')">Cancel</button>
|
|
</div>
|
|
</form>
|
|
</details>
|
|
{{end}}
|
|
<a class="linkish post-permalink"
|
|
href="/questions/{{.Root.ID}}#post-{{.Post.ID}}"
|
|
aria-label="Permanent link to post by {{.Post.AuthorName}}">Permalink</a>
|
|
{{if and (not .Post.ParentID) (isAdmin .User)}}
|
|
<form class="post-hide" method="post" action="/questions/{{.Post.ID}}/hide">
|
|
<input type="hidden" name="_csrf" value="{{.CSRF}}">
|
|
<button type="submit" class="linkish">Hide</button>
|
|
</form>
|
|
{{end}}
|
|
</div>
|
|
{{end}}
|
|
|
|
{{define "threadReply"}}
|
|
{{$ctx := .}}
|
|
<article id="post-{{.Post.ID}}"
|
|
class="thread-post thread-post-{{postDepth .Depth}}{{if eq .Post.AuthorRole "admin"}} is-shop{{end}}">
|
|
<header class="post-head">
|
|
<p class="post-kicker">{{postLabel .Post}}</p>
|
|
<p class="post-meta">
|
|
<span>{{.Post.AuthorName}}</span>
|
|
<span class="dot" aria-hidden="true">·</span>
|
|
<time datetime="{{.Post.CreatedAt}}">{{postTime .Post.CreatedAt}}</time>
|
|
{{if isEdited .Post}}<span class="edited">Edited</span>{{end}}
|
|
</p>
|
|
</header>
|
|
<p class="post-body">{{.Post.Body}}</p>
|
|
{{template "postImages" .Post}}
|
|
{{template "postActions" .}}
|
|
{{if .Post.Replies}}
|
|
<div class="post-replies">
|
|
{{range .Post.Replies}}
|
|
{{template "threadReply" (postCtx $ctx.User $ctx.CSRF $ctx.Root . (add $ctx.Depth 1))}}
|
|
{{end}}
|
|
</div>
|
|
{{end}}
|
|
</article>
|
|
{{end}}
|