{% include head.html %}
<body>
<div class="site-ctr">
<!-- Navbar -->
{% include nav.html %}
<!-- <div style="height:5vh"></div> -->
<!-- Header -->
<!-- <div class="header">
<div class="container">
<div class="content">
</div>
</div>
<div class="header-gap"></div>
</div> -->
<div class="reactive-bg">
<div class="post container" >
<h1>Blog Posts</h1>
<hr>
{% assign i = 0 %}
{% for post in site.posts %}
{% if i == 0 %}
<div class="post-preview">
<div class="card">
<div class="card-header">
Featured Post
</div>
<div class="card-body">
<h5 class="card-title">{{post.title}}</h5>
<p class="card-text">{{post.description}}</p>
<a href="{{post.url}}" class="btn btn-primary">View</a>
</div>
</div>
</div>
<div style="height:50px"></div>
<div class="list-group" id="posts">
<a href="#posts" class="list-group-item list-group-item-action list-group-item-dark">Other Posts</a>
{% else %}
<a href="{{post.url}}" class="list-group-item list-group-item-action">
<div class="d-flex w-100 justify-content-between">
<h5 class="mb-1">{{post.title}}</h5>
<!-- <small>{{post.date}}</small> -->
</div>
<p class="card-text">{{post.description}}</p>
</a>
{% endif %}
{% assign i = i | plus:1 %}
{% endfor %}
</div>
</div>
</div>
</div>
{% include footer.html %}
</body>