feat(*): add image grids for album and associated media displays

This commit is contained in:
Cory Dransfeldt 2025-05-24 17:19:30 -07:00
parent 9b4baad5fb
commit 36fbba761a
No known key found for this signature in database
53 changed files with 1179 additions and 764 deletions

View file

@ -3,7 +3,7 @@
{%- for item in data limit:count -%}
{%- assign alt = item.grid.alt | replaceQuotes -%}
{%- assign imageUrl = item.grid.image -%}
<a href="{{ item.grid.url }}" title="{{ alt }}">
<a class="{{ item.type }}" href="{{ item.grid.url }}" title="{{ alt }}">
<div class="media-grid-item">
{%- if item.grid.title or item.grid.subtext -%}
<div class="meta-text media-highlight {{ item.type }}">
@ -27,11 +27,11 @@
{%- endcase -%}
<img
srcset="
{{ globals.cdn_url }}{{ imageUrl }}?class={{ imageClass }}sm&type=webp {{ width }}w,
{{ globals.cdn_url }}{{ imageUrl }}?class={{ imageClass }}md&type=webp {{ width | times:2 }}w
{{ imageUrl }}?class={{ imageClass }}sm&type=webp {{ width }}w,
{{ imageUrl }}?class={{ imageClass }}md&type=webp {{ width | times:2 }}w
"
sizes="(max-width: 450px) {{ width }}px, {{ width | times:2 }}px"
src="{{ globals.cdn_url }}{{ imageUrl }}?class={{ imageClass }}sm&type=webp"
src="{{ imageUrl }}?class={{ imageClass }}sm&type=webp"
alt="{{ alt }}"
loading="{{ loadingStrategy }}"
decoding="async"