Blog

<div class="Background Background--grey">

    <header class="SiteHeader">

        <a href="" class="Logo " title="Home">
    <svg role="img" aria-labelledby="clearleft-logo" xmlns="http://www.w3.org/2000/svg" width="154" height="55" viewBox="0 0 154 54">
        <title id="clearleft-logo">Clearleft</title>
        <style>
        .Logo-streak {
            mask-repeat: no-repeat;
            stroke-dasharray: 150% 150%;
            stroke-dashoffset: 150%;
        }
        .animateLogo-streak{
            animation: swipe 0.4s cubic-bezier(0.39, 0.575, 0.565, 1) 0.8s forwards;
        }
        @keyframes swipe {
            from {
              stroke-dashoffset: 150%;
            }
            to {
              stroke-dashoffset: 0%;
            }
        }
        </style>
        <path class="Logo-text" fill="#25333A" d="M152.5 27.5v5.4h-2.4c-5.5 0-8.6-3.3-8.6-9.3v-6.8h-7.4v16.1h-5.6V16.8h-3.1l-.1-4.6h3.1v-.6c0-6 3-9.3 8.6-9.3h2.4v5.4H137c-2 0-2.9 1.3-2.9 4v.6h7.4v-4l5.6-3.6v7.4h4v4.6h-4v6.8c0 2.7 1 4 2.9 4h2.5zM77 11.9h5.6v21H77v-2c-1.7 1.7-4 2.7-6.4 2.6-5.7 0-10.1-4.8-10.1-11s4.4-11 10.1-11c2.4-.1 4.7.8 6.4 2.5v-2.1zm0 10.5c0-3.5-2.4-6.1-5.6-6.1s-5.6 2.6-5.6 6.1 2.3 6.1 5.6 6.1S77 26 77 22.4zm12.9-8.7v-1.8h-5.4v21h5.6v-9.5c0-4.5.8-6.8 5-6.8h1.5v-5.4h-.2c-3 0-5.2.9-6.5 2.5zM98 32.8h5.6V2.4H98v30.4zM17 8.1c3.2 0 6.1 1.8 7.6 4.5l.1.2.2-.1 4.8-3.1.3-.1-.1-.2C27 5 22.2 2.4 17.1 2.4 8.6 2.3 1.6 9.1 1.5 17.5v.3c-.1 8.5 6.8 15.4 15.3 15.5h.3c5.1.1 9.9-2.5 12.8-6.7l.1-.2-5.2-3.4-.1.2c-1.6 2.7-4.5 4.4-7.6 4.5-5.2 0-9.2-4.3-9.2-9.8 0-4.8 3.4-9.8 9.1-9.8zm14.6 24.7h5.6V2.4h-5.6v30.4zm94-10.5c0 .6 0 1.1-.1 1.7v.5h-14.8c.5 2.5 2.8 4.3 5.4 4.1 2 0 3.9-.7 5.5-2l.4-.3 2.8 4-.3.3c-2.4 2-5.5 3.1-8.6 3-6.4 0-10.8-4.6-10.8-11.1s4.3-11.1 10.6-11.1c5.7-.2 9.8 4.4 9.9 10.9zm-5.7-2.2c-.6-2.5-2.2-3.9-4.5-3.9-2.4-.1-4.4 1.6-4.7 3.9h9.2zm-60.7 2.2c0 .6 0 1.1-.1 1.7v.5H44.3c.5 2.5 2.8 4.3 5.4 4.1 2 0 3.9-.7 5.5-2l.4-.3 2.8 4-.3.3c-2.4 2-5.5 3.1-8.6 3-6.4 0-10.8-4.6-10.8-11.1S43 11.2 49.2 11.2c5.9 0 10 4.6 10 11.1zm-5.6-2.2c-.6-2.5-2.2-3.9-4.5-3.9-2.4-.1-4.4 1.6-4.7 3.9h9.2z"/>
        <clipPath id="mask">
            <path d="M151.8 44c-.2-1-1.1-1.6-2-1.4h-.1c-1.1.4-2.2.4-3.3.2-1.4-.2-2.9-.3-4.3-.5-2.4-.3-4.8-.5-7.2-.7-2.6-.2-5.3-.3-7.9-.5-2.5-.2-4.9-.4-7.4-.5-5.2-.3-10.5-.5-15.7-.6-4.4-.2-19.6-.3-23.9-.3-3.1 0-6.1.1-9.2.2-4.1 0-18.9.3-23 .6-4.3.2-8.7.4-13 .7-4 .3-8 .5-11.9.7-.9 0-1.8.1-2.7.3-2.4 0-4.4.2-6.5.3-1.7.1-3.4.1-5 .4v0c-.7 0-1-.4-2.1-.3s-2.1.5-2.1 1.1c-.5.1 0 .4-.6.5v.5c.4.2.6.4 0 .7v.2c.3-.1.4 0 .6.1v.4c-.4.2-.2.4-.1.5s.5.4.4.7c-.1.5.1 1 .5 1.3v.2c.1.7 1.1 1.3 1.2 2 .1.5 1 1 2.3.9 1.1-.1 1.5-.5 2.5-.7.2 0 .8-.1 1-.1 4.2-.3 8.5-.6 12.7-1 1.2-.1 2.6-.1 3.7-.3 1.5-.3 3.1-.3 4.6-.5 2.9-.3 5.8-.5 8.6-.5 2.4 0 4.8-.3 7.2-.4 1.3-.1 2.7.1 4-.1.5-.1 1-.1 1.6-.1 1.4.1 13.7-.1 15.1-.1 2.8 0 5.6-.1 8.4-.2 3.3-.1 17.4-.2 20.7 0 1.1 0 2.3.2 3.4.2 3.1-.2 6.2.1 9.3.2 2.7.1 5.4.3 8.1.4s5.2.2 7.8.5c1 .1 2.1.2 3.1.3.8.1 1.4-.2 2.2-.1 2 .3 4.1.5 6.2.6 1.1 0 2.2.1 3.2.3 1.6.3 3.1.5 4.7.7l1 .4c.9.4 1.8.5 2.8.3.5-.3.8-1 .6-1.6v-.2c.1-.2.2-.3.1-.5.3-.1.3-.2.2-.4.2-.6.7-1.1.4-1.7-.1-.2-.4-.6.4-.8v-.5c-.4 0-.4-.2-.5-.3-.2-.5-.1-1-.1-1.5zM78.3 45.3h-.2.2"/>
        </clipPath>
        <path class="Logo-streak animateLogo-streak" clip-path="url(#mask)" fill-rule="evenodd" fill="none" stroke="#23D8A0" stroke-width="13" d="M-1.1 49.4s50.4-6.3 81.9-6 77.1 4.6 77.1 4.6" />
    </svg>
