98 lines
2.7 KiB
HTML
98 lines
2.7 KiB
HTML
{% extends '.layout.html' %} {% block head %}{% endblock %} {% block body %}
|
|
<h1 class="text-2xl font-black text-white">Dragon Warrior Monsters 2 App</h1>
|
|
<br />
|
|
<label for="familyDropdown">Family:</label>
|
|
<select id="familyDropdown" class="p-2 bg-gray-900 rounded-md">
|
|
<option value="">All Families</option>
|
|
</select>
|
|
<br />
|
|
<label for="monsterDropdown">Monster:</label>
|
|
<select
|
|
id="monsterDropdown"
|
|
class="p-2 mt-2 rounded-md bg-slate-900"
|
|
onchange="updateMonsterSprite()"
|
|
>
|
|
<option value="">All Monsters</option>
|
|
</select>
|
|
|
|
<br />
|
|
|
|
<div
|
|
id="modules"
|
|
class="mt-4 mx-auto justify-center items-center flex flex-col"
|
|
>
|
|
<div id="monsterNameContainer" class="text-center">
|
|
<!-- Monster name will be displayed here -->
|
|
</div>
|
|
<iframe
|
|
id="monsterSpriteIframe"
|
|
src=""
|
|
class="p-2 m-2 border-2 rounded-md border-slate-400"
|
|
height="200"
|
|
width="200"
|
|
>
|
|
</iframe>
|
|
|
|
<div
|
|
class="p-2 mt-2 border-2 rounded-md border-slate-400 w-full max-w-xs container"
|
|
>
|
|
<div id="monsterFamilyContainer" class="mt-1">
|
|
<!-- Monster Family will be displayed here-->
|
|
</div>
|
|
|
|
<div id="monsterStatsContainer" class="container mt-2">
|
|
<!-- Monster stats will be displayed here -->
|
|
</div>
|
|
|
|
<div id="monsterSkillsContainer" class="container mt-2">
|
|
<!-- Monster Skills will be displayed here-->
|
|
</div>
|
|
<div id="monsterLocationContainer" class="container mt-2">
|
|
<!-- Monster Location will be displayed here-->
|
|
</div>
|
|
</div>
|
|
|
|
<div class="flex m-2 w-full max-w-xl gap-2">
|
|
<div
|
|
id="breedingPairsContainer"
|
|
class="p-2 border-2 rounded-md border-slate-400 w-full container"
|
|
>
|
|
<!-- Breeding pairs will be displayed here -->
|
|
</div>
|
|
|
|
<div
|
|
id="offspringContainer"
|
|
class="p-2 border-2 rounded-md border-slate-400 w-full container"
|
|
></div>
|
|
</div>
|
|
<div class="mt-4 text-center">
|
|
<a
|
|
href="/skills"
|
|
class="float-left text-2xl font-bold text-purple-400 hover:underline"
|
|
>Go to Skills Data Page</a
|
|
>
|
|
</div>
|
|
<br />
|
|
<div class="w-auto max-w-xl text-center">
|
|
<h2 class="m-2 text-xl font-bold">About The App</h2>
|
|
<p class="text-md">
|
|
Dragon Warrior Monsters 2 App, an open-source project. You can contribute
|
|
to the development and improvement of this app on our Git repository. Feel
|
|
free to explore the code, report issues, and submit pull requests.
|
|
</p>
|
|
<p class="mt-4 leading-7"></p>
|
|
<div class="mt-4 text-md">
|
|
<a
|
|
href="https://git.happytavern.co/oceanslim/dwm-app"
|
|
target="_blank"
|
|
class="text-purple-400 hover:text-purple-200 hover:underline"
|
|
>
|
|
View the git repository
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<br />
|
|
{% endblock %}
|