peterkrzyzek
/
ghost_leaders_theme
1
0
Fork 0
Code Issues 4 Pull Requests Packages Projects Releases Wiki Activity

Add alt and caption support to feature image

This commit is contained in:
Sodbileg Gansukh 2021-07-08 13:19:04 +08:00
parent 7522cc070c
commit 912129b0cd
6 changed files with 26 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
assets/built/screen.css
View File

File diff suppressed because one or more lines are too long

2
assets/built/screen.css.map
View File

File diff suppressed because one or more lines are too long

4
assets/css/ghost/content.css
View File

@ -123,7 +123,7 @@
margin-top: 6vmin;
}
.kg-card figcaption {
figcaption {
padding: 1.5rem 1.5rem 0;
text-align: center;
color: rgba(0,0,0,0.5);
@ -132,7 +132,7 @@
line-height: 1.4em;
}
.kg-card figcaption strong {
figcaption strong {
color: rgba(0,0,0,0.8);
}

7
page.hbs
View File

@ -11,7 +11,12 @@
{{/if}}
{{#if feature_image}}
<img class="gh-feature-image" src="{{feature_image}}" alt="{{title}}" />
<figure class="gh-feature-image">
<img src="{{feature_image}}" alt="{{#if feature_image_alt}}{{feature_image_alt}}{{else}}{{title}}{{/if}}" />
{{#if feature_image_caption}}
<figcaption>{{feature_image_caption}}</figcaption>
{{/if}}
</figure>
{{/if}}
</header>

2
partials/card.hbs
View File

@ -12,7 +12,7 @@ Re-usable card for linking to posts
{{img_url feature_image size="xl"}} 2000w"
sizes="(max-width: 1000px) 400px, 700px"
src="{{img_url feature_image size="m"}}"
alt="{{title}}"
alt="{{#if feature_image_alt}}{{feature_image_alt}}{{else}}{{title}}{{/if}}"
/>
{{/if}}
<div class="gh-card-content">

25
post.hbs
View File

@ -13,16 +13,21 @@
{{/if}}
{{#if feature_image}}
<img class="gh-feature-image"
srcset="{{img_url feature_image size="s"}} 300w,
{{img_url feature_image size="m"}} 600w,
{{img_url feature_image size="l"}} 1000w,
{{img_url feature_image size="xl"}} 2000w"
sizes="(max-width: 1000px) 1000px, 2000px"
loading="lazy"
src="{{img_url feature_image size="xl"}}"
alt="{{title}}"
/>
<figure class="gh-feature-image">
<img
srcset="{{img_url feature_image size="s"}} 300w,
{{img_url feature_image size="m"}} 600w,
{{img_url feature_image size="l"}} 1000w,
{{img_url feature_image size="xl"}} 2000w"
sizes="(max-width: 1000px) 1000px, 2000px"
loading="lazy"
src="{{img_url feature_image size="xl"}}"
alt="{{#if feature_image_alt}}{{feature_image_alt}}{{else}}{{title}}{{/if}}"
/>
{{#if feature_image_caption}}
<figcaption>{{feature_image_caption}}</figcaption>
{{/if}}
</figure>
{{/if}}
</header>