<!-- Error rendering component -->
<!-- Error: Template @breadcrumb-slat not found -->
<!-- Error: Error: Template @breadcrumb-slat not found
    at /opt/build/repo/node_modules/@frctl/twig/src/adapter.js:156:24
    at new Promise (<anonymous>)
    at TwigAdapter.render (/opt/build/repo/node_modules/@frctl/twig/src/adapter.js:134:16)
    at ComponentSource._renderVariant (/opt/build/repo/node_modules/@frctl/fractal/src/api/components/source.js:212:30)
    at _renderVariant.next (<anonymous>)
    at onFulfilled (/opt/build/repo/node_modules/co/index.js:65:19) -->
<section class="Global-header">
  {% include '@header' with header %}

  {% include '@breadcrumb-slat' with breadcrumb %}

  {% include '@page-header' with pageheader %}
</section>

<main class="Slat">
  <div class="constrain flow--s-l">
    <div class="grid grid--swap grid--of-two">
      <figure class="Headshot">
        {% if image %}
          {% include '@team-photo' with {
            src: image,
            alt: name
          } %}
        {% endif %}

        {% if socialItems|length %}
          {% include '@social' with {
            socialItems: socialItems,
            name: name
          } %}
        {% endif %}
      </figure>

      <div class="flow--l">
        <article class="body flow">
          {{ content }}
        </article>

        {% include '@inline-logos' with {
          logos: clientLogos
        } %}

        {% if promo.content %}
          {% include '@promo' with promo %}
        {% endif %}
      </div>
    </div>
  </div>
</main>

<aside class="Slat Slat--border-y constrain">
  <div class="Slat__content{{
    activity and hasRelatedPosts
      ? ' grid grid--v-gap grid--of-two'
      : activity ? ' grid grid--8/4' : ''
    }}">
    {% if activity %}
      <div class="flow--gutter">
        <h3 class="eyebrow eyebrow--black">
          {{ name }} is currently
        </h3>
        {% set authorImage = entry.authorImage.one() %}
        {% include '@is-currently' with {
          quote: activity.title,
          image: activity.image,
          large: not hasRelatedPosts
        } %}
      </div>
    {% endif %}

    {% if hasRelatedPosts %}
      <div class="flow--gutter">
        <header class="micro-grid micro-grid--small micro-grid--v-xs">
          <h3 class="eyebrow eyebrow--black">
            Recent thoughts
          </h3>

          {% include '@twi' with {
            icon: 'arrow-right',
            text: 'View all',
            link: '#',
            size: 's'
          } %}
        </header>
        <ul class="micro-grid micro-grid--small" role="list">
          {% for post in relatedPosts %}
            <li>
              {% include '@article-signpost' with {
                link: '#',
                title: post.title,
                description: post.standfirst,
                eyebrow: post.type
              } %}
            </li>
          {% endfor %}
        </ul>
      </div>
    {% endif %}
  </div>
</aside>

{% include '@team-listing' with team %}

{% include '@footer' %}
{
  "header": {
    "match": "",
    "links": [
      {
        "url": "#",
        "title": "Services"
      },
      {
        "url": "#",
        "title": "Work"
      },
      {
        "url": "#",
        "title": "Thinking"
      },
      {
        "url": "#",
        "title": "About"
      },
      {
        "url": "#",
        "title": "Contact"
      }
    ]
  },
  "pageheader": {
    "title": {
      "text": "Jeremy Keith",
      "moustache": "Founder"
    },
    "content": {
      "standfirst": "<p>Jeremy made his first website for a band he was playing with in Germany in 1997. He founded Clearleft with Andy Budd and Richard Rutter in 2005.</p>"
    }
  },
  "breadcrumb": {
    "title": "Who we are",
    "link": "#"
  },
  "name": "Jeremy",
  "image": "/v6-assets/img/jeremy-keith-2x.jpg",
  "content": "<p>Before co-founding Clearleft, Jeremy was a freelancer front-end developer, working with HTML, CSS, and JavaScript. Jeremy acts as the Research and Development wing of Clearleft; investigating new technologies, trying out new techniques, and keeping abreast of the ever-changing world of web development.</p>\n    <p>Jeremy curated our conferences <a href=\"http://responsiveconf.com/\">Responsive Day Out</a> and <a href=\"https://patternsday.com/\">Patterns Day</a>, and now hosts the <a href=\"https://podcast.clearleft.com/\">Clearleft podcast</a>.</p>\n    <p>Jeremy has provided performance consultation for the likes of:</p>",
  "clientLogos": [
    {
      "url": "https://via.placeholder.com/300x150",
      "alt": ""
    },
    {
      "url": "https://via.placeholder.com/150x300",
      "alt": ""
    },
    {
      "url": "https://via.placeholder.com/150x150",
      "alt": ""
    }
  ],
  "promo": {
    "content": "<h2>Heading</h2><p>Maecenas faucibus mollis interdum. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Nullam quis risus eget urna mollis ornare vel eu leo. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean lacinia bibendum nulla sed consectetur.</p>",
    "link": "#",
    "linkLabel": "Find out more"
  },
  "socialItems": [
    {
      "icon": "web",
      "name": "Web",
      "url": "#"
    },
    {
      "icon": "twitter",
      "name": "Twitter",
      "url": "#"
    },
    {
      "icon": "github",
      "name": "GitHub",
      "url": "#"
    }
  ],
  "team": {
    "eyebrow": "Jeremy works with",
    "team": [
      {
        "url": "#",
        "title": "Jeremy Keith",
        "role": "Founder",
        "image": {
          "alt": "Jeremy Keith",
          "src": "/v6-assets/img/jeremy-keith-2x.jpg"
        }
      },
      {
        "url": "#",
        "title": "Jeremy Keith",
        "role": "Founder"
      },
      {
        "url": "#",
        "title": "Jeremy Keith",
        "role": "Founder",
        "image": {
          "alt": "Jeremy Keith",
          "src": "/v6-assets/img/jeremy-keith-2x.jpg"
        }
      },
      {
        "url": "#",
        "title": "Jeremy Keith",
        "role": "Founder",
        "image": {
          "alt": "Jeremy Keith",
          "src": "/v6-assets/img/jeremy-keith-2x.jpg"
        }
      }
    ]
  },
  "activity": {
    "name": "Jeremy",
    "title": "Creating a digital-first brand for a brilliant new educational activities platform",
    "url": "#",
    "image": {
      "src": "/v6-assets/img/author-image.png",
      "alt": ""
    }
  },
  "hasRelatedPosts": true,
  "relatedPosts": [
    {
      "title": "Authentication",
      "standfirst": "<p>Some ways of combining security and usability for two-factor authentication on the web.</p>",
      "type": "advice"
    },
    {
      "title": "Authentication",
      "standfirst": "<p>Some ways of combining security and usability for two-factor authentication on the web.</p>",
      "type": "advice"
    }
  ]
}

No notes defined.