generated from muhtadeetaron/nextjs-template
initial commit
This commit is contained in:
50
newspaper/partials/components/extra-small-card.hbs
Normal file
50
newspaper/partials/components/extra-small-card.hbs
Normal file
@ -0,0 +1,50 @@
|
||||
<div class="extra-small-card">
|
||||
<small class="small-card-small-text">
|
||||
{{#unless access}}
|
||||
<span class="restricted-access-icon access-icon-smaller">
|
||||
{{> "icons/lock-icon" }}
|
||||
</span>
|
||||
{{/unless}}
|
||||
|
||||
{{#primary_tag}}
|
||||
<a href="{{url}}" class="hover-underline">{{name}}</a>
|
||||
<span> - </span>
|
||||
{{/primary_tag}}
|
||||
|
||||
<span class="small-card-date">
|
||||
{{date published_at format="MMM DD, YYYY"}}
|
||||
</span>
|
||||
</small>
|
||||
|
||||
<a href="{{url}}" class="small-text hover-underline extra-small-card-heading two-lines-mobile">
|
||||
{{title}}
|
||||
</a>
|
||||
|
||||
{{#if feature_image}}
|
||||
<a href="{{url}}" class="extra-small-card-image-link hover-image-opacity">
|
||||
<figure class="extra-small-card-image-wrapper">
|
||||
<img
|
||||
srcset="{{img_url feature_image size="xxs" format="webp"}} 100w,
|
||||
{{img_url feature_image size="xs" format="webp"}} 150w,
|
||||
{{img_url feature_image size="s" format="webp"}} 320w,
|
||||
{{img_url feature_image size="xm" format="webp"}} 440w,
|
||||
{{img_url feature_image size="m" format="webp"}} 600w"
|
||||
src="{{img_url feature_image size="s"}}"
|
||||
alt="{{#if feature_image_alt}}{{feature_image_alt}}{{else}}{{title}}{{/if}}"
|
||||
loading="lazy"
|
||||
decoding="async"
|
||||
>
|
||||
</figure>
|
||||
</a>
|
||||
{{else}}
|
||||
<a href="{{url}}" class="big-slide-placeholder hover-image-opacity">
|
||||
{{> "icons/placeholder" }}
|
||||
</a>
|
||||
{{/if}}
|
||||
|
||||
<div class="extra-small-card-mobile-excerpt">
|
||||
<p class="{{#if @custom.use_initials}} initial-paragraph{{/if}} three-lines initial-paragraph-reset">
|
||||
{{excerpt}}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
Reference in New Issue
Block a user