cdransf/coryd.dev
1
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

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

Browse source
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
Download patch file Download diff file Expand all files Collapse all files

10
src/pages/dynamic/artist.php.liquid
View file

@ -9,14 +9,14 @@ schema: artist
<img
class="media-image"
srcset="
{{ globals.cdn_url }}<?= htmlspecialchars($artist["image"]) ?>?class=w200&type=webp 200w,
{{ globals.cdn_url }}<?= htmlspecialchars($artist["image"]) ?>?class=w600&type=webp 400w,
{{ globals.cdn_url }}<?= htmlspecialchars($artist["image"]) ?>?class=w800&type=webp 800w
<?= htmlspecialchars($artist["image"]) ?>?class=w200&type=webp 200w,
<?= htmlspecialchars($artist["image"]) ?>?class=w600&type=webp 400w,
<?= htmlspecialchars($artist["image"]) ?>?class=w800&type=webp 800w
"
sizes="(max-width: 450px) 200px,
(max-width: 850px) 400px,
800px"
src="{{ globals.cdn_url }}<?= htmlspecialchars($artist["image"]) ?>?class=w200&type=webp"
src="<?= htmlspecialchars($artist["image"]) ?>?class=w200&type=webp"
alt="<?= htmlspecialchars($artist["name"]) ?> • <?= htmlspecialchars(parseCountryField($artist["country"])) ?>"
decoding="async"
width="200"
@ -108,7 +108,7 @@ schema: artist
<?= getTablerIcon('vinyl') ?>
Albums
</h3>
<?php renderMediaGrid($artist["albums"], $globals["cdn_url"]); ?>
<?php renderMediaGrid($artist["albums"]); ?>
<?php endif; ?>
</article>
<?php

8
src/pages/dynamic/book.php.liquid
View file

@ -9,15 +9,15 @@ schema: book
<img
class="media-image"
srcset="
{{ globals.cdn_url }}<?= htmlspecialchars($book["image"]) ?>?class=verticalsm&type=webp 200w,
{{ globals.cdn_url }}<?= htmlspecialchars($book["image"]) ?>?class=verticalmd&type=webp 400w,
{{ globals.cdn_url }}<?= htmlspecialchars($book["image"]) ?>?class=verticalbase&type=webp 800w
<?= htmlspecialchars($book["image"]) ?>?class=verticalsm&type=webp 200w,
<?= htmlspecialchars($book["image"]) ?>?class=verticalmd&type=webp 400w,
<?= htmlspecialchars($book["image"]) ?>?class=verticalbase&type=webp 800w
"
sizes="(max-width: 450px) 203px,
(max-width: 850px) 406px,
(max-width: 1000px) 812px,
812px"
src="{{ globals.cdn_url }}<?= htmlspecialchars($book["image"]) ?>?class=verticalsm&type=webp"
src="<?= htmlspecialchars($book["image"]) ?>?class=verticalsm&type=webp"
alt="<?= htmlspecialchars($book["title"]) ?> by <?= htmlspecialchars($book["author"]) ?>"
decoding="async"
width="200"

8
src/pages/dynamic/movie.php.liquid
View file

@ -7,14 +7,14 @@ schema: movie
<article class="watching-focus">
<img
srcset="
{{ globals.cdn_url }}<?= htmlspecialchars($movie["backdrop"]) ?>?class=bannersm&type=webp 256w,
{{ globals.cdn_url }}<?= htmlspecialchars($movie["backdrop"]) ?>?class=bannermd&type=webp 512w,
{{ globals.cdn_url }}<?= htmlspecialchars($movie["backdrop"]) ?>?class=bannerbase&type=webp 1024w
<?= htmlspecialchars($movie["backdrop"]) ?>?class=bannersm&type=webp 256w,
<?= htmlspecialchars($movie["backdrop"]) ?>?class=bannermd&type=webp 512w,
<?= htmlspecialchars($movie["backdrop"]) ?>?class=bannerbase&type=webp 1024w
"
sizes="(max-width: 450px) 256px,
(max-width: 850px) 512px,
1024px"
src="{{ globals.cdn_url }}<?= htmlspecialchars($movie["backdrop"]) ?>?class=bannersm&type=webp"
src="<?= htmlspecialchars($movie["backdrop"]) ?>?class=bannersm&type=webp"
alt="<?= htmlspecialchars($movie["title"]) ?> (<?= htmlspecialchars($movie["year"]) ?>)"
class="image-banner"
decoding="async"

