<main role="main" class="bg-dark2" >
    <%- partial('_partial/logo', { created_by : false }) %>
    <div class="container">
        <div class="row">
            <div class="col-12">
                <h2 class="group-header">Games</h2>
            </div>
        </div>
        <% site.posts.forEach(content => { %>
            <% if(content.content_type == "game") { %>
                <div class="card card-dark hoverable" style="margin-bottom: 20px;">
                    <div class="row">
                        <div class="col-6">
                            <a href="<%- content.path %>">
                                <img src="/games/<%- content.id %>/main-capsule.png" alt="..." 
                                    style="width: 100%;">
                            </a>
                        </div>
                        <div class="col-6">
                            <div class="card-body">
                                <h5 class="card-title">
                                    <a href="<%- content.path %>">
                                        <%- content.title %>
                                    </a>
                                </h5>
                                <p class="card-text" style="margin-bottom: 12px;">
                                    <%- content.short_description %><br>
                                </p>
                                <p class="card-text" style="margin-bottom: 12px;">
                                    <small>
                                        <% if(content.released) { %>
                                            Released: <%- content.release %>
                                        <% } else { %>
                                            Release date: <%- content.release %>
                                        <% } %>
                                    </small>
                                </p>
                                <p class="card-text" style="position: absolute; bottom: 12px;">
                                    <small>
                                        <br><%- content.platforms %>
                                    </small>
                                </p>
                                
                            </div>
                        </div>
                    </div>
                    
                </div>
            <% } %>
        <% }); %>
    </div>
    <%- partial('_partial/about') %>
    <%- partial('_partial/links') %>
</main>