Schwarztee/brass
1
0
Fork 0
Code Issues 19 Pull Requests Packages Projects 1 Releases Wiki Activity

feat: style navigation for mobile

Browse Source
This commit is contained in:
Max Hohlfeld 2025-05-24 22:39:35 +02:00
parent a608204103
commit 1c4eb6ba83
3 changed files with 84 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web/static/style.scss
View File

@ -35,7 +35,7 @@ $primary: $crimson,
@forward "bulma/sass/layout/container";
@forward "bulma/sass/layout/level";
@forward "bulma/sass/layout/section";
@use "bulma/sass/layout/section" with ($section-padding: 1.5rem 1.5rem);
@forward "bulma/sass/layout/hero";
@forward "bulma/sass/grid";

48
web/templates/index.html
View File

@ -4,7 +4,8 @@
<div hx-indicator="#progress">
<section class="section">
<div class="container">
<div class="level">
<!-- navigation for not mobile -->
<div class="level is-hidden-mobile">
<div class="level-left">
<a hx-boost="true" class="button is-link level-item"
href="/?date={{ date.pred() }}{{ selected_area|show_area_query(false) }}">
@ -44,6 +45,51 @@
</div>
</div>
<!-- navigation for mobile -->
<div class="level is-hidden-tablet is-mobile">
<div class="level-left">
<a hx-boost="true" class="button is-link level-item"
href="/?date={{ date.pred() }}{{ selected_area|show_area_query(false) }}">
<svg class="icon">
<use href="/static/feather-sprite.svg#arrow-left" />
</svg>
</a>
</div>
<div class="control level-item is-flex-grow-0">
<input class="input" type="date" name="date" value="{{ date }}" hx-target="closest body"
hx-get="/{{ selected_area|show_area_query(true) }}" hx-push-url="true">
</div>
<div class="level-right">
<a hx-boost="true" class="button is-link level-item"
href="/?date={{ date.succ() }}{{ selected_area|show_area_query(false) }}">
<svg class="icon">
<use href="/static/feather-sprite.svg#arrow-right" />
</svg>
</a>
</div>
</div>
{% if user.role == Role::Admin %}
<div class="level is-hidden-tablet is-mobile">
<div class="level-item">
<div class="select">
<select hx-get="/?date={{ date }}" hx-target="closest body" hx-push-url="true" name="area">
{% for area in areas %}
{% if (user.area_id == area.id && selected_area.is_none()) || selected_area.is_some() &&
selected_area.unwrap() == area.id %}
<option selected value="{{ area.id }}">{{ area.name }}</option>
{% else %}
<option value="{{ area.id }}">{{ area.name }}</option>
{% endif %}
{% endfor %}
</select>
</div>
</div>
</div>
{% endif %}
<progress id="progress" class="progress is-small is-link is-light htmx-indicator" max="100" />
</div>
</section>

56
web/templates/user/forgot_password.html
View File

@ -2,26 +2,42 @@
{% block body %}
<section class="section">
<div class="container">
<h1 class="title">Brass - Passwort zurücksetzen</h1>
<article class="message is-info">
<div class="message-body">
Gib deine E-Mail Adresse ein und erhalte einen Link zum Zurücksetzen deines Passworts, sofern ein Account mit dieser Adresse existiert. Bei Problemen wende dich an <a href="mailto:{{ webmaster_email }}">{{ webmaster_email }}</a>.
</div>
</article>
<form class="box" hx-post="/reset-password">
<div class="field">
<label class="label" for="email">E-Mail:</label>
<div class="control">
<input class="input" placeholder="max.mustermann@example.com" name="email" type="text" required>
</div>
</div>
<div class="container">
<h1 class="title">Brass - Passwort zurücksetzen</h1>
<article class="message is-info">
<div class="message-body">
Gib deine E-Mail Adresse ein und erhalte einen Link zum Zurücksetzen deines Passworts, sofern ein Account mit
dieser Adresse existiert. Bei Problemen wende dich an <a href="mailto:{{ webmaster_email }}">{{ webmaster_email
}}</a>.
</div>
</article>
<form class="box" hx-post="/reset-password">
<div class="field">
<label class="label" for="email">E-Mail:</label>
<div class="control">
<input class="input" placeholder="max.mustermann@example.com" name="email" type="text" required>
</div>
</div>
<div class="level">
<input class="button is-primary level-left" type="submit" value="Passwort zurücksetzen" />
<a class="button is-info is-light level-right" hx-boost="true" href="/login" >Zurück zur Anmeldung</a>
</div>
</form>
</div>
<div class="level">
<div class="level-left">
<button class="button is-primary level-item">
<svg class="icon">
<use href="/static/feather-sprite.svg#send" />
</svg>
<span>Passwort zurücksetzen</span>
</button>
</div>
<div class="level-right">
<a class="button is-info is-light level-item" href="/login">
<svg class="icon">
<use href="/static/feather-sprite.svg#arrow-left" />
</svg>
<span>Zurück zur Anmeldung</span>
</a>
</div>
</div>
</form>
</div>
</section>
{% endblock %}