themes-coffee/templates/overrides/coffee/social-links.ninjatpl
Alex Dunmow beca13796d fix(coffee): pin explicit width/height on all <use> icon SVGs + Wave B gallery screenshots
Root cause: featured_pour's empty-media placeholder used an external <use>
SVG (svg class=h-24 w-24 + use href=/icons/lucide.svg#coffee) sized ONLY by
Tailwind utilities. The host Tailwind JIT does not reliably emit utility
classes used solely in a theme block template, so h-24/w-24 could be dropped
from the generated stylesheet; the SVG (no viewBox, no intrinsic size) then
ballooned to fill its aspect-square parent (~350-500px cup silhouettes over
the hero/blog cards). Fix pins width/height geometry attributes on every
<use> icon SVG so size is CSS-independent and deterministic.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
2026-07-06 10:34:17 +08:00

14 lines
1.0 KiB
Plaintext

<div class="social-links{% if class %} {{ class }}{% endif %}">
{% if heading %}<p class="coffee-hand mb-3 text-xl text-accent">{{ heading }}</p>{% endif %}
<ul class="flex {% if style == "stack" %}flex-col gap-2{% else %}flex-wrap items-center gap-3{% endif %}">
{% for link in links %}{% if link.url %}
<li>
<a href="{{ link.url }}" target="_blank" rel="noopener" aria-label="{{ link.label|default:link.network }}" class="inline-flex items-center gap-2 rounded-full border border-dashed border-border text-foreground transition-colors hover:border-accent hover:text-accent {% if style == "stack" %}w-full px-4 py-2{% else %}p-2.5{% endif %}">
{% if link.network %}<svg width="20" height="20" class="h-5 w-5" aria-hidden="true"><use href="/icons/{{ link.network|split:":"|first }}.svg#{{ link.network|split:":"|last }}"></use></svg>{% endif %}
{% if style == "stack" and link.label %}<span class="coffee-body text-sm font-medium">{{ link.label }}</span>{% endif %}
</a>
</li>
{% endif %}{% endfor %}
</ul>
</div>