tunic-tracker-redux/tunictracker/tracker/templates/tracker/breakdown/block.html

78 lines
4.2 KiB
HTML

<div class="breakdown flex flex-col space-y-2 max-w-full {{ extra_classes }}"
data-current="{{ is_current_scene }}"
data-scene="{{ scene_title }}">
<div class="p-2 px-2 space-y-2 bg-gradient-to-br from-[#8080FF40] to-[#8080FF20]">
<div class="flex flex-col w-full min-w-full">
<div class="text-xl breakdown-block-title">{{ scene_title }}</div>
<hr class="border-2 border-bluelight-translucent-dark rounded-xl" />
</div>
<div class="flex flex-col justify-center md:flex-row">
<div class="mt-1 mr-0 md:mr-1 md:mt-0 p-2 bg-gradient-to-br from-[#EEEEEE20] to-[#EEEEEE10] basis-1/2 md:max-w-[50%]">
<div class="flex flex-col flex-shrink-0 breakdown-checks">
<div class="flex flex-col my-0 space-y-2">
<div class="text-md breakdown-block-checks-title"
data-checks="{{ scene_data.checks.collected }}">
Checks: {{ scene_data.checks.collected }}/{{ scene_data.checks.total }} ({{ scene_data.checks.remaining }} left)
</div>
<hr class="border-2 border-bluelight-translucent-dark rounded-xl" />
</div>
<div class="grid grid-flow-row space-y-2 overflow-auto max-h-64 breakdown-block-checks-list scrollbar-none">
<ul class="py-0.5 min-w-max bg-bluelight-translucent-dark rounded-md px-1 text-sm hidden">
</ul>
{% for check_name, check in scene_data.checks.checks.items %}
{% if not check.name %}
<ul class="py-0.5 min-w-max bg-bluelight-translucent-dark rounded-md px-1 text-sm">
❌ {{ check_name }}
</ul>
{% endif %}
{% endfor %}
</div>
</div>
</div>
<div class="mt-1 ml-0 md:ml-1 md:mt-0 p-2 bg-gradient-to-br from-[#EEEEEE20] to-[#EEEEEE10] basis-1/2 md:max-w-[50%]">
<div class="flex flex-col flex-shrink-0 overflow-hidden breakdown-entrances">
<div class="grid grid-flow-row space-y-2">
<div class="text-md breakdown-block-entrances-title"
data-entrances="{{ scene_data.entrances.found }}">
Entrances: {{ scene_data.entrances.found }}/{{ scene_data.entrances.total }} ({{ scene_data.entrances.remaining }} left)
</div>
<hr class="border-2 border-bluelight-translucent-dark rounded-xl" />
</div>
<div class="grid grid-flow-row space-y-2 overflow-auto max-h-64 breakdown-block-entrances-list scrollbar-none">
<ul class="py-0.5 min-w-max bg-bluelight-translucent-dark rounded-md px-1 text-sm hidden">
</ul>
{% for entrance_origin, entrance_destination in scene_data.entrances.doors.items %}
{% if entrance_destination.door == "" %}
<ul class="py-0.5 min-w-max bg-bluelight-translucent-dark rounded-md px-1 text-sm">
❌ {{ entrance_origin }}
</ul>
{% endif %}
{% endfor %}
</div>
</div>
</div>
</div>
<div class="p-2 bg-gradient-to-br from-[#EEEEEE20] to-[#EEEEEE10]">
<div class="overflow-auto scrollbar-none max-h-64">
<div class="flex flex-col mx-auto min-w-max breakdown-block-mapped-list">
<button type="button"
class="hidden m-1 text-start bg-gradient-to-br from-bluelight-translucent-dark to-bluelight-translucent rounded-md px-1 text-sm shadow-sm shadow-[#242424]"
onclick="open_breakdown(this)"
data-scene=""></button>
{% for entrance_origin, entrance_destination in scene_data.entrances.doors.items %}
{% if entrance_destination.door %}
<button type="button"
class="m-1 text-start bg-gradient-to-br from-bluelight-translucent-dark to-bluelight-translucent rounded-md px-1 text-sm shadow-sm shadow-[#242424]"
onclick="open_breakdown(this)"
data-scene="{{ entrance_destination.scene }}">
✔️ {{ entrance_origin }} -> {{ entrance_destination.door }}
</button>
{% endif %}
{% endfor %}
</div>
</div>
</div>
</div>
<hr class="px-2 border-2 border-bluelight-translucent-dark rounded-xl" />
</div>