</a>

        <nav class="PrimaryNavigation" aria-label="Primary Navigation" data-component="PrimaryNavigation">
            <a href="#offcanvas" class="PrimaryNavigation-menu" aria-hidden="true">Menu</a>
            <ul class="PrimaryNavigation-list">
                <li class="PrimaryNavigation-listItem"><a href="#" class="PrimaryNavigation-link is-active ">Case Studies</a></li>
                <li class="PrimaryNavigation-listItem"><a href="#" class="PrimaryNavigation-link">Team</a></li>
                <li class="PrimaryNavigation-listItem"><a href="#" class="PrimaryNavigation-link">Posts</a></li>
                <li class="PrimaryNavigation-listItem"><a href="#" class="PrimaryNavigation-link">Events</a></li>
                <li class="PrimaryNavigation-listItem"><a href="#" class="PrimaryNavigation-link">Contact</a></li>
            </ul>
        </nav>
    </header>
    <div class="Masthead Masthead--chimney" role="banner">

        <div class="Masthead-container">

            <div class="Masthead-primary">

                <h1 class="Heading Heading--main">Show me</h1>

            </div>
            <!--/.Masthead-primary-->

        </div>

    </div>
    <!--/.Masthead-->
</div>

<main id="main-content">

    <div class="BlogGrid">

        <article class="FeaturedCard" aria-labelledby="featured-card-heading">
            <div class="FeaturedCard-primary">
                <header>
                    <h3 class="FeaturedCard-title Heading Heading--secondary" id="featured-card-heading"><a href="">Jon smells like cabbages</a></h3>
                </header>
                <div class="FeaturedCard-category">Process, featured</div>
                <div class="FeaturedCard-description"></div>
            </div>
            <!--/.Featured-primary-->
            <div class="FeaturedCard-secondary">
                <div class="Author">
                    <img class="Author-image" src="/assets/img/team/voice/graham.png" alt="Graham Smith">
                    <div class="Author-name">Graham Smith</div>
                </div>
                <!--/.Author-->
            </div>
            <!--/.Featured-secondary-->
        </article>
        <!--/.Featured-card-->

        <div class="BlogGrid-container">
            <div class="BlogGrid-item">

                <article class="Card " aria-labelledby="card-0-heading">
                    <div class="Card-primary">
                        <header>
                            <h2 class="Card-title" id="card-0-heading">Article name here</h2>

                        </header>
                        <div class="Card-category">Opinion</div>
                        <p class="Card-description">Tempora expedita et ut beatae voluptates. Sint consectetur excepturi ipsam eos veniam et molestiae veniam. Et ducimus eum qui maiores rerum. Esse est et consectetur maxime. Deserunt qui sit consectetur ex laudantium dolores ab
                            omnis. Mollitia quibusdam laboriosam dolorum deserunt magni molestiae aut.</p>
                        <div class="Card-author">
                            <div class="Author">
                                <img class="Author-image" src="/assets/img/team/voice/graham.png" alt="Graham Smith">
                                <div class="Author-name">Graham Smith</div>
                            </div>
                            <!--/.Author-->
                        </div>
                        <!--/.Card-author-->
                    </div>
                    <!--/.Card-primary-->
                </article>
                <!--/.Card-->
            </div>
            <div class="BlogGrid-item">

                <article class="Card " aria-labelledby="card-1-heading">
                    <div class="Card-primary">
                        <header>
                            <h2 class="Card-title" id="card-1-heading">Article name here</h2>

                        </header>
                        <div class="Card-category">Opinion</div>
                        <p class="Card-description">Molestiae veritatis occaecati tenetur quibusdam fuga voluptas nihil quia ullam. Omnis facere aut qui fugiat quam deserunt. Sed enim voluptatibus.</p>
                        <div class="Card-author">
                            <div class="Author">
                                <img class="Author-image" src="/assets/img/team/voice/graham.png" alt="Graham Smith">
                                <div class="Author-name">Graham Smith</div>
                            </div>
                            <!--/.Author-->
                        </div>
                        <!--/.Card-author-->
                    </div>
                    <!--/.Card-primary-->
                </article>
                <!--/.Card-->
            </div>
            <div class="BlogGrid-item">

                <article class="Card " aria-labelledby="card-2-heading">
                    <div class="Card-primary">
                        <header>
                            <h2 class="Card-title" id="card-2-heading">Article name here</h2>

                        </header>
                        <div class="Card-category">Opinion</div>
                        <p class="Card-description">Odio pariatur ab sit consequatur libero. Officia iure quo aut reprehenderit sint adipisci expedita accusantium quis. Accusantium odio quae voluptates quasi odio. Aut voluptas vitae aliquam dolores et et consequatur est. Et dolor
                            distinctio. Repudiandae quae vero.</p>
                        <div class="Card-author">
                            <div class="Author">
                                <img class="Author-image" src="/assets/img/team/voice/graham.png" alt="Graham Smith">
                                <div class="Author-name">Graham Smith</div>
                            </div>
                            <!--/.Author-->
                        </div>
                        <!--/.Card-author-->
                    </div>
                    <!--/.Card-primary-->
                </article>
                <!--/.Card-->
            </div>
            <div class="BlogGrid-item">

                <article class="Card " aria-labelledby="card-3-heading">
                    <div class="Card-primary">
                        <header>
                            <h2 class="Card-title" id="card-3-heading">Article name here</h2>

                        </header>
                        <div class="Card-category">Opinion</div>
                        <p class="Card-description">Earum voluptatem dolorum maxime. Expedita vitae dolorem et aut. Eum perferendis exercitationem. Aperiam voluptatibus et.</p>
                        <div class="Card-author">
                            <div class="Author">
                                <img class="Author-image" src="/assets/img/team/voice/graham.png" alt="Graham Smith">
                                <div class="Author-name">Graham Smith</div>
                            </div>
                            <!--/.Author-->
                        </div>
                        <!--/.Card-author-->
                    </div>
                    <!--/.Card-primary-->
                </article>
                <!--/.Card-->
            </div>
            <div class="BlogGrid-item">

                <article class="Card " aria-labelledby="card-4-heading">
                    <div class="Card-primary">
                        <header>
                            <h2 class="Card-title" id="card-4-heading">Article name here</h2>

                        </header>
                        <div class="Card-category">Opinion</div>
                        <p class="Card-description">Enim deleniti enim id est corrupti dicta. Enim corporis quo sint dolores. Expedita omnis eum sed quod repellendus nemo accusamus dolore. Dolores quia est atque eos omnis dicta et est consequatur. Voluptatibus quas numquam minima
                            autem.</p>
                        <div class="Card-author">
                            <div class="Author">
                                <img class="Author-image" src="/assets/img/team/voice/graham.png" alt="Graham Smith">
                                <div class="Author-name">Graham Smith</div>
                            </div>
                            <!--/.Author-->
                        </div>
                        <!--/.Card-author-->
                    </div>
                    <!--/.Card-primary-->
                </article>
                <!--/.Card-->
            </div>
            <div class="BlogGrid-item">

                <article class="Card " aria-labelledby="card-5-heading">
                    <div class="Card-primary">
                        <header>
                            <h2 class="Card-title" id="card-5-heading">Article name here</h2>

                        </header>
                        <div class="Card-category">Opinion</div>
                        <p class="Card-description">Rem optio quis. Et repellendus est dolorum aut. Molestias dignissimos in. Quo officia qui dignissimos officia. Officia molestiae accusamus magni minima cumque sit ipsum porro.</p>
                        <div class="Card-author">
                            <div class="Author">
                                <img class="Author-image" src="/assets/img/team/voice/graham.png" alt="Graham Smith">
                                <div class="Author-name">Graham Smith</div>
                            </div>
                            <!--/.Author-->
                        </div>
                        <!--/.Card-author-->
                    </div>
                    <!--/.Card-primary-->
                </article>
                <!--/.Card-->
            </div>
            <div class="BlogGrid-item">

                <article class="Card " aria-labelledby="card-6-heading">
                    <div class="Card-primary">
                        <header>
                            <h2 class="Card-title" id="card-6-heading">Article name here</h2>

                        </header>
                        <div class="Card-category">Opinion</div>
                        <p class="Card-description">Inventore illum id vel nihil saepe. Enim sapiente repellat et. Debitis corporis beatae aspernatur aspernatur. Ut et quam ullam magni dolore amet. Itaque et eum repudiandae. Aut officiis eius quaerat non autem.</p>
                        <div class="Card-author">
                            <div class="Author">
                                <img class="Author-image" src="/assets/img/team/voice/graham.png" alt="Graham Smith">
                                <div class="Author-name">Graham Smith</div>
                            </div>
                            <!--/.Author-->
                        </div>
                        <!--/.Card-author-->
                    </div>
                    <!--/.Card-primary-->
                </article>
                <!--/.Card-->
            </div>
            <div class="BlogGrid-item">

                <article class="Card " aria-labelledby="card-7-heading">
                    <div class="Card-primary">
                        <header>
                            <h2 class="Card-title" id="card-7-heading">Article name here</h2>

                        </header>
                        <div class="Card-category">Opinion</div>
                        <p class="Card-description">Voluptates occaecati quasi minima aliquam sint labore nisi et doloribus. Veritatis sit quia repudiandae minima animi libero rerum enim perspiciatis. Explicabo at delectus dolorem libero et dolorem. Officia commodi beatae sint.</p>
                        <div class="Card-author">
                            <div class="Author">
                                <img class="Author-image" src="/assets/img/team/voice/graham.png" alt="Graham Smith">
                                <div class="Author-name">Graham Smith</div>
                            </div>
                            <!--/.Author-->
                        </div>
                        <!--/.Card-author-->
                    </div>
                    <!--/.Card-primary-->
                </article>
                <!--/.Card-->
            </div>
            <div class="BlogGrid-item">

                <article class="Card " aria-labelledby="card-8-heading">
                    <div class="Card-primary">
                        <header>
                            <h2 class="Card-title" id="card-8-heading">Article name here</h2>

                        </header>
                        <div class="Card-category">Opinion</div>
                        <p class="Card-description">Qui rerum voluptatum consequatur labore eum omnis nam aut omnis. Iste consequuntur quam sint molestiae atque. Molestias ipsa qui accusamus nostrum quibusdam sed sunt.</p>
                        <div class="Card-author">
                            <div class="Author">
                                <img class="Author-image" src="/assets/img/team/voice/graham.png" alt="Graham Smith">
                                <div class="Author-name">Graham Smith</div>
                            </div>
                            <!--/.Author-->
                        </div>
                        <!--/.Card-author-->
                    </div>
                    <!--/.Card-primary-->
                </article>
                <!--/.Card-->
            </div>
            <div class="BlogGrid-item">

                <article class="Card " aria-labelledby="card-9-heading">
                    <div class="Card-primary">
                        <header>
                            <h2 class="Card-title" id="card-9-heading">Article name here</h2>

                        </header>
                        <div class="Card-category">Opinion</div>
                        <p class="Card-description">Qui sunt sed commodi cupiditate natus eligendi maxime. Tempora et magnam nulla et eius pariatur ducimus. Eum inventore eligendi reiciendis. Ut eum facere ullam. Voluptas nihil blanditiis omnis. Et rerum ipsam fuga non ullam.</p>
                        <div class="Card-author">
                            <div class="Author">
                                <img class="Author-image" src="/assets/img/team/voice/graham.png" alt="Graham Smith">
                                <div class="Author-name">Graham Smith</div>
                            </div>
                            <!--/.Author-->
                        </div>
                        <!--/.Card-author-->
                    </div>
                    <!--/.Card-primary-->
                </article>
                <!--/.Card-->
            </div>
            <div class="BlogGrid-item">

                <article class="Card " aria-labelledby="card-10-heading">
                    <div class="Card-primary">
                        <header>
                            <h2 class="Card-title" id="card-10-heading">Article name here</h2>

                        </header>
                        <div class="Card-category">Opinion</div>
                        <p class="Card-description">Ut ratione natus ipsa nobis labore laudantium. Ut ipsa expedita nam ex soluta quod. Provident quia ratione in in.</p>
                        <div class="Card-author">
                            <div class="Author">
                                <img class="Author-image" src="/assets/img/team/voice/graham.png" alt="Graham Smith">
                                <div class="Author-name">Graham Smith</div>
                            </div>
                            <!--/.Author-->
                        </div>
                        <!--/.Card-author-->
                    </div>
                    <!--/.Card-primary-->
                </article>
                <!--/.Card-->
            </div>
            <div class="BlogGrid-item">

                <article class="Card " aria-labelledby="card-11-heading">
                    <div class="Card-primary">
                        <header>
                            <h2 class="Card-title" id="card-11-heading">Article name here</h2>

                        </header>
                        <div class="Card-category">Opinion</div>
                        <p class="Card-description">Voluptates quo in corrupti voluptas. Ab rerum ut occaecati commodi voluptatem cupiditate earum omnis laborum. Ad non a. Aliquid illo occaecati ex. Voluptatem dicta minus hic quas sapiente omnis quod aut doloremque.</p>
                        <div class="Card-author">
                            <div class="Author">
                                <img class="Author-image" src="/assets/img/team/voice/graham.png" alt="Graham Smith">
                                <div class="Author-name">Graham Smith</div>
                            </div>
                            <!--/.Author-->
                        </div>
                        <!--/.Card-author-->
                    </div>
                    <!--/.Card-primary-->
                </article>
                <!--/.Card-->
            </div>
        </div>
        <!--/.Blog-container-->

    </div>
    <!--/.Blog-grid-->

    <div class="Pagination">
        <ol class="Pagination-list">
            <li><a class="Pagination-item" href="">1</a></li>
            <li><a class="Pagination-item" href="">2</a></li>
            <li><a class="Pagination-item" href="">3</a></li>
            <li><a class="Pagination-item" href="">4</a></li>
        </ol>
        <!--/.Pagination-list-->
    </div>
    <!--/.Pagination-->

