77 lines
2.9 KiB
Plaintext
77 lines
2.9 KiB
Plaintext
<h1 class="text-4xl font-bold text-center my-4">Swornforged</h1>
|
|
<div class="flex flex-col gap-6 p-6 max-w-3xl mx-auto">
|
|
<div class="p-6 shadow-md rounded-lg bg-white flex flex-col gap-4">
|
|
<h2 class="text-3xl font-bold">Assets</h2>
|
|
<div :for={asset_type <- @dataforged["Asset Types"]} id={asset_type["$id"]}>
|
|
<h2 class="text-2xl font-bold rounded mb-2">
|
|
<a href={"#" <> asset_type["$id"]}><%= asset_type["Display"]["Title"] %></a>
|
|
</h2>
|
|
<ul class="flex flex-col gap-2">
|
|
<li :for={asset <- asset_type["Assets"]} id={asset["$id"]}>
|
|
<div>
|
|
<h3
|
|
class="font-bold text-white px-2 py-1 rounded-t"
|
|
style={"background-color: #{asset["Display"]["Color"]}"}
|
|
>
|
|
<a href={"#" <> asset["$id"]}><%= asset["Display"]["Title"] %></a>
|
|
</h3>
|
|
<ul class="p-2 flex flex-col gap-2">
|
|
<li :for={ability <- asset["Abilities"]} id={ability["$id"]}>
|
|
<%= raw(Earmark.as_html!(ability["Text"])) %>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="p-6 shadow-md rounded-lg bg-white flex flex-col gap-4">
|
|
<h2 class="text-2xl font-bold">Oracles</h2>
|
|
<div :for={oracle_category <- @dataforged["Oracle Categories"]} id={oracle_category["$id"]}>
|
|
<h2 class="text-lg font-bold text-white bg-gray-500 p-2 rounded mb-2">
|
|
<a href={"#" <> oracle_category["$id"]}>
|
|
<%= oracle_category["Display"]["Title"] %>
|
|
</a>
|
|
</h2>
|
|
<ul class="flex flex-col gap-2">
|
|
<li :for={oracle <- oracle_category["Oracles"]} id={oracle["$id"]}>
|
|
<div>
|
|
<h3 class="font-bold text-white px-2 py-1 bg-slate-400 rounded">
|
|
<a href={"#" <> oracle["$id"]}>
|
|
<%= oracle["Display"]["Title"] %>
|
|
</a>
|
|
</h3>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="p-6 shadow-md rounded-lg bg-white flex flex-col gap-4">
|
|
<h2 class="text-3xl font-bold">Moves</h2>
|
|
<div :for={move_category <- @dataforged["Move Categories"]} id={move_category["$id"]}>
|
|
<h2 class="text-2xl font-bold rounded mb-4">
|
|
<a href={"#" <> move_category["$id"]}>
|
|
<%= move_category["Display"]["Title"] %>
|
|
</a>
|
|
</h2>
|
|
<ul class="flex flex-col gap-6">
|
|
<li :for={move <- move_category["Moves"]} id={move["$id"]}>
|
|
<div class="flex flex-col gap-2">
|
|
<h3
|
|
class="font-bold text-white px-2 py-1 rounded-t"
|
|
style={"background-color: #{move["Display"]["Color"]}"}
|
|
>
|
|
<a href={"#" <> move["$id"]}>
|
|
<%= move["Display"]["Title"] %>
|
|
</a>
|
|
</h3>
|
|
<div class="p-2">
|
|
<%= raw(Earmark.as_html!(move["Text"], gfm: true, gfm_tables: true)) %>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|