feat: max image width option

config/shortcodes/index.js

@@ -16,10 +16,11 @@ export const img = async (
   alt = '',
   className,
   loading = 'lazy',
+  maxWidth = 1248,
   sizes = '90vw',
   formats = ['avif', 'webp', 'jpeg']
 ) => {
-  const widths = [320, 570, 880, 1024, 1248];
+  const widths = [320, 570, 880, 1024, 1248].filter(width => width <= maxWidth);
   const metadata = await Image(src, {
     widths: [...widths],
     formats: [...formats],

package.json

@@ -1,6 +1,6 @@
 {
   "name": "coryd.dev",
-  "version": "7.5.0",
+  "version": "7.6.0",
   "description": "The source for my personal site. Built using 11ty.",
   "type": "module",
   "scripts": {

src/_includes/partials/now/media-grid.liquid

@@ -32,7 +32,7 @@
           {%- capture loadingStrategy -%}
             {%- if loading -%}{{ loading }}{%- else -%}lazy{%- endif -%}
           {%- endcapture -%}
-          {% image item.image, alt, '', loadingStrategy %}
+          {% image item.image, alt, '', loadingStrategy, 320 %}
         </div>
       </a>
     {% endfor %}