</main>

<footer class="SiteFooter">
    <div class="SiteFooter-container">
        <div class="SiteFooter-callToAction">
            <div class="InputGroup InputGroup--highlight">
                <form action="" method="post">
                    <input type="hidden" value="1" name="embed">
                    <label class="InputGroup-label Heading Heading--bump" for="ID2">Get notified with updates</label>
                    <div class="Input InputGroup-combo">
                        <input class="InputGroup-field" type="email" name="email" placeholder="Enter email address" id="ID2" />
                        <button type="submit" class="InputGroup-submit">Join the mailing list</button>
                    </div>
                </form>
                <small class="InputGroup-microcopy">Low volume mailing list. Just for events & conference updates. <a href="#">See an example</a></small>
            </div>
            <small class="Heading Heading--context"></small>
        </div>

        <nav class="SiteFooter-navigation" aria-label="Site Footer Navigation">
            <ul class="SiteFooter-navigationLinks">
                <li class="SiteFooter-navigationItem"><a href="#" class="SiteFooter-navigationLink">Test Lab</a></li>
                <li class="SiteFooter-navigationItem"><a href="#" class="SiteFooter-navigationLink">Accessibility</a></li>
                <li class="SiteFooter-navigationItem"><a href="#" class="SiteFooter-navigationLink">Cookies</a></li>
                <li class="SiteFooter-navigationItem"><a href="#" class="SiteFooter-navigationLink">Styleguide</a></li>
                <li class="SiteFooter-navigationItem"><a href="#" class="SiteFooter-navigationLink">Jobs</a></li>
            </ul>
            <!--/.SiteFooter-navigationLinks-->
            <ul class="SiteFooter-icons">
                <li class="SiteFooter-icon"><a class="SiteFooter-iconLink" href="#"><img src="/assets/img/icons/icon-github.svg" alt="Find us on Github"></a></li>
                <li class="SiteFooter-icon"><a class="SiteFooter-iconLink" href="#"><img src="/assets/img/icons/icon-instagram.svg" alt="Find us on Instagram"></a></li>
                <li class="SiteFooter-icon"><a class="SiteFooter-iconLink" href="#"><img src="/assets/img/icons/icon-linkedin.svg" alt="Find us on LinkedIn"></a></li>
                <li class="SiteFooter-icon"><a class="SiteFooter-iconLink" href="#"><img src="/assets/img/icons/icon-medium.svg" alt="Find us on Medium"></a></li>
                <li class="SiteFooter-icon"><a class="SiteFooter-iconLink" href="#"><img src="/assets/img/icons/icon-flickr.svg" alt="Find us on Flickr"></a></li>
            </ul>
            <!--/.SiteFooter-icons-->
        </nav>
        <div class="SiteFooter-small">
            © 2005‑now Clearleft Ltd. All rights reserved.
        </div>
        <!--/.SiteFooter-small-->
    </div>
    <!--/.Cols-->
