diff options
Diffstat (limited to 'lume/src/_components')
| -rw-r--r-- | lume/src/_components/XeblogPicture.tsx | 34 |
1 files changed, 18 insertions, 16 deletions
diff --git a/lume/src/_components/XeblogPicture.tsx b/lume/src/_components/XeblogPicture.tsx index 9f20e6c..857ce9f 100644 --- a/lume/src/_components/XeblogPicture.tsx +++ b/lume/src/_components/XeblogPicture.tsx @@ -5,22 +5,24 @@ export interface XeblogPicture { export default function XeblogPicture({ path, desc }: XeblogPicture) { return ( - <figure> - <picture> - <source - type="image/avif" - srcset={`https://cdn.xeiaso.net/file/christine-static/${path}.avif`} - /> - <source - type="image/webp" - srcset={`https://cdn.xeiaso.net/file/christine-static/${path}.webp`} - /> - <img - alt={`An image of ${prompt}`} - loading="lazy" - src={`https://cdn.xeiaso.net/file/christine-static/${path}.jpg`} - /> - </picture> + <figure className="max-w-3xl mx-auto"> + <a href={`https://cdn.xeiaso.net/file/christine-static/${path}.jpg`}> + <picture> + <source + type="image/avif" + srcset={`https://cdn.xeiaso.net/file/christine-static/${path}.avif`} + /> + <source + type="image/webp" + srcset={`https://cdn.xeiaso.net/file/christine-static/${path}.webp`} + /> + <img + alt={desc} + loading="lazy" + src={`https://cdn.xeiaso.net/file/christine-static/${path}.jpg`} + /> + </picture> + </a> {desc && <figcaption>{desc}</figcaption>} </figure> ); |