aryma/artemis
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

HUGE WebUI overhaul

Browse Source 
- Removed ugly styles in header
- Properly implemented Bootstrap's NavBar
- Added username to session
This commit is contained in:
Dniel97
2023-09-09 00:36:22 +02:00
parent 08927db100
commit c51103aaf5
11 changed files with 380 additions and 257 deletions
Download Patch File Download Diff File Expand all files Collapse all files

60
core/frontend/gate/create.jinja
View File

@@ -1,24 +1,44 @@
{% extends "core/frontend/index.jinja" %}
{% block content %}
<h1>Create User</h1>
<form id="create" style="max-width: 240px; min-width: 10%;" action="/gate/gate.create" method="post">
<div class="form-group row">
<label for="access_code">Card Access Code</label><br>
<input class="form-control" name="access_code" id="access_code" type="text" placeholder="00000000000000000000" value={{ code }} maxlength="20" readonly>
<div class="row justify-content-md-center form-signin">
<div class="col col-lg-4">
<form id="create" action="/gate/gate.create" method="post">
<h1 class="h3 mb-3 fw-normal">Sign-up</h1>
<div class="form-floating mb-3">
<input class="form-control" name="access-code" id="access-code" type="text"
placeholder="00000000000000000000" value={{ code }} maxlength="20" required>
<label for="access-code">Access Code*</label>
</div>
<div class="form-floating mb-3">
<input type="text" class="form-control" name="username" id="username" placeholder="username">
<label for="username">Username*</label>
</div>
<div class="form-floating mb-3">
<input type="email" class="form-control" name="email" id="email" placeholder="example@example.com">
<label for="email">E-Mail*</label>
</div>
<div class="form-floating mb-3">
<input type="password" class="form-control" name="passwd" id="passwd" placeholder="Password">
<label for="passwd">Password*</label>
</div>
<!--
<div class="form-check text-start my-3">
<input class="form-check-input" type="checkbox" value="remember-me" id="remember-me">
<label class="form-check-label" for="remember-me">
Remember me
</label>
</div>
-->
<div class="alert alert-warning" role="alert">
If you have not registered a card with this server, you cannot create a WebUI account!
</div>
<button class="btn btn-primary w-100 py-2" type="submit">Sign-up</button>
<!-- <p class="mt-5 mb-3 text-body-secondary">© 2023 ARTEMiS</p>-->
</form>
</div>
<div class="form-group row">
<label for="username">Username</label><br>
<input id="username" class="form-control" name="username" type="text" placeholder="username">
</div>
<div class="form-group row">
<label for="email">Email</label><br>
<input id="email" class="form-control" name="email" type="email" placeholder="example@example.com">
</div>
<div class="form-group row">
<label for="passwd">Password</label><br>
<input id="passwd" class="form-control" name="passwd" type="password" placeholder="password">
</div>
<p></p>
<input id="submit" class="btn btn-primary" style="display: block; margin: 0 auto;" type="submit" value="Create">
</form>
</div>
{% endblock content %}

66
core/frontend/gate/gate.jinja
View File

@@ -1,32 +1,52 @@
{% extends "core/frontend/index.jinja" %}
{% block content %}
<h1>Gate</h1>
{% include "core/frontend/widgets/err_banner.jinja" %}
<style>
/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
.form-signin input[type="text"] {
margin-bottom: -1px;
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
}
/* Firefox */
input[type=number] {
-moz-appearance: textfield;
.form-signin input[type="password"] {
margin-bottom: 10px;
border-top-left-radius: 0;
border-top-right-radius: 0;
}
</style>
<form id="login" style="max-width: 240px; min-width: 10%;" action="/gate/gate.login" method="post">
<div class="form-group row">
<label for="access_code">Card Access Code</label><br>
<input form="login" class="form-control" name="access_code" id="access_code" type="number" placeholder="00000000000000000000" maxlength="20" required>
<div class="row justify-content-md-center form-signin">
<div class="col col-lg-4">
<form id="login" action="/gate/gate.login" method="post">
<h1 class="h3 mb-3 fw-normal">Login</h1>
{% include "core/frontend/widgets/err_banner.jinja" %}
<div class="form-floating">
<input form="login" class="form-control" name="access-code" id="access-code" type="text"
placeholder="00000000000000000000" maxlength="20" required>
<label for="access-code">Access Code</label>
</div>
<div class="form-floating">
<input form="login" type="password" class="form-control" name="passwd" id="passwd" placeholder="Password">
<label for="passwd">Password</label>
</div>
<!--
<div class="form-check text-start my-3">
<input class="form-check-input" type="checkbox" value="remember-me" id="remember-me">
<label class="form-check-label" for="remember-me">
Remember me
</label>
</div>
-->
<div class="alert alert-info" role="alert">
To register for the WebUI, type in the <strong>access code</strong> of your card, as shown in a game, and leave the
password field blank.
</div>
<button class="btn btn-primary w-100 py-2" type="submit">Sign in</button>
<!-- <p class="mt-5 mb-3 text-body-secondary">© 2023 ARTEMiS</p>-->
</form>
</div>
<div class="form-group row">
<label for="passwd">Password</label><br>
<input id="passwd" class="form-control" name="passwd" type="password" placeholder="password">
</div>
<p></p>
<input id="submit" class="btn btn-primary" style="display: block; margin: 0 auto;" form="login" type="submit" value="Login">
</form>
<h6>*To register for the webui, type in the access code of your card, as shown in a game, and leave the password field blank.</h6>
<h6>*If you have not registered a card with this server, you cannot create a webui account.</h6>
</div>
{% endblock content %}