chore: image improvements
This commit is contained in:
parent
77c9a85296
commit
d27fac4b6b
29 changed files with 650 additions and 44 deletions
|
@ -17,9 +17,43 @@
|
|||
</div>
|
||||
{% assign loadingStrategy = loading | default: 'lazy' %}
|
||||
{% if shape == 'square' %}
|
||||
<img src="https://coryd.dev/.netlify/images/?url={{ item.image }}&fit=cover&w=240&h=240&fm=webp&q=85" alt="{{ alt }}" loading="{{ loadingStrategy }}" decoding="async" width="240" height="240" />
|
||||
<img
|
||||
srcset="
|
||||
https://coryd.dev/.netlify/images/?url={{ item.image }}&fit=cover&w=200&h=200&fm=webp&q=85 200w,
|
||||
https://coryd.dev/.netlify/images/?url={{ item.image }}&fit=cover&w=400&h=400&fm=webp&q=85 400w,
|
||||
https://coryd.dev/.netlify/images/?url={{ item.image }}&fit=cover&w=800&h=800&fm=webp&q=85 800w,
|
||||
https://coryd.dev/.netlify/images/?url={{ item.image }}&fit=cover&w=1200&h=1200&fm=webp&q=85 1200w
|
||||
"
|
||||
sizes="(max-width: 450px) 200px,
|
||||
(max-width: 850px) 400px,
|
||||
(max-width: 100px) 800px,
|
||||
1200px"
|
||||
src="https://coryd.dev/.netlify/images/?url={{ item.image }}&fit=cover&w=1200&h=1200&fm=webp&q=85"
|
||||
alt="{{ alt }}"
|
||||
loading="{{ loadingStrategy }}"
|
||||
decoding="async"
|
||||
width="240"
|
||||
height="240"
|
||||
/>
|
||||
{% else %}
|
||||
<img src="https://coryd.dev/.netlify/images/?url={{ item.image }}&fit=cover&w=200&h=307&fm=webp&q=85" alt="{{ alt }}" loading="{{ loadingStrategy }}" decoding="async" width="200" height="307" />
|
||||
<img
|
||||
srcset="
|
||||
https://coryd.dev/.netlify/images/?url={{ item.image }}&fit=cover&w=200&h=307&fm=webp&q=85 200w,
|
||||
https://coryd.dev/.netlify/images/?url={{ item.image }}&fit=cover&w=400&h=614&fm=webp&q=85 400w,
|
||||
https://coryd.dev/.netlify/images/?url={{ item.image }}&fit=cover&w=800&h=1228&fm=webp&q=85 800w,
|
||||
https://coryd.dev/.netlify/images/?url={{ item.image }}&fit=cover&w=1200&h=1842&fm=webp&q=85 1200w
|
||||
"
|
||||
sizes="(max-width: 450px) 200px,
|
||||
(max-width: 850px) 400px,
|
||||
(max-width: 1000px) 800px,
|
||||
1200px"
|
||||
src="https://coryd.dev/.netlify/images/?url={{ item.image }}&fit=cover&w=1200&h=1842&fm=webp&q=85"
|
||||
alt="{{ alt }}"
|
||||
loading="{{ loadingStrategy }}"
|
||||
decoding="async"
|
||||
width="200"
|
||||
height="307"
|
||||
/>
|
||||
{% endif %}
|
||||
</div>
|
||||
</a>
|
||||
|
|
Reference in a new issue