git/ddServer
1
0
Fork 0
Code Issues Pull requests 1 Projects Releases 5 Packages Wiki Activity Actions

frontend: revise website to display form in a table

Browse source
This commit is contained in:
Patryk Hegenberg 2023-12-04 13:54:14 +01:00
parent 2d3f1ef951
commit e556883972
4 changed files with 109 additions and 132 deletions
Download patch file Download diff file Expand all files Collapse all files

2
templates/footer.html
View file

@ -1,7 +1,7 @@
{{ define "footer" }} {{ define "footer" }}
<footer class="footer footer-center p-4 bg-base-300 text-base-content"> <footer class="footer footer-center p-4 bg-base-300 text-base-content">
<aside> <aside>
<p class="text-gray-600">&copy; {{.Year}} Dungeons and Dragons. Alle Rechte vorbehalten.</p> <p class="text-gray-600">&copy; {{.Year}} Dungeons and Dragons Monster Generator. Alle Rechte vorbehalten.</p>
</aside> </aside>
</footer> </footer>
{{ end }} {{ end }}

2
templates/header.html
View file

@ -8,7 +8,7 @@
<div id="banner" class="banner bg-gray-800 p-8 text-white"> <div id="banner" class="banner bg-gray-800 p-8 text-white">
<img src="/images/images/banner.jpg" alt="Dungeons-and-Dragons-Banner"> <img src="/images/images/banner.jpg" alt="Dungeons-and-Dragons-Banner">
<a href="https://dnd.wizards.com/resources/press-assets">image credits</a> <a href="https://dnd.wizards.com/resources/press-assets">image credits</a>
<h1 class="centered text-4xl font-bold">Dungeons and Dragons</h1> <h1 class="centered text-4xl font-bold">Dungeons and Dragons Monster Generator</h1>
</div> </div>
</header> </header>
{{ end }} {{ end }}

22
templates/main.html
View file

@ -2,23 +2,17 @@
<div class="card-body form-box w-4/5 h-full"> <div class="card-body form-box w-4/5 h-full">
<h2 class="card-title">Monster Form</h2> <h2 class="card-title">Monster Form</h2>
<form action="/submit" method="post" class="grid grid-columns-5 space-y-4 grid place-items-center"> <form action="/submit" method="post" class="grid grid-columns-5 space-y-4 grid place-items-center">
<div class="grid grid-cols-2"> <table>
<label for="filename">Filename:</label> <tr>
<input type="text" name="filename" required placeholder="Dateiname" <td><label for="filename">Filename:</label></td>
class="input input-bordered w-full max-w-xs"><br> <td><input type="text" name="filename" required placeholder="Dateiname"
</div> class="input input-bordered w-full max-w-xs"><br></td>
</tr>
</table>
<div class="grid grid-cols-1"> <div class="grid grid-cols-1">
<button type="button" hx-post="/addMonster" class="btn">Add Monster</button> <button type="button" hx-post="/addMonster" class="btn">Add Monster</button>
</div> </div>
<div class="collapse bg-base-200"> {{ template "monsterform" . }}
<input type="checkbox" />
<div class="collapse-title text-xl font-medium">
Monster
</div>
<div class="collapse-content">
{{ template "monsterform" . }}
</div>
</div>
<input type="hidden" name="filename" value="{{.Filename}}"> <input type="hidden" name="filename" value="{{.Filename}}">
<div class="card-actions justify-end"> <div class="card-actions justify-end">
<input type="submit" value="Submit" class="btn"> <input type="submit" value="Submit" class="btn">

215
templates/monsterForm.html
View file

