{% macro portfolioItem(title, description, link, site="GitHub ↗") -%}
<style>
    .portfolioItem {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        background-color: #12181b;
        padding: 20px;
        border: 1px solid #EEEEEE;
        border-radius: 4px;
        box-shadow: 0px 0px 8px #12181b;
        width: 40%;
    }

    .portfolioItem h3 {
        margin: 0px;
    }

    .portfolioItem p {
        flex-grow: 1;
    }
</style>

<div class="portfolioItem">
    <h3>{{title}}</h3>
    <p>{{description}}</p>
    <a href={{link}} target="_blank">{{site}}</a>
</div>
{%- endmacro %}