ross/toptrumps
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Enhance dinosaur forms and templates with improved styling and layout using Bulma CSS framework

Browse Source
This commit is contained in:
Ross
2025-12-04 21:46:56 +00:00
parent 75398cf53f
commit 33fbae9426
11 changed files with 229 additions and 117 deletions
Download Patch File Download Diff File Expand all files Collapse all files
templates/cards/_form.html
+65 -30
View File
@@ -6,41 +6,76 @@
{% endif %}
{% csrf_token %}
{{ form.non_field_errors }}
<div class="row">
{{ form.name.label_tag }}<br>
{{ form.name }}
<div class="field">
<label class="label">{{ form.name.label }}</label>
<div class="control">
{{ form.name }}
</div>
</div>
<div class="row">
{{ form.era.label_tag }}<br>
{{ form.era }}
<div class="field is-horizontal">
<div class="field-body">
<div class="field">
<label class="label">{{ form.era.label }}</label>
<div class="control">
<div class="select is-fullwidth">{{ form.era }}</div>
</div>
</div>
<div class="field">
<label class="label">{{ form.diet.label }}</label>
<div class="control">
<div class="select is-fullwidth">{{ form.diet }}</div>
</div>
</div>
</div>
</div>
<div class="row">
{{ form.diet.label_tag }}<br>
{{ form.diet }}
<div class="field">
<label class="label">{{ form.description.label }}</label>
<div class="control">
{{ form.description }}
</div>
</div>
<div class="row">
{{ form.description.label_tag }}<br>
{{ form.description }}
<div class="field">
<label class="label">{{ form.image.label }}</label>
<div class="control">
<div class="file has-name">
<label class="file-label">
{{ form.image }}
</label>
</div>
</div>
</div>
<div class="row">
{{ form.image.label_tag }}<br>
{{ form.image }}
<div class="field is-horizontal">
<div class="field-body">
<div class="field">
<label class="label">{{ form.speed.label }}</label>
<div class="control">{{ form.speed }}</div>
</div>
<div class="field">
<label class="label">{{ form.weight.label }}</label>
<div class="control">{{ form.weight }}</div>
</div>
<div class="field">
<label class="label">{{ form.intelligence.label }}</label>
<div class="control">{{ form.intelligence }}</div>
</div>
<div class="field">
<label class="label">{{ form.height.label }}</label>
<div class="control">{{ form.height }}</div>
</div>
</div>
</div>
<div class="row">
{{ form.speed.label_tag }} {{ form.speed }}
</div>
<div class="row">
{{ form.weight.label_tag }} {{ form.weight }}
</div>
<div class="row">
{{ form.intelligence.label_tag }} {{ form.intelligence }}
</div>
<div class="row">
{{ form.height.label_tag }} {{ form.height }}
</div>
<div class="row">
<button type="submit">Save</button>
<button type="button" onclick="document.getElementById('htmx-form').innerHTML=''">Cancel</button>
<div class="field is-grouped">
<div class="control">
<button class="button is-primary" type="submit">Save</button>
</div>
<div class="control">
<button class="button is-light" type="button" onclick="document.getElementById('htmx-form').innerHTML=''">Cancel</button>
</div>
</div>
</form>
</div>