HUGE WebUI overhaul

- 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

View File

@@ -1,6 +1,5 @@
{% if error > 0 %}
<div class="err-banner">
<h3>Error</h3>
<div class="alert alert-danger" role="alert">
{% if error == 1 %}
Card not registered, or wrong password
{% elif error == 2 %}

View File

@@ -1,21 +1,56 @@
<div style="background: #333; color: #f9f9f9; width: 10%; height: 50px; line-height: 50px; text-align: center; float: left;">
Navigation
</div>
<div style="background: #333; color: #f9f9f9; width: 80%; height: 50px; line-height: 50px; padding-left: 10px; float: left;">
<a href=/><button class="btn btn-primary">Home</button></a>&nbsp;
{% for game in game_list %}
<a href=/game/{{ game.url }}><button class="btn btn-success">{{ game.name }}</button></a>&nbsp;
{% endfor %}
</div>
</div>
<div style="background: #333; color: #f9f9f9; width: 10%; height: 50px; line-height: 50px; text-align: center; float: left;">
{% if sesh is defined and sesh["permissions"] >= 2 %}
<a href="/sys"><button class="btn btn-primary">System</button></a>
{% endif %}
{% if sesh is defined and sesh["userId"] > 0 %}
<a href="/user"><button class="btn btn-primary">Account</button></a>
{% else %}
<a href="/gate"><button class="btn btn-primary">Gate</button></a>
{% endif %}
</div>
<nav class="p-3 mb-3 navbar navbar-expand-lg bg-body-tertiary" aria-label="Thirteenth navbar example">
<div class="container">
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarsExample11"
aria-controls="navbarsExample11" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse d-lg-flex" id="navbarsExample11">
<a class="navbar-brand col-lg-3 me-0" href= />ARTEMiS</a>
<ul class="navbar-nav col-lg-6 justify-content-lg-center nav-pills">
<li class="nav-item">
<a class="nav-link {% if active_page == '/' %}active{% endif %}" aria-current="page" href= />Home</a>
</li>
{% for game in game_list %}
<li class="nav-item">
<a class="nav-link {% if active_page == game.url %}active{% endif %}" href=/game/{{ game.url }}>{{ game.name }}</a>
</li>
{% endfor %}
<!--
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown"
aria-expanded="false">Dropdown</a>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="#">Action</a></li>
<li><a class="dropdown-item" href="#">Another action</a></li>
<li><a class="dropdown-item" href="#">Something else here</a></li>
</ul>
</li>
-->
</ul>
<div class="d-lg-flex col-lg-3 justify-content-lg-end">
{% if sesh is defined and sesh["user_id"] > 0 %}
<div class="btn-group dropdown">
<a href="#" class="d-block link-body-emphasis text-decoration-none dropdown-toggle"
data-bs-toggle="dropdown" aria-expanded="false">
{{ sesh["username"] }}
</a>
<ul class="dropdown-menu text-small">
{% if sesh["permissions"] >= 2 %}
<li><a class="dropdown-item {% if active_page == 'sys' %}active{% endif %}" href="/sys">System</a></li>
{% endif %}
<li><a class="dropdown-item" href="#">Settings</a></li>
<li><a class="dropdown-item {% if active_page == 'user' %}active{% endif %}" href="/user">Account</a></li>
<li>
<hr class="dropdown-divider">
</li>
<li><a class="dropdown-item" href="#">Sign out</a></li>
</ul>
</div>
{% else %}
<a href="/gate"><button class="btn {% if active_page == 'gate' %}btn-primary{% else %}btn-outline-primary{% endif %}">Login</button></a>
{% endif %}
</div>
</div>
</div>
</nav>