making the ui nicer

This commit is contained in:
Zachary Watts
2026-04-28 16:12:21 -04:00
parent 0ca25f9f91
commit dad1a4c588
12 changed files with 207 additions and 31 deletions

View File

@@ -23,12 +23,12 @@
<div id="navbarBasicExample" class="navbar-menu">
<div class="navbar-start">
<a class="navbar-item">
Characters
<a class="navbar-item" href="party">
Generate Adventurer Party
</a>
<a class="navbar-item">
VTT
<a class="navbar-item" href="character">
Generate Single Adventurer
</a>
</div>
@@ -43,16 +43,8 @@
<div class="card-content">
<div class="content">
<h2>Welcome to the Dungeon</h2>
<p>Below are your randomly generated characters!</p>
<p>You can generate characters on this app</p>
<div class="columns">
{%for character in sheets%}
<div class="column is-narrow" >
<h3> Character!</h3>
<pre>{{character | join("\n")}}</pre>
</div>
{%endfor%}
</div>
</div>
</div>
</div>

View File

@@ -0,0 +1,82 @@
<!DOCTYPE html>
<html>
<head>
<title>D&D Characters</title>
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/bulma@1.0.2/css/bulma.min.css"
>
</head>
<body>
<nav class="navbar" role="navigation" aria-label="main navigation">
<div class="navbar-brand">
<a role="button" class="navbar-burger" aria-label="menu" aria-expanded="false" data-target="navbarBasicExample">
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
</a>
</div>
<div id="navbarBasicExample" class="navbar-menu">
<div class="navbar-start">
<a class="navbar-item">
Characters
</a>
<a class="navbar-item">
VTT
</a>
</div>
</div>
</div>
</nav>
<div class="card">
<div class="container">
<div class="content">
<div class="card-content">
<div class="content">
<h2>Welcome to the Dungeon</h2>
<p>How many party members?</p>
<div class="buttons">
{%for i in range(2,6)%}
{% if count|int() == i|int() %}
<a class="button is-primary" href="{{ '/party?count=%s'%i }}">{{i}}</a>
{% else %}
<a class="button" href="{{ '/party?count=%s'%i }}">{{i}}</a>
{% endif %}
{%endfor%}
</div>
<div class="block has-text-centered">
<div class="columns">
{%for character in adv_party.adventurers%}
<div class="column" >
<div class="block has-text-centered">
<button class="button is-focused">Select this {{character.player_class.title()}}</button>
</div>
<pre>{{character.vertical_sheet | join("\n")}}</pre>
</div>
{%endfor%}
</div>
</div>
</div>
</div>
<div class="block has-text-centered">
<button class="button is-primary is-fillwidth">Select this adventuring party!</button>
<div>
<br>
</div>
</div>
</div>
</body>
</html>