diff --git a/src/assets/css/style.css b/src/assets/css/style.css index d526636..54e2188 100644 --- a/src/assets/css/style.css +++ b/src/assets/css/style.css @@ -72,12 +72,14 @@ body { } .gallery-item { + aspect-ratio: 3/2; margin: 0 0 1rem; position: relative; cursor: pointer; } .gallery-item img { + height: auto; width: 100%; display: block; border-radius: 8px; diff --git a/src/assets/js/script.js b/src/assets/js/script.js index 69582a1..536b007 100644 --- a/src/assets/js/script.js +++ b/src/assets/js/script.js @@ -64,10 +64,10 @@ const createPicture = (item) => { const img = document.createElement('img'); img.src = `assets/media/thumbnail/${item.name}.webp`; img.alt = item.alt.replace(/[‘’]/g, ''); - img.height = item.height || 300; - img.width = item.width || 300; + img.height = item.height || undefined; + img.width = item.width || undefined; img.loading = item.loading || 'lazy'; - img.fetchpriority = item.fetchpriority || undefined; + img.fetchPriority = item.fetchpriority || undefined; pic.appendChild(img); return pic; };