{% for class_ in list_of_classes%}
<div class="col">
    <div class="card">
      <img src="https://picsum.photos/200/10{{loop.index0}}" class="card-img-top" alt="...">
      <div class="card-body">
        <h5 class="card-title text-center"><strong>{{class_['className']}}</strong></h5>
        <p class="card-text mb-0 mp-0"><strong>Invite Code:</strong> {{class_['classCode'].upper()}}</p>
        <label class="form-check-label text-center" for="qbankName"> <strong>Current Topic</strong> </label>
        <select class="form-select topics" name='topicSelector' class_id="{{class_['_id']}}" aria-label="topic selector">
            {% for qb in qbs %}
                {% if class_['selected_qb'] == qb['_id'] %}
                  {% for topic in qb['topicList'] %}
                    {% if topic == class_['currentTopic'] %}
                      <option selected value="{{topic}}">{{topic}} (Current)</option>
                    {%else%}
                      <option value="{{topic}}">{{topic}}</option>
                    {%endif%}
                  {%endfor%}
                {%endif%}
            {%endfor%}
        </select>
    </div>
    <button type="button" class="btn btn-outline-success editClass" data-bs-toggle="modal" data-bs-target="#modal{{class_['_id']}}">
    Edit Class
    </button>
    </div>
</div>
{% include 'modular/cards/professor_modals.html' %}
{%endfor%}