- Add shared BlogMD renderer (static/js/markdown.js): marked + DOMPurify + highlight.js pipeline with GFM support, heading id slugger with CJK-aware anchors, syntax highlighting, per-block copy button and language badge, lazy images with lightbox, external links opened safely in new tabs, tables wrapped for small screens. - Add .md-body typography styles (static/css/markdown.css) so articles, comments and editor previews render with proper headings, tables, lists, blockquotes and code blocks (previously the prose classes had no effect because the Tailwind typography plugin is not loaded). - Fix marked options that were set after parsing and removed from marked v4+ (mangle/headerIds no-ops). - Pin CDN versions (marked 15.0.12, dompurify 3.4.13, highlight.js 11.12.0) instead of floating 'latest' URLs. - Wire EasyMDE preview/side-by-side to BlogMD in admin and user article editors; use BlogMD for comment bodies on the article page, admin comment list and comment preview. - Serve /static in main.go and deploy it in install_linux.sh.
34 lines
2.0 KiB
HTML
34 lines
2.0 KiB
HTML
{{define "comment_node"}}
|
|
<div id="comment-{{.Comment.ID}}" class="comment-node">
|
|
<div class="flex items-start gap-3 py-3">
|
|
{{if .UseGravatar}}
|
|
<img src="{{.Comment.GravatarURL 48}}" alt="" class="w-10 h-10 rounded-full bg-gray-100 flex-shrink-0">
|
|
{{else}}
|
|
<div class="w-10 h-10 rounded-full flex items-center justify-center text-white font-bold flex-shrink-0" style="background:{{.AvatarColor}}">{{.Comment.AuthorInitial}}</div>
|
|
{{end}}
|
|
<div class="flex-1 min-w-0">
|
|
<div class="flex flex-wrap items-center gap-2 text-sm">
|
|
{{if .Comment.Website}}
|
|
<a href="{{.Comment.Website}}" target="_blank" rel="nofollow ugc noopener" class="font-semibold text-gray-800 hover:text-blue-600">{{.Comment.AuthorName}}</a>
|
|
{{else}}
|
|
<span class="font-semibold text-gray-800">{{.Comment.AuthorName}}</span>
|
|
{{end}}
|
|
<span class="text-gray-400 text-xs">{{.RelTime}}</span>
|
|
{{if .Comment.IsPrivate}}<span class="text-xs bg-purple-100 text-purple-700 px-2 py-0.5 rounded">{{index .Tr "comments_private_badge"}}</span>{{end}}
|
|
{{if eq .Comment.Status 0}}<span class="text-xs bg-yellow-100 text-yellow-700 px-2 py-0.5 rounded">{{index .Tr "comments_pending"}}</span>{{end}}
|
|
</div>
|
|
<div class="comment-body mt-1 text-sm text-gray-700 prose prose-sm max-w-none md-body" data-md="{{.Comment.Content}}"></div>
|
|
<button type="button" class="reply-btn mt-2 text-xs text-blue-600 hover:text-blue-800 font-medium bg-transparent border-none cursor-pointer"
|
|
data-id="{{.Comment.ID}}" data-name="{{.Comment.AuthorName}}">{{index .Tr "comments_reply"}}</button>
|
|
</div>
|
|
</div>
|
|
{{if .Children}}
|
|
<div class="ml-6 sm:ml-10 pl-4 border-l-2 border-gray-100">
|
|
{{range .Children}}
|
|
{{template "comment_node" .}}
|
|
{{end}}
|
|
</div>
|
|
{{end}}
|
|
</div>
|
|
{{end}}
|