fix responsive styling

This commit is contained in:
lauren 2021-09-20 11:08:39 -04:00
parent 8808018c75
commit cffaa3ee66

View File

@ -44,29 +44,30 @@
<div id="c-{{ category.id }}" class='row'> <div id="c-{{ category.id }}" class='row'>
{% for challenge, status in challenges.items %} {% for challenge, status in challenges.items %}
{% if status.0.unblocked %} {% if status.0.unblocked %}
<div id="box{{ status.0.id }}" class="box {% if status.1 == 'available' %}available{% elif status.1 == 'completed' %}completed{% else %}locked{% endif %} p-3"> <a href="#" class='col-lg-3 col-md-4 col-sm-6 col-xs-12'>
<div class="centered-div"> <div id="box{{ status.0.id }}" class="box {% if status.1 == 'available' %}available{% elif status.1 == 'completed' %}completed{% else %}locked{% endif %} p-3">
<h4>{{ status.0.name }}</h4> <div class="centered-div">
<p>Points: {{ status.0.points }}</p> <h4>{{ status.0.name }}</h4>
</div> <p>Points: {{ status.0.points }}</p>
<div class="{% if status.1 == 'completed' %}center{% else %}left{% endif %}-div"> </div>
{% if status.0.exclusive %} <div class="{% if status.1 == 'completed' %}center{% else %}left{% endif %}-div">
<p>This challenge's points are only available to the first class to complete it.</p> {% if status.0.exclusive %}
<p>{{ status.0.short_description }}</p> <p>This challenge's points are only available to the first class to complete it.</p>
{% elif status.1 == 'locked' %} <p>{{ status.0.short_description }}</p>
<p>This challenge was exclusive and has already been completed by another class.</p> {% elif status.1 == 'locked' %}
{% elif status.1 == 'completed' %} <p>This challenge was exclusive and has already been completed by another class.</p>
<h3>Solved!</h3> {% elif status.1 == 'completed' %}
{% else %} <h3>Solved!</h3>
<p>{{ status.0.short_description }}</p> {% else %}
<p>{{ status.0.short_description }}</p>
{% endif %}
</div>
{% if status.1 == 'available' %}
<hr>
<input type="text" id="{{ status.0.id }}" placeholder="Enter the flag here"/>
<input type="submit" value="Submit" onclick="checkFlag({{ status.0.id }})" />
{% endif %} {% endif %}
</div> </div>
{% if status.1 == 'available' %}
<hr>
<input type="text" id="{{ status.0.id }}" placeholder="Enter the flag here"/>
<input type="submit" value="Submit" onclick="checkFlag({{ status.0.id }})" />
{% endif %}
</div>
{% else %} {% else %}
<div class='col-lg-3 col-md-4 col-sm-6 col-xs-12'> <div class='col-lg-3 col-md-4 col-sm-6 col-xs-12'>
<div id="box{{ status.0.id }}" class="box locked p-3"> <div id="box{{ status.0.id }}" class="box locked p-3">