<div class="row">
    <div class="col-md-6">
        <h3 class="text-center">Variables by run number</h3>
        <div class="row" id="current_variables_by_run">
            <div class="col-md-12">
                <div class="panel panel-primary">
                    <div class="panel-heading">
                        <div class="panel-title">Current Variables</div>
                    </div>
                    <div class="panel-body">
                            {% if current_variables.variables %}
                                {% include "snippets/variables.html" with instrument_variables=current_variables instrument=instrument csrf_token=csrf_token upcoming=False only %}
                            {% else %}
                                <h4>No current variables found</h4>
                            {% endif %}
                        </div>
                    </div>
                </div>
            </div>
        {% if upcoming_variables_by_run %}
            <div class="row" id="upcoming_variables_by_run">
                <div class="col-md-12">
                    <div class="panel panel-primary">
                        <div class="panel-heading">
                            <div class="panel-title">Upcoming Variables</div>
                        </div>
                        <div class="panel-body zebra-rows">
                            {% for upcoming_variable in upcoming_variables_by_run %}
                                {% include "snippets/variables.html" with instrument_variables=upcoming_variable instrument=instrument csrf_token=csrf_token upcoming=True only %}
                            {% endfor %}
                        </div>
                    </div>
                </div>
            </div>
        {% endif %}
    </div>
    <div class="col-md-6">
        <h3 class="text-center">Variables by experiment reference number</h3>
        {% if upcoming_variables_by_experiment %}
            <div class="row" id="upcoming_variables_by_experiment">
                <div class="col-md-12">
                    <div class="panel panel-default">
                        <div class="panel-heading">
                            <div class="panel-title">Upcoming Variables</div>
                        </div>
                        <div class="panel-body zebra-rows">
                            {% for upcoming_variable in upcoming_variables_by_experiment %}
                                {% include "snippets/variables.html" with instrument_variables=upcoming_variable instrument=instrument csrf_token=csrf_token only %}
                            {% endfor %}
                        </div>
                    </div>
                </div>
            </div>
        {% else %}
            <div class="row">
                <div class="col-md-12 text-center">
                    <h4>No variables found</h4>
                </div>
            </div>
        {% endif %}
    </div>
</div>