summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authoreltrac <hi@eltr.ac>2026-02-17 19:21:17 +0800
committereltrac <hi@eltr.ac>2026-02-17 19:21:17 +0800
commitac7e545ff95f33c906481da27b460d86e841280a (patch)
tree3ed67e2a25a82940f7cdeb41a7967449f0ca4cc0
parent03d34f109ca71181db4f5956aec3d9a5eda0f7f4 (diff)
feat: better webmention likes style
-rw-r--r--layouts/_partials/posts/webmention-likes.html16
1 files changed, 9 insertions, 7 deletions
diff --git a/layouts/_partials/posts/webmention-likes.html b/layouts/_partials/posts/webmention-likes.html
index 2c23c67f..54fcef4a 100644
--- a/layouts/_partials/posts/webmention-likes.html
+++ b/layouts/_partials/posts/webmention-likes.html
@@ -2,9 +2,9 @@
{{ $page := .page }}
{{ $othercount := .othercount }}
-<section class="mb-6 flex gap-2 items-center">
- <div class="flex gap-1 group relative items-center">
- <button data-tooltip id="action-area-btn" title="{{ T "actionMenu.interact" }}" class="m-0 p-0 bg-transparent hover:no-underline cursor-pointer">
+<section class="group relative mb-6 vertical-middle">
+ <!-- Action Area Toggle -->
+ <button data-tooltip id="action-area-btn" title="{{ T "actionMenu.interact" }}" class="m-0 p-0 bg-transparent hover:no-underline cursor-pointer float-left mr-2">
<div class="w-5 h-5 bg-neutral-200 dark:bg-neutral-600 flex justify-center items-center rd-full font-800">+</div>
</button>
@@ -21,8 +21,10 @@
{{ end }}
</div>
</div>
+
+ <!-- Likes -->
{{ range $likes }}
- <a href="{{ .author.url }}" target="_blank" title="{{ .author.name }}" class="inline-flex items-center">
+ <a href="{{ .author.url }}" target="_blank" title="{{ .author.name }}" class="box-border hover:no-underline inline-block h-5 w-5 float-left -ml-1">
{{ $value := math.Floor (mul math.Rand 80) }}
{{ $rotate := cond (lt $value 40) (sub 10 $value) (sub $value 30) }}
<img src="{{ .author.photo }}" alt="Profile Picture"
@@ -30,12 +32,12 @@
class="h-5 w-5 rd-full transition-transform {{ if lt $rotate 0 }}group-hover:-rotate-{{ mul -1 $rotate }}{{ else }}group-hover:rotate-{{ $rotate }}{{ end }} hover:scale-150" />
</a>
{{ end }}
- </div>
- <p class="text-secondary m-0 text-sm">
+ <div class="text-secondary m-0 text-sm inline ml-2">
{{ printf (T "webmention.likedBy") (len $likes ) }}
{{ if gt $othercount 0 }}
<a id="toggle-webmentions" class="cursor-pointer" onclick="document.getElementById('webmention-collapse').classList.toggle('hidden')">{{ printf (T "webmention.repliedAndMentionedBy") $othercount }}</a>
{{ end }}
- </p>
+ </div>
+ <div class="clear-left"></div>
</section>