{% extends "base.html" %} {% from "macros.html" import conference_row with context %} {% block style %} {% set column_count = 6 %} <style> .grid-container { display: grid; grid-template-columns: repeat({{ column_count }}, auto); /* 7 columns for each piece of information */ gap: 10px; justify-content: start; } .grid-item { /* Additional styling for grid items can go here */ } .heading { grid-column: 1 / {{ column_count + 1 }}; /* Spans from the 1st line to the 7th line */ } </style> {% endblock %} {% macro section(heading, item_list, badge) %} {% if item_list %} <div class="heading"><h2>{{ heading }}</h2></div> {% for item in item_list %}{{ conference_row(item, badge) }}{% endfor %} {% endif %} {% endmacro %} {% block content %} <div class="container-fluid mt-2"> <h1>Conferences</h1> <div class="grid-container"> {{ section("Current", current, "attending") }} {{ section("Future", future, "going") }} {{ section("Past", past|reverse, "went") }} </div> </div> {% endblock %}