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

feat: button for edit for area, simplification of icon

Browse Source
This commit is contained in:
Max Hohlfeld 2024-11-01 13:18:38 +01:00
parent e515057e14
commit 03c47927e5
11 changed files with 88 additions and 129 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
src/endpoints/user/post_toggle.rs
View File

@ -49,37 +49,29 @@ pub async fn post(
if !user.locked { if !user.locked {
return HttpResponse::Ok().body(format!( return HttpResponse::Ok().body(format!(
r##"<span class="icon"> r##"<svg class="icon">
<svg class="feather">
<use href="/static/feather-sprite.svg#unlock" /> <use href="/static/feather-sprite.svg#unlock" />
</svg> </svg>
</span>
<span>Entsperren</span> <span>Entsperren</span>
<div id="user-{id}-locked" hx-swap-oob="true">ja</div> <div id="user-{id}-locked" hx-swap-oob="true">ja</div>
<button id="user-{id}-delete" hx-swap-oob="true" class="button is-danger is-light" hx-delete="/users/{id}" hx-target="closest tr" hx-swap="delete" hx-trigger="confirmed"> <button id="user-{id}-delete" hx-swap-oob="true" class="button is-danger is-light" hx-delete="/users/{id}" hx-target="closest tr" hx-swap="delete" hx-trigger="confirmed">
<span class="icon"> <svg class="icon">
<svg class="feather">
<use href="/static/feather-sprite.svg#x-circle" /> <use href="/static/feather-sprite.svg#x-circle" />
</svg> </svg>
</span>
<span>Löschen</span> <span>Löschen</span>
</button>"##, </button>"##,
id = user.id)); id = user.id));
} else { } else {
return HttpResponse::Ok().body(format!( return HttpResponse::Ok().body(format!(
r##"<span class="icon"> r##"<svg class="icon">
<svg class="feather">
<use href="/static/feather-sprite.svg#lock" /> <use href="/static/feather-sprite.svg#lock" />
</svg> </svg>
</span>
<span>Sperren</span> <span>Sperren</span>
<div id="user-{id}-locked" hx-swap-oob="true">nein</div> <div id="user-{id}-locked" hx-swap-oob="true">nein</div>
<button id="user-{id}-delete" hx-swap-oob="true" class="button is-danger is-light" disabled hx-delete="/users/{id}" hx-target="closest tr" hx-swap="delete" hx-trigger="confirmed"> <button id="user-{id}-delete" hx-swap-oob="true" class="button is-danger is-light" disabled hx-delete="/users/{id}" hx-target="closest tr" hx-swap="delete" hx-trigger="confirmed">
<span class="icon"> <svg class="icon">
<svg class="feather">
<use href="/static/feather-sprite.svg#x-circle" /> <use href="/static/feather-sprite.svg#x-circle" />
</svg> </svg>
</span>
<span>Löschen</span> <span>Löschen</span>
</button>"##, </button>"##,
id = user.id)); id = user.id));

17
static/style.scss
View File

@ -1,5 +1,5 @@
// Set your brand colors // Set your brand colors
$crimson: #00d1b2;//#B80F0A; $crimson: #00d1b2; //#B80F0A;
// Override global Sass variables from the /utilities folder // Override global Sass variables from the /utilities folder
@use "bulma/sass/utilities" with ($family-primary: '"Nunito", sans-serif', @use "bulma/sass/utilities" with ($family-primary: '"Nunito", sans-serif',
@ -43,25 +43,14 @@ $crimson: #00d1b2;//#B80F0A;
// TODO: bulma theme for sweetalert looks and feels outdated // TODO: bulma theme for sweetalert looks and feels outdated
@use "sweetalert2/src/sweetalert2.scss" with ($swal2-confirm-button-background-color: $crimson); @use "sweetalert2/src/sweetalert2.scss" with ($swal2-confirm-button-background-color: $crimson);
.feather { [class*=" icon"],
width: 24px; [class^=icon] {
height: 24px;
stroke: currentColor; stroke: currentColor;
stroke-width: 2; stroke-width: 2;
stroke-linecap: round; stroke-linecap: round;
stroke-linejoin: round; stroke-linejoin: round;
fill: none; fill: none;
}
[class*=" icon"],
[class^=icon] {
display: inline-block; display: inline-block;
width: 1em;
height: 1em;
stroke-width: 0;
stroke: currentColor;
fill: currentColor;
line-height: 1;
position: relative; position: relative;
top: -.05em; top: -.05em;
vertical-align: middle; vertical-align: middle;

12
templates/area/new_or_edit.html
View File

@ -31,11 +31,9 @@
<div class="field is-grouped"> <div class="field is-grouped">
<div class="control"> <div class="control">
<button class="button is-success"> <button class="button is-success">
<span class="icon"> <svg class="icon">
<svg class="feather"> <use href="/static/feather-sprite.svg#check-circle" />
<use href="/static/feather-sprite.svg#check-circle" /> </svg>
</svg>
</span>
<span> <span>
{% if area.is_some() %} {% if area.is_some() %}
Speichern Speichern
@ -47,11 +45,9 @@
</div> </div>
<div class="control"> <div class="control">
<a class="button is-link is-light" hx-boost="true" href="/locations"> <a class="button is-link is-light" hx-boost="true" href="/locations">
<span class="icon"> <svg class="icon">
<svg class="feather">
<use href="/static/feather-sprite.svg#arrow-left" /> <use href="/static/feather-sprite.svg#arrow-left" />
</svg> </svg>
</span>
<span>Zurück</span> <span>Zurück</span>
</a> </a>
</div> </div>

32
templates/index.html
View File

@ -8,11 +8,9 @@
<div class="level-left"> <div class="level-left">
<a hx-boost="true" class="button is-link level-item" <a hx-boost="true" class="button is-link level-item"
href="/?date={{ date.pred() }}{{ selected_area|show_area_query(false) }}"> href="/?date={{ date.pred() }}{{ selected_area|show_area_query(false) }}">
<span class="icon"> <svg class="icon">
<svg class="feather"> <use href="/static/feather-sprite.svg#arrow-left" />
<use href="/static/feather-sprite.svg#arrow-left" /> </svg>
</svg>
</span>
</a> </a>
</div> </div>
@ -39,11 +37,9 @@
<div class="level-right"> <div class="level-right">
<a hx-boost="true" class="button is-link level-item" <a hx-boost="true" class="button is-link level-item"
href="/?date={{ date.succ() }}{{ selected_area|show_area_query(false) }}"> href="/?date={{ date.succ() }}{{ selected_area|show_area_query(false) }}">
<span class="icon"> <svg class="icon">
<svg class="feather"> <use href="/static/feather-sprite.svg#arrow-right" />
<use href="/static/feather-sprite.svg#arrow-right" /> </svg>
</svg>
</span>
</a> </a>
</div> </div>
</div> </div>
@ -64,11 +60,9 @@
selected_area.unwrap() == user.area_id) %} selected_area.unwrap() == user.area_id) %}
<div class="level-right"> <div class="level-right">
<a class="button is-link is-light" hx-boost="true" href="/events/new?date={{ date }}"> <a class="button is-link is-light" hx-boost="true" href="/events/new?date={{ date }}">
<span class="icon"> <svg class="icon">
<svg class="feather"> <use href="/static/feather-sprite.svg#plus-circle" />
<use href="/static/feather-sprite.svg#plus-circle" /> </svg>
</svg>
</span>
<span>Neues Event für diesen Tag</span> <span>Neues Event für diesen Tag</span>
</a> </a>
</div> </div>
@ -116,11 +110,9 @@
{% if selected_area.is_none() || selected_area.unwrap() == user.area_id %} {% if selected_area.is_none() || selected_area.unwrap() == user.area_id %}
<div class="level-right"> <div class="level-right">
<a class="button is-link is-light" hx-boost="true" href="/availabillity/new?date={{ date }}"> <a class="button is-link is-light" hx-boost="true" href="/availabillity/new?date={{ date }}">
<span class="icon"> <svg class="icon">
<svg class="feather"> <use href="/static/feather-sprite.svg#plus-circle" />
<use href="/static/feather-sprite.svg#plus-circle" /> </svg>
</svg>
</span>
<span>Neue Verfügbarkeit für diesen Tag</span> <span>Neue Verfügbarkeit für diesen Tag</span>
</a> </a>
</div> </div>

12
templates/location/new.html
View File

@ -46,21 +46,17 @@
<div class="field is-grouped"> <div class="field is-grouped">
<div class="control"> <div class="control">
<button class="button is-success"> <button class="button is-success">
<span class="icon"> <svg class="icon">
<svg class="feather"> <use href="/static/feather-sprite.svg#check-circle" />
<use href="/static/feather-sprite.svg#check-circle" /> </svg>
</svg>
</span>
<span>Speichern</span> <span>Speichern</span>
</button> </button>
</div> </div>
<div class="control"> <div class="control">
<a class="button is-link is-light" hx-boost="true" href="/locations"> <a class="button is-link is-light" hx-boost="true" href="/locations">
<span class="icon"> <svg class="icon">
<svg class="feather">
<use href="/static/feather-sprite.svg#arrow-left" /> <use href="/static/feather-sprite.svg#arrow-left" />
</svg> </svg>
</span>
<span>Zurück</span> <span>Zurück</span>
</a> </a>
</div> </div>

54
templates/location/overview.html
View File

@ -12,20 +12,16 @@
<div class="level-right"> <div class="level-right">
{% if user.role == Role::Admin %} {% if user.role == Role::Admin %}
<a class="button is-link is-light" hx-boost="true" href="/area/new"> <a class="button is-link is-light" hx-boost="true" href="/area/new">
<span class="icon"> <svg class="icon">
<svg class="feather"> <use href="/static/feather-sprite.svg#plus-circle" />
<use href="/static/feather-sprite.svg#plus-circle" /> </svg>
</svg>
</span>
<span>Neuen Bereich anlegen</span> <span>Neuen Bereich anlegen</span>
</a> </a>
{% endif %} {% endif %}
<a class="button is-link is-light" hx-boost="true" href="/locations/new"> <a class="button is-link is-light" hx-boost="true" href="/locations/new">
<span class="icon"> <svg class="icon">
<svg class="feather"> <use href="/static/feather-sprite.svg#plus-circle" />
<use href="/static/feather-sprite.svg#plus-circle" /> </svg>
</svg>
</span>
<span>Neuen Ort anlegen</span> <span>Neuen Ort anlegen</span>
</a> </a>
</div> </div>
@ -38,7 +34,27 @@
{% else %} {% else %}
{% for gl in grouped_locations %} {% for gl in grouped_locations %}
<div class="box"> <div class="box">
<h5 class="title is-5">Bereich {{ gl.0.name }}</h5> <div class="level">
<div class="level-left">
<div class="level-item">
<h5 class="title is-5">Bereich {{ gl.0.name }}</h5>
</div>
<div class="level-item buttons are-small">
<a class="button is-primary is-light" hx-boost="true" href="/area/edit/{{ gl.0.id }}">
<svg class="icon">
<use href="/static/feather-sprite.svg#edit" />
</svg>
</a>
<a class="button is-danger is-light" hx-boost="true" href="/area/delete/{{ gl.0.id }}">
<svg class="icon">
<use href="/static/feather-sprite.svg#x-circle" />
</svg>
</a>
</div>
</div>
</div>
{% for l in gl.1 %} {% for l in gl.1 %}
<div class="level"> <div class="level">
<div clas="level-left"> <div clas="level-left">
@ -46,19 +62,15 @@
</div> </div>
<div clas="level-right"> <div clas="level-right">
<a class="button is-primary is-light"> <a class="button is-primary is-light">
<span class="icon"> <svg class="icon">
<svg class="feather"> <use href="/static/feather-sprite.svg#edit" />
<use href="/static/feather-sprite.svg#edit" /> </svg>
</svg>
</span>
<span>Bearbeiten</span> <span>Bearbeiten</span>
</a> </a>
<a class="button is-danger is-light"> <a class="button is-danger is-light">
<span class="icon"> <svg class="icon">
<svg class="feather"> <use href="/static/feather-sprite.svg#x-circle" />
<use href="/static/feather-sprite.svg#x-circle" /> </svg>
</svg>
</span>
<span>Löschen</span> <span>Löschen</span>
</a> </a>
</div> </div>

8
templates/nav.html
View File

@ -68,11 +68,9 @@
angemeldet als {{ user.name }} angemeldet als {{ user.name }}
<div class="buttons ml-3"> <div class="buttons ml-3">
<a class="button is-success" hx-boost="true" href="/profile"> <a class="button is-success" hx-boost="true" href="/profile">
<span class="icon"> <svg class="icon">
<svg class="feather"> <use href="/static/feather-sprite.svg#user" />
<use href="/static/feather-sprite.svg#user" /> </svg>
</svg>
</span>
<span>Profil</span> <span>Profil</span>
</a> </a>
<a href="/logout" class="button is-light"> <a href="/logout" class="button is-light">

8
templates/user/login.html
View File

@ -24,11 +24,9 @@
<div class="level"> <div class="level">
<button class="button is-primary level-left"> <button class="button is-primary level-left">
<span class="icon"> <svg class="icon">
<svg class="feather"> <use href="/static/feather-sprite.svg#log-in" />
<use href="/static/feather-sprite.svg#log-in" /> </svg>
</svg>
</span>
<span>Anmelden</span> <span>Anmelden</span>
</button> </button>
<a class="button is-info is-light level-right" hx-boost="true" href="/reset-password">Passwort vergessen</a> <a class="button is-info is-light level-right" hx-boost="true" href="/reset-password">Passwort vergessen</a>

16
templates/user/new_or_edit.html
View File

@ -106,11 +106,9 @@
<div class="field is-grouped"> <div class="field is-grouped">
<div class="control"> <div class="control">
<button class="button is-success"> <button class="button is-success">
<span class="icon"> <svg class="icon">
<svg class="feather"> <use href="/static/feather-sprite.svg#check-circle" />
<use href="/static/feather-sprite.svg#check-circle" /> </svg>
</svg>
</span>
<span> <span>
{% if id.is_some() %} {% if id.is_some() %}
Speichern Speichern
@ -122,11 +120,9 @@
</div> </div>
<div class="control"> <div class="control">
<a class="button is-link is-light" hx-boost="true" href="/users"> <a class="button is-link is-light" hx-boost="true" href="/users">
<span class="icon"> <svg class="icon">
<svg class="feather"> <use href="/static/feather-sprite.svg#arrow-left" />
<use href="/static/feather-sprite.svg#arrow-left" /> </svg>
</svg>
</span>
<span>Zurück</span> <span>Zurück</span>
</a> </a>
</div> </div>

32
templates/user/overview.html
View File

@ -11,11 +11,9 @@
</div> </div>
<div class="level-right"> <div class="level-right">
<a class="button is-link is-light" hx-boost="true" href="/users/new"> <a class="button is-link is-light" hx-boost="true" href="/users/new">
<span class="icon"> <svg class="icon">
<svg class="feather"> <use href="/static/feather-sprite.svg#plus-circle" />
<use href="/static/feather-sprite.svg#plus-circle" /> </svg>
</svg>
</span>
<span>Neuen Nutzer anlegen</span> <span>Neuen Nutzer anlegen</span>
</a> </a>
</div> </div>
@ -92,28 +90,22 @@
{% if user.id != u.id %} {% if user.id != u.id %}
<div class="buttons is-right"> <div class="buttons is-right">
<button class="button is-link is-light" hx-post="/users/{{ u.id }}/toggle?field=locked"> <button class="button is-link is-light" hx-post="/users/{{ u.id }}/toggle?field=locked">
<span class="icon"> <svg class="icon">
<svg class="feather"> <use href="/static/feather-sprite.svg#{% if u.locked %}unlock{% else %}lock{% endif %}" />
<use href="/static/feather-sprite.svg#{% if u.locked %}unlock{% else %}lock{% endif %}" /> </svg>
</svg>
</span>
<span>{% if u.locked %}Entsperren{% else %}Sperren{% endif %}</span> <span>{% if u.locked %}Entsperren{% else %}Sperren{% endif %}</span>
</button> </button>
<a class="button is-primary is-light" hx-boost="true" href="/users/edit/{{ u.id }}"> <a class="button is-primary is-light" hx-boost="true" href="/users/edit/{{ u.id }}">
<span class="icon"> <svg class="icon">
<svg class="feather"> <use href="/static/feather-sprite.svg#edit" />
<use href="/static/feather-sprite.svg#edit" /> </svg>
</svg>
</span>
<span>Bearbeiten</span> <span>Bearbeiten</span>
</a> </a>
<button id="user-{{ u.id }}-delete" class="button is-danger is-light" {% if !u.locked %}disabled{% endif <button id="user-{{ u.id }}-delete" class="button is-danger is-light" {% if !u.locked %}disabled{% endif
%} hx-delete="/users/{{ u.id }}" hx-target="closest tr" hx-swap="delete" hx-trigger="confirmed"> %} hx-delete="/users/{{ u.id }}" hx-target="closest tr" hx-swap="delete" hx-trigger="confirmed">
<span class="icon"> <svg class="icon">
<svg class="feather"> <use href="/static/feather-sprite.svg#x-circle" />
<use href="/static/feather-sprite.svg#x-circle" /> </svg>
</svg>
</span>
<span>Löschen</span> <span>Löschen</span>
</button> </button>
</div> </div>

8
templates/user/profile.html
View File

@ -100,11 +100,9 @@
checked="{{ user.receive_notifications }}"> checked="{{ user.receive_notifications }}">
Ich möchte E-Mail Benachrichtigungen zu neuen Brasiwa-Einteilungen erhalten. Ich möchte E-Mail Benachrichtigungen zu neuen Brasiwa-Einteilungen erhalten.
<span id="success" class="result"> <span id="success" class="result">
<span class="icon mr-2"> <svg class="icon mr-2">
<svg class="feather"> <use href="/static/feather-sprite.svg#check" />
<use href="/static/feather-sprite.svg#check" /> </svg>
</svg>
</span>
<span> <span>
gespeichert gespeichert
</span> </span>