Files
flask-practice/templates/relative_rank.html
2025-04-22 13:15:15 -05:00

48 lines
1.6 KiB
HTML

{% extends "base.html" %}
{% block content %}
<link rel="stylesheet" href="{{ url_for('static', filename='css/relative_rank.css') }}">
<div class="flex-container">
<div class="unranked-items">
<h2>Unranked Items</h2>
<div>
<button id="add-btn">Add Item</button>
<button id="clear-btn">Clear All</button>
</div>
<ul id="unranked-items">
{% for i in range(10)%}
<li id="{{i}}-item" draggable="true" class="item">Item {{i}}
<button id="{{i}}-delete" class="delete" onclick="deleteItem(id)">X</button>
</li>
{% endfor %}
</ul>
</div>
<div id="drop-target" class="ranked-items">
<h2>Ranked Items</h2>
<div>
<button id="lock-rank-btn" class="rank-btns">Lock Ranks</button>
</div>
<ul id="ranked-items">
</ul>
</div>
<div id="ranks-container" class="ranks-container">
<h2>Ranks</h2>
<div>
<button id="add-rank-btn" class="rank-btns">Add Rank</button>
<button id="save-rank-btn"class="rank-btns">Save Ranks</button>
</div>
<ul id="ranks">
{% set colors = ["gold", "green", "blue", "yellow", "red"] -%}
{%for x in ["S", "A", "B", "C", "F"]%}
<li id="{{loop.index}}-rank" class="rank" draggable="true" style="background: {{colors[loop.index-1]}};">{{x}}-Rank</li>
{%endfor%}
</ul>
</div>
</div>
<script src="{{ url_for('static', filename='js/ranking.js') }}"></script>
{% endblock %}