initial commit

newspaper/partials/components/extra-small-side-card.hbs

@@ -0,0 +1,44 @@
+{{!--
+    Parameters:
+    - isPost: Boolean
+--}}
+
+<div class="extra-small-card extra-small-side-card">
+    {{#if feature_image}}
+        <a href="{{url}}" class="extra-small-side-card-image-link hover-image-opacity">                   
+            <figure class="extra-small-side-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="xs"}}"
+                    alt="{{#if feature_image_alt}}{{feature_image_alt}}{{else}}{{name}}{{/if}}"
+                    loading="lazy"
+                    decoding="async"
+                >
+            </figure> 
+        </a>                                               
+    {{/if}}
+
+    <div class="extra-small-side-card-content{{#unless feature_image}} no-margin-left{{/unless}}">
+        <a href="{{url}}" class="small-text hover-underline extra-small-side-card-heading three-lines">
+            {{name}}
+        </a>
+
+        <small class="small-card-small-text italic-lower-opac"> 
+            {{#unless isPost}}   
+                {{plural count.posts empty=(t "No Articles") singular=(t "1 Article") plural=(t "% Articles")}}
+            {{else}}
+                {{#unless access}}
+                    <span class="restricted-access-icon access-icon-smaller">
+                        {{> "icons/lock-icon" }}
+                    </span>
+                {{/unless}}
+
+                {{date published_at format="MMM DD, YYYY"}}
+            {{/unless}}
+        </small>
+    </div>
+</div>