Pinecone

Card: Story 

<ul class="cards">
    <li class="card__wrapper">
        <article class="card card--story">
            <figure class="card__image">

                <img src="/images/story.jpg" width="367" height="165" alt="Photograph of SEWA workers" />
            </figure>
            <header>
                <h3 class="card__title">
                    <span class="card__format">Worker Story</span><span class="screen-reader-text">: </span><a class="card__link" href="story">SEWA Federation</a>
                </h3>
            </header>
            <aside class="card__aside">
                <div class="card__meta">
                    <span class="card__locality"><span class="screen-reader-text">location: </span><svg class="icon icon--location" aria-hidden="true" viewBox="0 0 20 20" focusable="false">
                            <use href="/images/location.svg#location" />
                        </svg>
                        Gujarat, India</span>
                </div>
            </aside>
        </article>
    </li>
</ul>
 
{% if not standAlone %}
<ul class="cards">
{% endif %}
	<li class="card__wrapper">
		<article class="card{% if modifier %} card--{{ modifier }}{% endif %}">
			{% if image %}
			<figure class="card__image">
				{% render '@image', image, true %}
			</figure>
			{% endif %}
			<header>
				<h3 class="card__title" >
					{% if format %}<span class="card__format">{{ format }}</span><span class="screen-reader-text">: </span>{% endif %}<a class="card__link" {% if externalLink %}rel="external" {% endif %}href="{{ href }}">{{ title | safe }}</a>
				</h3>
				{% if byline %}
					<p class="card__byline">{% render '@svg', {svg:'author'}, true %} By {{ byline | safe }}</p>
				{% endif %}
			</header>
			<aside class="card__aside">
				{% if date %}
				<div class="card__meta">
					<span class="card__date">
					{% if modifier === 'event' %}
						<span class="screen-reader-text">event date: </span>{% render '@svg', {svg:'calendar'}, true %}{{ date }}
					{% else %}
						<span class="screen-reader-text">date published: </span>{{ date }}
					{% endif %}
					</span>
				</div>
				{% endif %}
				{% if locality %}
				<div class="card__meta">
					<span class="card__locality"><span class="screen-reader-text">location: </span>{% render '@svg', {svg:'location'}, true %}{{ locality }}</span>
				</div>
				{% endif %}
				{% if description %}
				<div class="card__description">{{ description }}</div>
				{% endif %}
			</aside>
		</article>
	</li>
{% if not standAlone %}
</ul>
{% endif %}
 
{
  "title": "SEWA Federation",
  "format": "Worker Story",
  "name": "Story",
  "href": "story",
  "standAlone": false,
  "modifier": "story",
  "id": 6,
  "locality": "Gujarat, India",
  "image": {
    "src": "/images/story.jpg",
    "width": 367,
    "height": 165,
    "alt": "Photograph of SEWA workers"
  }
}

There are no notes for this item.