Pinecone

Card: Event 

<ul class="cards">
    <li class="card__wrapper">
        <article class="card card--event">
            <header>
                <h3 class="card__title">
                    <span class="card__format">Community Event</span><span class="screen-reader-text">: </span><a class="card__link" href="event">Toronto Platform Coop Meetup</a>
                </h3>
            </header>
            <aside class="card__aside">
                <div class="card__meta">
                    <span class="card__date">
                        <span class="screen-reader-text">event date: </span><svg class="icon icon--calendar" aria-hidden="true" viewBox="0 0 20 20" focusable="false">
                            <use href="/images/calendar.svg#calendar" />
                        </svg>
                        Feb 23, 2019, 6:30-8:30PM
                    </span>
                </div>
                <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>
                        OCAD University, 100 McCaul Street</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": "Toronto Platform Coop Meetup",
  "format": "Community Event",
  "name": "Event",
  "href": "event",
  "standAlone": false,
  "modifier": "event",
  "id": 3,
  "date": "Feb 23, 2019, 6:30-8:30PM",
  "locality": "OCAD University, 100 McCaul Street"
}

There are no notes for this item.