{% extends "base.html" %}
{% block content %}
    <div class="container mx-auto">
        <div class="row">
            <div class="col text-center mt-2">
                <h2 style="font-weight: bold; letter-spacing: 4px;">{{ category_obj.display_name }}</h2>
            </div>
        </div>
        <div class="row">
            <div class="col">

            </div>
            <div class="col col-9 ">
                <div class="container">
                    <div class="list-group bg-dark text-center">
                    {% for topic in topics %}
                        <button onclick='window.open("/topic/{{ category_obj.title }}/{{topic.title}}", "_self");' type="button" class="list-group-item list-group-item-action">{{ topic.title }}</button>
                    {% endfor %}
                    </div>
                </div>
            </div>
            <div class="col">

            </div>
        </div>
    </div>
{% endblock content %}