Redesigned the user interface #23

This commit is contained in:
ChaoticByte 2023-02-17 22:01:09 +01:00
parent f7048d1e9f
commit d93591bcb2
32 changed files with 846 additions and 1297 deletions

View file

@ -3,45 +3,34 @@
{% load i18n %}
{% block title %}
{% translate "Drinks - Deposit" %}
{% translate "Drinks - Deposit" %}
{% endblock %}
{% block headAdditional %}
<link rel="stylesheet" href="/static/css/appform.css">
<link rel="stylesheet" href="/static/css/simple-keyboard.css">
<link rel="stylesheet" href="/static/css/simple-keyboard_dark.css">
<link rel="stylesheet" href="/static/css/simple-keyboard.css">
<link rel="stylesheet" href="/static/css/simple-keyboard_dark.css">
{% endblock %}
{% block content %}
<form id="depositform" class="appform">
{% csrf_token %}
<h1 class="formheading">{% translate "Deposit" %}</h1>
<div class="forminput">
<span>{% translate "Amount" %} {{ currency_suffix }}:</span>
<span>
<input type="number" name="depositamount" id="depositamount" class="keyboard-input" max="9999.99" min="1.00" step="0.01" autofocus>
</span>
</div>
<div id="statusinfo"></div>
<div class="formbuttons">
<a href="/" class="button">{% translate "cancel" %}</a>
<input type="submit" id="depositsubmitbtn" class="button" value='{% translate "confirm" %}'>
</div>
</form>
<form id="depositform" class="flex flex-column flex-center appform gap-1rem">
{% csrf_token %}
<h1 class="formheading">{% translate "Deposit" %}</h1>
<div class="flex forminput">
<span>{% translate "Amount" %} {{ currency_suffix }}:</span>
<span>
<input type="number" name="depositamount" id="depositamount" class="keyboard-input" max="9999.99" min="1.00" step="0.01" autofocus>
</span>
</div>
<div id="statusinfo"></div>
<!-- Virtual Keyboard -->
<div id="keyboard" class="simple-keyboard" data-layout="numeric"></div>
<script src="/static/js/simple-keyboard.js"></script>
<script src="/static/js/simple-keyboard_configure.js"></script>
<script src="/static/js/deposit.js"></script>
<script src="/static/js/autoreload.js"></script>
{% endblock %}
<div class="flex-center buttons">
<a href="/" class="button">{% translate "cancel" %}</a>
<input type="submit" id="depositsubmitbtn" class="button" value='{% translate "confirm" %}'>
</div>
</form>
<script src="/static/js/deposit.js"></script>
<script src="/static/js/autoreload.js"></script>
{% endblock %}