{{!< default}}

<div class="mind-site-title unselectable" id="vantajs">
  			<h1>{{@site.title}}</h1>
        <i class="arrow-down"></i>
</div>


<main>
  <nav class="navbar-secondary unselectable">
    {{navigation type="secondary"}}
  </nav>
  <div class="mind-content_main">
    <div class="mind-feed_main">

      <!-- Looping through every post -->
      {{#foreach posts}}
      	<article class="{{post_class}}">
          <a class="post-card_main" href="{{url}}">
            <img class="post-card_feature-image" src="{{img_url feature_image size="m"}}" />
         		<header class="post-card_header">
              <p class="post-card_meta"><span class="post-card_tag">{{primary_tag.name}}</span> • <time class="post-date" datetime="{{date format='YYYY-MM-DD'}}">{{date format="DD MMMM YYYY"}}</time></p>
           		<h3>{{title}}</h3>
            </header>
            <section class="post-card_excerpt">
         			<p>{{excerpt words="26"}}</p>
            </section>
            <footer class="post-card_footer">
              {{primary_author.name}}
              {{#if primary_author.profile_image}}<img class="post-card_author-image" src="{{img_url primary_author.profile_image size="xxs"}}" alt="Author image" />{{/if}}
            </footer>
          </a>
        </article>
      {{/foreach}}
    </div>
  </div>
</main>

<!-- Vanta.JS Scripts to make the background cool, but disabled on mobile -->
<script>
	if(window.screen.width > 800)
	{
		document.write('<script src="{{asset "js/three.r95.min.js"}}"><\/script>' +
					   '<script src="{{asset "js/vanta.net.min.js"}}"><\/script>' +
					   '<script>' +
					   		'VANTA.NET({'+
					   			'el: "#vantajs",'+
					   			'color: 0x3fd5ff,'+
						   		'backgroundColor: 0x190f2b,'+
						   		'mouseControls: true,'+
					   			'touchControls: true,'+
					   			'minHeight: 200.00,'+
					   			'minWidth: 200.00,'+
					   			'scale: 1.00,'+
					   			'scaleMobile: 1.00'+
							'})'+
						'<\/script>');
    }
</script>