</footer>
<!--/.SiteFooter-->
<div class="Background Background--grey">
    {% include '@site-header' %}
    {% include '@masthead' %}
</div>

<main id="main-content">

    <div class="BlogGrid">

        {% include '@featured-card' %}

        <div class="BlogGrid-container">
            {% for post in posts %}
            <div class="BlogGrid-item">
                {% include '@card' with post %}
            </div>
            {% endfor %}
        </div><!--/.Blog-container-->

    </div><!--/.Blog-grid-->

    {% include '@pagination' %}

</main>

{% include '@site-footer' %}
{
  "primaryNavlinks": [
    {
      "title": "Case Studies",
      "url": "#",
      "primaryActive": true
    },
    {
      "title": "Team",
      "url": "#"
    },
    {
      "title": "Posts",
      "url": "#"
    },
    {
      "title": "Events",
      "url": "#"
    },
    {
      "title": "Contact",
      "url": "#"
    }
  ],
  "mastheadTitle": "Show me",
  "mastheadModifier": "--chimney",
  "selectorID": "categories",
  "triggerContent": "all posts",
  "triggerClass": "Heading Heading--main",
  "targetClass": "Container Background--carribean-green",
  "listContext": {
    "listClass": null,
    "listItemClass": "Heading Heading--secondary",
    "linkClass": null,
    "listItems": [
      {
        "url": "#",
        "content": "opinions"
      },
      {
        "url": "#",
        "content": "announcements"
      },
      {
        "url": "#",
        "content": "podcasts"
      },
      {
        "url": "#",
        "content": "tiny lessons"
      },
      {
        "url": "#",
        "content": "all posts"
      }
    ]
  },
  "featuredCardTitle": "Jon smells like cabbages",
  "featuredCardCategory": "Process",
  "authorImage": "/assets/img/team/voice/graham.png",
  "authorName": "Graham Smith",
  "posts": [
    {
      "cardTitle": "Article name here",
      "cardCategory": "Opinion",
      "cardDescription": "Tempora expedita et ut beatae voluptates. Sint consectetur excepturi ipsam eos veniam et molestiae veniam. Et ducimus eum qui maiores rerum. Esse est et consectetur maxime. Deserunt qui sit consectetur ex laudantium dolores ab omnis. Mollitia quibusdam laboriosam dolorum deserunt magni molestiae aut.",
      "cardId": "card-0"
    },
    {
      "cardTitle": "Article name here",
      "cardCategory": "Opinion",
      "cardDescription": "Molestiae veritatis occaecati tenetur quibusdam fuga voluptas nihil quia ullam. Omnis facere aut qui fugiat quam deserunt. Sed enim voluptatibus.",
      "cardId": "card-1"
    },
    {
      "cardTitle": "Article name here",
      "cardCategory": "Opinion",
      "cardDescription": "Odio pariatur ab sit consequatur libero. Officia iure quo aut reprehenderit sint adipisci expedita accusantium quis. Accusantium odio quae voluptates quasi odio. Aut voluptas vitae aliquam dolores et et consequatur est. Et dolor distinctio. Repudiandae quae vero.",
      "cardId": "card-2"
    },
    {
      "cardTitle": "Article name here",
      "cardCategory": "Opinion",
      "cardDescription": "Earum voluptatem dolorum maxime. Expedita vitae dolorem et aut. Eum perferendis exercitationem. Aperiam voluptatibus et.",
      "cardId": "card-3"
    },
    {
      "cardTitle": "Article name here",
      "cardCategory": "Opinion",
      "cardDescription": "Enim deleniti enim id est corrupti dicta. Enim corporis quo sint dolores. Expedita omnis eum sed quod repellendus nemo accusamus dolore. Dolores quia est atque eos omnis dicta et est consequatur. Voluptatibus quas numquam minima autem.",
      "cardId": "card-4"
    },
    {
      "cardTitle": "Article name here",
      "cardCategory": "Opinion",
      "cardDescription": "Rem optio quis. Et repellendus est dolorum aut. Molestias dignissimos in. Quo officia qui dignissimos officia. Officia molestiae accusamus magni minima cumque sit ipsum porro.",
      "cardId": "card-5"
    },
    {
      "cardTitle": "Article name here",
      "cardCategory": "Opinion",
      "cardDescription": "Inventore illum id vel nihil saepe. Enim sapiente repellat et. Debitis corporis beatae aspernatur aspernatur. Ut et quam ullam magni dolore amet. Itaque et eum repudiandae. Aut officiis eius quaerat non autem.",
      "cardId": "card-6"
    },
    {
      "cardTitle": "Article name here",
      "cardCategory": "Opinion",
      "cardDescription": "Voluptates occaecati quasi minima aliquam sint labore nisi et doloribus. Veritatis sit quia repudiandae minima animi libero rerum enim perspiciatis. Explicabo at delectus dolorem libero et dolorem. Officia commodi beatae sint.",
      "cardId": "card-7"
    },
    {
      "cardTitle": "Article name here",
      "cardCategory": "Opinion",
      "cardDescription": "Qui rerum voluptatum consequatur labore eum omnis nam aut omnis. Iste consequuntur quam sint molestiae atque. Molestias ipsa qui accusamus nostrum quibusdam sed sunt.",
      "cardId": "card-8"
    },
    {
      "cardTitle": "Article name here",
      "cardCategory": "Opinion",
      "cardDescription": "Qui sunt sed commodi cupiditate natus eligendi maxime. Tempora et magnam nulla et eius pariatur ducimus. Eum inventore eligendi reiciendis. Ut eum facere ullam. Voluptas nihil blanditiis omnis. Et rerum ipsam fuga non ullam.",
      "cardId": "card-9"
    },
    {
      "cardTitle": "Article name here",
      "cardCategory": "Opinion",
      "cardDescription": "Ut ratione natus ipsa nobis labore laudantium. Ut ipsa expedita nam ex soluta quod. Provident quia ratione in in.",
      "cardId": "card-10"
    },
    {
      "cardTitle": "Article name here",
      "cardCategory": "Opinion",
      "cardDescription": "Voluptates quo in corrupti voluptas. Ab rerum ut occaecati commodi voluptatem cupiditate earum omnis laborum. Ad non a. Aliquid illo occaecati ex. Voluptatem dicta minus hic quas sapiente omnis quod aut doloremque.",
      "cardId": "card-11"
    }
  ],
  "cardTitle": "Article Title Goes here",
  "items": [
    {
      "pageNumber": 1
    },
    {
      "pageNumber": 2
    },
    {
      "pageNumber": 3
    },
    {
      "pageNumber": 4
    }
  ],
  "footerLinks": [
    {
      "title": "Test Lab",
      "url": "#"
    },
    {
      "title": "Accessibility",
      "url": "#"
    },
    {
      "title": "Cookies",
      "url": "#"
    },
    {
      "title": "Styleguide",
      "url": "#"
    },
    {
      "title": "Jobs",
      "url": "#"
    }
  ],
  "socialLinks": [
    {
      "url": "#",
      "imgSrc": "/assets/img/icons/icon-github.svg",
      "alt": "Find us on Github"
    },
    {
      "url": "#",
      "imgSrc": "/assets/img/icons/icon-instagram.svg",
      "alt": "Find us on Instagram"
    },
    {
      "url": "#",
      "imgSrc": "/assets/img/icons/icon-linkedin.svg",
      "alt": "Find us on LinkedIn"
    },
    {
      "url": "#",
      "imgSrc": "/assets/img/icons/icon-medium.svg",
      "alt": "Find us on Medium"
    },
    {
      "url": "#",
      "imgSrc": "/assets/img/icons/icon-flickr.svg",
      "alt": "Find us on Flickr"
    }
  ],
  "inputGroupLabel": "Get notified with updates",
  "inputGroupSubmit": "Join the mailing list",
  "inputGroupID": "ID2",
  "inputGroupPlaceholder": "Enter email address",
  "inputGroupMicrocopy": "Low volume mailing list. Just for events & conference updates. <a href=\"#\">See an example</a>",
  "inputGroupModifiers": "highlight",
  "siteFooterSmall": "© 2005‑now Clearleft Ltd. All rights reserved."
}

There are no notes for this item.