diff options
| -rw-r--r-- | layouts/_partials/posts/webmention-likes.html | 16 |
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> |