mirror of
https://github.com/Damillora/Yuika
synced 2024-11-14 14:07:31 +00:00
feat: responsive post thumbnail images
This commit is contained in:
parent
69d3041171
commit
8bf1119b0b
@ -8,14 +8,19 @@ be a background image using CSS, we end up with a handful of inline styles.
|
|||||||
|
|
||||||
If the template in question has a background image, then we render responsive image styles
|
If the template in question has a background image, then we render responsive image styles
|
||||||
for it, and apply those styles to the <header> tag. Else, we just output a <header> tag
|
for it, and apply those styles to the <header> tag. Else, we just output a <header> tag
|
||||||
with a `no-image` class so we can style it accordingly.
|
with a `no-image` class so we can style it accordingly.
|
||||||
--}}
|
--}}
|
||||||
<div>
|
<div>
|
||||||
<div class="post-card__image">
|
<div class="post-card__image">
|
||||||
{{#if feature_image}}
|
{{#if feature_image}}
|
||||||
<img src="{{img_url feature_image size='m'}}" alt="{{title}}">
|
<img srcset="{{img_url feature_image size=" s"}} 300w, {{img_url feature_image size="m" }} 600w,
|
||||||
{{else}}
|
{{img_url feature_image size="l" }} 1000w, {{img_url feature_image size="xl" }} 2000w"
|
||||||
<img src="{{img_url @site.cover_image size='m'}}" alt="{{title}}">
|
sizes="(max-width: 1000px) 400px, 700px" src="{{img_url feature_image size=" m"}}" alt="{{title}}">
|
||||||
{{/if}}
|
{{else}}
|
||||||
</div>
|
<img srcset="{{img_url @site.cover_image size=" s"}} 300w, {{img_url @site.cover_image size="m" }} 600w,
|
||||||
</div>
|
{{img_url @site.cover_image size="l" }} 1000w, {{img_url @site.cover_image size="xl" }} 2000w"
|
||||||
|
sizes="(max-width: 1000px) 400px, 700px" src="{{img_url @site.cover_image size=" m"}}"
|
||||||
|
alt="{{title}}">
|
||||||
|
{{/if}}
|
||||||
|
</div>
|
||||||
|
</div>
|
Loading…
Reference in New Issue
Block a user