Files
indiekit-blog/_includes/components/widgets/author-card-compact.njk
svemagie 856792ebbe fix(a11y): sweep all remaining accent-600 contrast failures across all components, pages, CSS and JS
Bump all text-accent-600/dark:text-accent-400 to accent-700/300 for WCAG AA.
Bluesky brand blue fixed: #0085ff -> #0057c7 (light) / keep #0085ff (dark).
37 files changed across widgets, sections, layouts, pages, CSS and JS.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-03-14 15:47:09 +01:00

44 lines
2.3 KiB
Plaintext

{# Author Compact Card - h-card microformat (compact version for blog sidebars) #}
{% set id = homepageConfig.identity if (homepageConfig and homepageConfig.identity) else {} %}
{% set authorName = id.name if (id.name is defined) else site.author.name %}
{% set authorAvatar = id.avatar if (id.avatar is defined) else site.author.avatar %}
{% set authorTitle = id.title if (id.title is defined) else site.author.title %}
{% set authorUrl = id.url if (id.url is defined and id.url) else site.author.url %}
{% set authorLocality = id.locality if (id.locality is defined) else site.author.locality %}
{% set authorCountry = id.country if (id.country is defined) else site.author.country %}
{% set authorBio = id.bio if (id.bio is defined) else site.author.bio %}
{% set authorEmail = id.email if (id.email is defined) else site.author.email %}
{% set authorOrg = id.org if (id.org is defined) else site.author.org %}
<is-land on:visible>
<div class="widget">
<div class="h-card p-author flex items-center gap-3">
{# Hidden u-photo for reliable microformat parsing #}
<data class="u-photo hidden" value="{{ authorAvatar }}"></data>
<a href="{{ authorUrl }}" class="u-url u-uid" rel="me" itemprop="url" aria-label="{{ authorName }}">
<img
src="{{ authorAvatar }}"
alt=""
class="w-12 h-12 rounded-full object-cover shadow-lg"
loading="lazy"
>
</a>
<div>
<a href="{{ authorUrl }}" class="u-url p-name font-medium text-surface-900 dark:text-surface-100 hover:text-accent-700 dark:hover:text-accent-300 transition-colors">
{{ authorName }}
</a>
{% if authorTitle %}
<p class="p-job-title text-xs text-surface-600 dark:text-surface-400">{{ authorTitle }}</p>
{% endif %}
{% if authorLocality %}
<p class="p-locality text-xs text-surface-600 dark:text-surface-400">{{ authorLocality }}{% if authorCountry %}, <span class="p-country-name">{{ authorCountry }}</span>{% endif %}</p>
{% endif %}
</div>
</div>
{# Hidden but present for microformat completeness #}
{% if authorBio %}<p class="p-note hidden">{{ authorBio }}</p>{% endif %}
{% if authorEmail %}<data class="u-email hidden" value="{{ authorEmail }}"></data>{% endif %}
{% if authorOrg %}<data class="p-org hidden" value="{{ authorOrg }}"></data>{% endif %}
</div>
</is-land>