8
src/pages/dynamic/show.php.liquid
View file

@ -7,14 +7,14 @@ schema: show
<article class="watching-focus">
<img
srcset="
{{ globals.cdn_url }}<?= htmlspecialchars($show["backdrop"]) ?>?class=bannersm&type=webp 256w,
{{ globals.cdn_url }}<?= htmlspecialchars($show["backdrop"]) ?>?class=bannermd&type=webp 512w,
{{ globals.cdn_url }}<?= htmlspecialchars($show["backdrop"]) ?>?class=bannerbase&type=webp 1024w
<?= htmlspecialchars($show["backdrop"]) ?>?class=bannersm&type=webp 256w,
<?= htmlspecialchars($show["backdrop"]) ?>?class=bannermd&type=webp 512w,
<?= htmlspecialchars($show["backdrop"]) ?>?class=bannerbase&type=webp 1024w
"
sizes="(max-width: 450px) 256px,
(max-width: 850px) 512px,
1024px"
src="{{ globals.cdn_url }}<?= htmlspecialchars($show["backdrop"]) ?>?class=bannersm&type=webp"
src="<?= htmlspecialchars($show["backdrop"]) ?>?class=bannersm&type=webp"
alt="<?= htmlspecialchars($show["title"]) ?> (<?= htmlspecialchars($show["year"]) ?>)"
class="image-banner"
decoding="async"

6
src/pages/media/reading/index.html
View file

@ -26,12 +26,12 @@ updated: "now"
<a href="{{ book.url }}">
<img
srcset="
{{ globals.cdn_url }}{{ book.image }}?class=verticalsm&type=webp 200w,
{{ globals.cdn_url }}{{ book.image }}?class=verticalmd&type=webp 400w
{{ book.image }}?class=verticalsm&type=webp 200w,
{{ book.image }}?class=verticalmd&type=webp 400w
"
sizes="(max-width: 450px) 200px,
400px"
src="{{ globals.cdn_url }}{{ book.image }}?class=verticalsm&type=webp"
src="{{ book.image }}?class=verticalsm&type=webp"
alt="{{ alt | replaceQuotes }}"
loading="lazy"
decoding="async"

2
src/pages/page.html
View file

@ -4,7 +4,7 @@ pagination:
size: 1
alias: page
permalink: "{{ page.permalink }}/index.html"
image: "{{ page.open_graph_image | prepend: globals.cdn_url | default: globals.avatar }}"
image: "{{ page.metadata.open_graph_image | default: globals.avatar }}"
updated: "{{ page.updated | default: null }}"
schema: page
---

10
src/pages/sections/posts/post.html
View file

@ -24,16 +24,16 @@ schema: blog
{%- if post.image -%}
<img
srcset="
{{ globals.cdn_url }}{{ post.image }}?class=w200&type=webp 200w,
{{ globals.cdn_url }}{{ post.image }}?class=w400&type=webp 400w,
{{ globals.cdn_url }}{{ post.image }}?class=w800&type=webp 800w,
{{ globals.cdn_url }}{{ post.image }}?class=w1600&type=webp 1600w
{{ post.image }}?class=w200&type=webp 200w,
{{ post.image }}?class=w400&type=webp 400w,
{{ post.image }}?class=w800&type=webp 800w,
{{ post.image }}?class=w1600&type=webp 1600w
"
sizes="(max-width: 450px) 200px,
(max-width: 850px) 400px,
(max-width: 1000px) 800px,
1200px"
src="{{ globals.cdn_url }}{{ post.image }}?class=w200"
src="{{ post.image }}?class=w200"
alt="{{ post.image_alt | replaceQuotes }}"
class="image-banner"
loading="eager"