Split JS files

Reorganise Accounts page
Shrink filter options on mobile
This commit is contained in:
Michał Gdula 2023-06-13 00:40:13 +03:00
parent f83a9b74e5
commit 26ce573726
7 changed files with 121 additions and 123 deletions

View file

Before

Width:  |  Height:  |  Size: 72 KiB

After

Width:  |  Height:  |  Size: 72 KiB

Before After
Before After

View file

@ -0,0 +1,12 @@
function addFlashMessage(message, type='success') {
let flask = document.createElement('p');
flask.onclick = () => flask.remove();
flask.classList.add(type);
flask.innerHTML = message;
let close = document.createElement('span');
close.innerHTML = '<i class="ph-bold ph-x"></i>';
flask.appendChild(close);
document.querySelector('.flash').appendChild(flask);
}

View file

@ -1,16 +1,3 @@
function addFlashMessage(message, type='success') {
let flask = document.createElement('p');
flask.onclick = () => flask.remove();
flask.classList.add(type);
flask.innerHTML = message;
let close = document.createElement('span');
close.innerHTML = '<i class="ph-bold ph-x"></i>';
flask.appendChild(close);
document.querySelector('.flash').appendChild(flask);
}
function yeetSession(id) { function yeetSession(id) {
let form = new FormData(); let form = new FormData();
form.append('session_id', id); form.append('session_id', id);

View file

@ -140,6 +140,11 @@ nav, nav > form
.spacer .spacer
width: 100% width: 100%
@media (max-width: 700px)
nav, nav > form
&.compact
flex-direction: column
.flash .flash
display: flex display: flex
flex-direction: column flex-direction: column

View file

@ -1,17 +1,13 @@
{% extends "base.html" %} {% extends "base.html" %}
{% block nav %}
<hr>
<nav>
<a href="{{ url_for('auth.account', action='logout') }}" class="button">Your Profile</a>
<span class="spacer"></span>
<a href="{{ url_for('auth.account', action='logout') }}" class="button secondary">Logout</a>
</nav>
{% endblock %}
{% block content %} {% block content %}
<div class="block">
<h2>Hello, {{ current_user.username }}!</h2>
<p>Sample text</p>
</div>
<div class="block"> <div class="block">
<h2>Sessions</h2> <h2>Sessions</h2>
<p>Devices and games that you logged into, yeet them if it wasn't you who logged in!</p> <p>Devices and games that you logged into. If you're looking to logout all website users, reset your password instead.</p>
{% if sessions %}
<table> <table>
{% for session in sessions %} {% for session in sessions %}
<tr id="sess-{{ session.id }}"> <tr id="sess-{{ session.id }}">
@ -22,9 +18,6 @@
</tr> </tr>
{% endfor %} {% endfor %}
</table> </table>
{% else %}
<p>No sessions active. If you're looking to logout all website users, reset your password.</p>
{% endif %}
</div> </div>
<div class="block secondary"> <div class="block secondary">
@ -32,5 +25,6 @@
<p>These actions are irreversible. Be careful!</p> <p>These actions are irreversible. Be careful!</p>
<a href="{{ url_for('auth.account', action='delete') }}" class="button secondary">Delete Account</a> <a href="{{ url_for('auth.account', action='delete') }}" class="button secondary">Delete Account</a>
<a href="{{ url_for('auth.account', action='password') }}" class="button secondary">Reset Password</a> <a href="{{ url_for('auth.account', action='password') }}" class="button secondary">Reset Password</a>
<a href="{{ url_for('auth.account', action='logout') }}" class="button secondary">Logout</a>
</div> </div>
{% endblock %} {% endblock %}

View file

@ -8,11 +8,12 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name=description content="The Front Rooms official website"> <meta name=description content="The Front Rooms official website">
<meta name=author content="Project Redacted"> <meta name=author content="Project Redacted">
<meta name="favicon" content="{{ url_for('static', filename='images/icon.png') }}">
<link rel="icon" type="image/x-icon" href="{{ url_for('static', filename='images/icon.png') }}">
{% assets "styles" %}<link rel="stylesheet" href="{{ ASSET_URL }}" type="text/css">{% endassets %}
<script src="https://unpkg.com/@phosphor-icons/web"></script> <script src="https://unpkg.com/@phosphor-icons/web"></script>
{% assets "scripts" %}<script src="{{ ASSET_URL }}"></script>{% endassets %} {% assets "scripts" %}<script src="{{ ASSET_URL }}"></script>{% endassets %}
{% assets "styles" %}<link rel="stylesheet" href="{{ ASSET_URL }}" type="text/css">{% endassets %}
</head> </head>
<body> <body>
<div class="search-hint"> <div class="search-hint">
@ -45,7 +46,6 @@
<nav> <nav>
<a href="{{ url_for('views.index') }}" class="button">Scores</a> <a href="{{ url_for('views.index') }}" class="button">Scores</a>
<a href="{{ url_for('views.about') }}" class="button">About</a> <a href="{{ url_for('views.about') }}" class="button">About</a>
<a href="{{ url_for('views.about') }}" class="button">Updates</a>
<span class="spacer"></span> <span class="spacer"></span>

View file

@ -2,7 +2,7 @@
{% block nav %} {% block nav %}
<hr> <hr>
<nav> <nav>
<form method="GET" action="{{ url_for('views.index') }}"> <form method="GET" action="{{ url_for('views.index') }}" class="compact">
<select name="diff" class="button"> <select name="diff" class="button">
<option value="0" {% if diff==0 %}selected{% endif %}>Level 1</option> <option value="0" {% if diff==0 %}selected{% endif %}>Level 1</option>
<option value="1" {% if diff==1 %}selected{% endif %}>Level 2</option> <option value="1" {% if diff==1 %}selected{% endif %}>Level 2</option>