🚸 UX: Use anchor tags in article-meta/basic.html

- This removes an inline event handler
- This also adds an aria-label

Using javascript instead of just using <a></a> is bad practice regarding accessibility and automated processing of web pages. Even the browser doesn't show a hint if hovering badges when using the old implementation. This in my opinion is a good way to replace inline event handlers in that code.
This commit is contained in:
Served Smart
2025-06-18 22:40:05 +02:00
parent 2c71bda97f
commit 5e8561d83b
4 changed files with 151 additions and 178 deletions

View File

@@ -82,9 +82,7 @@
{{ if (gt (len ($context.GetTerms $taxonomy)) 0) }}
{{ range $i, $a := $context.GetTerms $taxonomy }}
{{ if not (eq $i 0) }},&nbsp;{{ end }}
<div class="cursor-pointer" onclick="window.open({{ $a.RelPermalink }},'_self');return false;">
{{ $a.LinkTitle }}
</div>
<a href="{{ $a.RelPermalink }}" class="relative">{{ $a.LinkTitle }}</a>
{{ end }}
{{ end }}
{{ end }}
@@ -99,11 +97,7 @@
{{ if and (not (eq $taxonomy "authors")) (not (eq $taxonomy "series")) }}
{{ if (gt (len ($context.GetTerms $taxonomy)) 0) }}
{{ range $context.GetTerms $taxonomy }}
<span
class="mr-2 mt-[0.5rem]"
onclick="window.open({{ .RelPermalink }},'_self');return false;">
{{ partial "badge.html" .LinkTitle }}
</span>
<a class="mr-2 mt-[0.5rem] relative" href="{{ .RelPermalink }}">{{ partial "badge.html" .LinkTitle }}</a>
{{ end }}
{{ end }}
{{ end }}
@@ -115,9 +109,7 @@
{{ if .Params.showCategoryOnly | default (.Site.Params.article.showCategoryOnly | default false) }}
<div class="flex flex-row flex-wrap items-center">
{{ range (.GetTerms "categories") }}
<span class="mr-2 mt-[0.5rem]" onclick="window.open({{ .RelPermalink }},'_self');return false;">
{{ partial "badge.html" .LinkTitle }}
</span>
<a class="mr-2 mt-[0.5rem] relative" href="{{ .RelPermalink }}">{{ partial "badge.html" .LinkTitle }}</a>
{{ end }}
</div>
{{ end }}