@ -1,118 +1,101 @@
{{ define "monsterform" }} {{ define "monsterform" }}
<div class="grid grid-cols-2"> <table>
<label for="name">Monster Name:</label> <tr>
<input type="text" name="name" required placeholder="Type here" class="input input-bordered w-full max-w-xs"><br> <td><label for="name">Monster Name:</label></td>
</div> <td><input type="text" name="name" required placeholder="Type here"
<div class="grid grid-cols-2"> class="input input-bordered w-full max-w-xs"><br></td>
<label for="source">Monster Source:</label> <td><label for="source">Monster Source:</label></td>
<input type="text" name="source" required class="input input-bordered w-full max-w-xs"><br> <td><input type="text" name="source" required class="input input-bordered w-full max-w-xs"><br></td>
</div> </tr>
<div class="grid grid-cols-2"> <tr>
<label for="size">Size:</label> <td><label for="size">Size:</label></td>
<input type="text" name="size" required class="input input-bordered w-full max-w-xs"><br> <td><input type="text" name="size" required class="input input-bordered w-full max-w-xs"><br></td>
</div> <td><label for="type">Type:</label></td>
<div class="grid grid-cols-2"> <td><input type="text" name="type" required class="input input-bordered w-full max-w-xs"><br></td>
<label for="type">Type:</label> </tr>
<input type="text" name="type" required class="input input-bordered w-full max-w-xs"><br> <tr>
</div> <td><label for="alignment">Alignment:</label></td>
<div class="grid grid-cols-2"> <td><input type="text" name="alignment" required class="input input-bordered w-full max-w-xs"><br></td>
<label for="alignment">Alignment:</label> </tr>
<input type="text" name="alignment" required class="input input-bordered w-full max-w-xs"><br> <tr>
</div> <td><label for="ac">AC:</label></td>
<div class="grid grid-cols-2"> <td><input type="number" name="ac" required class="input input-bordered w-full max-w-xs"><br></td>
<label for="ac">AC:</label> <td><label for="acFrom">AC From:</label></td>
<input type="number" name="ac" required class="input input-bordered w-full max-w-xs"><br> <td><input type="text" name="acFrom" required class="input input-bordered w-full max-w-xs"><br></td>
</div> </tr>
<div class="grid grid-cols-2"> <tr>
<label for="acFrom">AC From:</label> <td><label for="hpAverage">HP Average:</label></td>
<input type="text" name="acFrom" required class="input input-bordered w-full max-w-xs"><br> <td><input type="number" name="hpAverage" required class="input input-bordered w-full max-w-xs"><br></td>
</div> <td><label for="hpFormula">HP Formula:</label></td>
<div class="grid grid-cols-2"> <td><input type="text" name="hpFormula" required class="input input-bordered w-full max-w-xs"><br></td>
<label for="hpAverage">HP Average:</label> </tr>
<input type="number" name="hpAverage" required class="input input-bordered w-full max-w-xs"><br> <tr>
</div> <td><label for="speed">Speed:</label></td>
<div class="grid grid-cols-2"> <td><input type="number" name="speed" required class="input input-bordered w-full max-w-xs"><br></td>
<label for="hpFormula">HP Formula:</label> </tr>
<input type="text" name="hpFormula" required class="input input-bordered w-full max-w-xs"><br> <tr>
</div> <td><label for="str">Str:</label></td>
<div class="grid grid-cols-2"> <td><input type="number" name="str" required class="input input-bordered w-full max-w-xs"><br></td>
<label for="speed">Speed:</label> <td><label for="dex">Dex:</label></td>
<input type="number" name="speed" required class="input input-bordered w-full max-w-xs"><br> <td><input type="number" name="dex" required class="input input-bordered w-full max-w-xs"><br></td>
</div> </tr>
<div class="grid grid-cols-2"> <tr>
<label for="str">Str:</label> <td><label for="con">Con:</label></td>
<input type="number" name="str" required class="input input-bordered w-full max-w-xs"><br> <td><input type="number" name="con" required class="input input-bordered w-full max-w-xs"><br></td>
</div> <td><label for="int">Int:</label></td>
<div class="grid grid-cols-2"> <td><input type="number" name="int" required class="input input-bordered w-full max-w-xs"><br></td>
<label for="dex">Dex:</label> </tr>
<input type="number" name="dex" required class="input input-bordered w-full max-w-xs"><br> <tr>
</div> <td><label for="wis">Wis:</label></td>
<div class="grid grid-cols-2"> <td><input type="number" name="wis" required class="input input-bordered w-full max-w-xs"><br></td>
<label for="con">Con:</label> <td><label for="cha">Cha:</label></td>
<input type="number" name="con" required class="input input-bordered w-full max-w-xs"><br> <td><input type="number" name="cha" required class="input input-bordered w-full max-w-xs"><br></td>
</div> </tr>
<div class="grid grid-cols-2"> <tr>
<label for="int">Int:</label> <td><label for="saveDex">Save Dex:</label></td>
<input type="number" name="int" required class="input input-bordered w-full max-w-xs"><br> <td><input type="text" name="saveDex" required class="input input-bordered w-full max-w-xs"><br></td>
</div> <td><label for="saveCon">Save Con:</label></td>
<div class="grid grid-cols-2"> <td><input type="text" name="saveCon" required class="input input-bordered w-full max-w-xs"><br></td>
<label for="wis">Wis:</label> </tr>
<input type="number" name="wis" required class="input input-bordered w-full max-w-xs"><br> <tr>
</div> <td><label for="saveWis">Save Wis:</label></td>
<div class="grid grid-cols-2"> <td><input type="text" name="saveWis" required class="input input-bordered w-full max-w-xs"><br></td>
<label for="cha">Cha:</label> </tr>
<input type="number" name="cha" required class="input input-bordered w-full max-w-xs"><br> <tr>
</div> <td><label for="perception">Perception:</label></td>
<div class="grid grid-cols-2"> <td><input type="text" name="perception" required class="input input-bordered w-full max-w-xs"><br></td>
<label for="saveDex">Save Dex:</label> </tr>
<input type="text" name="saveDex" required class="input input-bordered w-full max-w-xs"><br> <tr>
</div> <td><label for="stealth">Stealth:</label></td>
<div class="grid grid-cols-2"> <td><input type="text" name="stealth" required class="input input-bordered w-full max-w-xs"><br></td>
<label for="saveCon">Save Con:</label> </tr>
<input type="text" name="saveCon" required class="input input-bordered w-full max-w-xs"><br> <tr>
</div> <td><label for="damageRes">Damage Resistances:</label></td>
<div class="grid grid-cols-2"> <td><input type="text" name="damageRes" required class="input input-bordered w-full max-w-xs"><br></td>
<label for="saveWis">Save Wis:</label> </tr>
<input type="text" name="saveWis" required class="input input-bordered w-full max-w-xs"><br> <tr>
</div> <td><label for="senses">Senses:</label></td>
<div class="grid grid-cols-2"> <td><input type="text" name="senses" required class="input input-bordered w-full max-w-xs"><br></td>
<label for="perception">Perception:</label> </tr>
<input type="text" name="perception" required class="input input-bordered w-full max-w-xs"><br> <tr>
</div> <td><label for="languages">Languages:</label></td>
<div class="grid grid-cols-2"> <td><input type="text" name="languages" required class="input input-bordered w-full max-w-xs"><br></td>
<label for="stealth">Stealth:</label> </tr>
<input type="text" name="stealth" required class="input input-bordered w-full max-w-xs"><br> <tr>
</div> <td><label for="cr">CR:</label></td>
<div class="grid grid-cols-2"> <td><input type="text" name="cr" required class="input input-bordered w-full max-w-xs"><br></td>
<label for="damageRes">Damage Resistances:</label> </tr>
<input type="text" name="damageRes" required class="input input-bordered w-full max-w-xs"><br> <tr>
</div> <td><label for="traitName">Trait Name:</label></td>
<div class="grid grid-cols-2"> <td><input type="text" name="traitName" required class="input input-bordered w-full max-w-xs"><br></td>
<label for="senses">Senses:</label> <td><label for="traitEntry">Trait Entry:</label></td>
<input type="text" name="senses" required class="input input-bordered w-full max-w-xs"><br> <td><input type="text" name="traitEntry" required class="input input-bordered w-full max-w-xs"><br></td>
</div> </tr>
<div class="grid grid-cols-2"> <tr>
<label for="languages">Languages:</label> <td><label for="actionName">Action Name:</label></td>
<input type="text" name="languages" required class="input input-bordered w-full max-w-xs"><br> <td><input type="text" name="actionName" required class="input input-bordered w-full max-w-xs"><br></td>
</div> <td><label for="actionEntry">Action Entry:</label></td>
<div class="grid grid-cols-2"> <td><input type="text" name="actionEntry" required class="input input-bordered w-full max-w-xs"><br></td>
<label for="cr">CR:</label> </tr>
<input type="text" name="cr" required class="input input-bordered w-full max-w-xs"><br> </table>
</div>
<div class="grid grid-cols-2">
<label for="traitName">Trait Name:</label>
<input type="text" name="traitName" required class="input input-bordered w-full max-w-xs"><br>
</div>
<div class="grid grid-cols-2">
<label for="traitEntry">Trait Entry:</label>
<input type="text" name="traitEntry" required class="input input-bordered w-full max-w-xs"><br>
</div>
<div class="grid grid-cols-2">
<label for="actionName">Action Name:</label>
<input type="text" name="actionName" required class="input input-bordered w-full max-w-xs"><br>
</div>
<div class="grid grid-cols-2">
<label for="actionEntry">Action Entry:</label>
<input type="text" name="actionEntry" required class="input input-bordered w-full max-w-xs"><br>
</div>
{{end}} {{end}}