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

refactor: color of dialog and event listening

Browse Source
This commit is contained in:
Max Hohlfeld 2024-08-30 23:15:00 +02:00
parent 01fb22dc4e
commit ae2cff0c3a
9 changed files with 24 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
build.rs
View File

@ -36,6 +36,10 @@ fn main() -> std::io::Result<()> {
nm_path.join("sweetalert2/dist/sweetalert2.min.js"),
dist_path.join("sweetalert2.min.js"),
)?;
copy(
Path::new("./static/utils.js"),
dist_path.join("utils.js"),
)?;
copy(
Path::new("./static/brass.jpeg"),
dist_path.join("brass.jpeg"),

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

@ -56,7 +56,7 @@ pub async fn post(
</span>
<span>Entsperren</span>
<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" onClick="fireConfirmModal(event)">
<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="feather">
<use href="/static/feather-sprite.svg#x-circle" />
@ -74,7 +74,7 @@ pub async fn post(
</span>
<span>Sperren</span>
<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" onClick="fireConfirmModal(event)">
<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="feather">
<use href="/static/feather-sprite.svg#x-circle" />

2
src/filters.rs
View File

@ -18,9 +18,7 @@ pub fn cond_show(show: &bool, text: &str) -> askama::Result<String> {
pub fn insert_value(option: &Option<String>) -> askama::Result<String> {
if let Some(val) = option {
println!("{val}");
let s = format!(r#"value="{val}""#);
println!("{s}");
return Ok(s);
}

8
static/package-lock.json generated
View File

@ -5,7 +5,6 @@
"packages": {
"": {
"devDependencies": {
"@sweetalert2/theme-bulma": "^5.0.18",
"bulma": "^1.0.1",
"feather-icons": "^4.29.2",
"htmx.org": "^1.9.12",
@ -13,13 +12,6 @@
"sweetalert2": "^11.12.4"
}
},
"node_modules/@sweetalert2/theme-bulma": {
"version": "5.0.18",
"resolved": "https://registry.npmjs.org/@sweetalert2/theme-bulma/-/theme-bulma-5.0.18.tgz",
"integrity": "sha512-GmlNOFmgF9bw9XMAEz6kLWglvSLuNMtr/ThTYW6mEKkQw9M8s1WB/1H7s/nIn2IgamgOlz/fhDvDqX9ne5cgQg==",
"dev": true,
"license": "MIT"
},
"node_modules/anymatch": {
"version": "3.1.3",
"resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.3.tgz",

1
static/package.json
View File

@ -1,6 +1,5 @@
{
"devDependencies": {
"@sweetalert2/theme-bulma": "^5.0.18",
"bulma": "^1.0.1",
"feather-icons": "^4.29.2",
"htmx.org": "^1.9.12",

14
static/style.scss
View File

@ -1,16 +1,12 @@
// Set your brand colors
$purple: #8a4d76;
$pink: #fa7c91;
$brown: #757763;
$beige-light: #d0d1cd;
$beige-lighter: #eff0eb;
$crimson: #00d1b2;//#B80F0A;
// 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',
$primary: $crimson,
);
// $grey-dark: $brown,
// $grey-light: $beige-light,
// $primary: $purple,
// $link: $pink,
// $control-border-width: 2px
@ -45,8 +41,7 @@ $beige-lighter: #eff0eb;
@forward "bulma/sass/themes";
// TODO: bulma theme for sweetalert looks and feels outdated
// @import "@sweetalert2/theme-bulma/bulma.scss";
@import "sweetalert2/src/sweetalert2.scss";
@use "sweetalert2/src/sweetalert2.scss" with ($swal2-confirm-button-background-color: $crimson);
.feather {
width: 24px;
@ -85,4 +80,3 @@ $beige-lighter: #eff0eb;
section.htmx-request {
visibility: hidden;
}

11
static/utils.js Normal file
View File

@ -0,0 +1,11 @@
const fireConfirmModal = (event) => {
Swal.fire({ title: 'Wirklich löschen?', showCancelButton: true, cancelButtonText: 'Abbrechen', icon: 'warning', confirmButtonText: "Löschen", showCloseButton: true })
.then((result) => { if (result.isConfirmed) { htmx.trigger(event.target, 'confirmed'); } });
}
document.querySelectorAll("button[hx-trigger='confirmed']").forEach((value) => value.addEventListener("click", fireConfirmModal));
document.addEventListener("htmx:afterSwap", () => {
document.querySelectorAll("button[hx-trigger='confirmed']").forEach((value) => value.addEventListener("click", fireConfirmModal));
});

3
templates/base.html
View File

@ -9,6 +9,7 @@
<script src="/static/htmx.min.js"></script>
<script src="/static/response-targets.js"></script>
<script src="/static/sweetalert2.min.js"></script>
<script type="module" src="/static/utils.js"></script>
</head>
<body class="hero is-fullheight" hx-ext="response-targets">
@ -24,7 +25,7 @@
</div>
<p class="level-item">
Brass ist freie and quelloffene Software
Brass ist freie und quelloffene Software
</p>
<div class="level-right">

11
templates/user/overview.html
View File

@ -108,8 +108,7 @@
<span>Bearbeiten</span>
</a>
<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"
onClick="fireConfirmModal(event)">
%} hx-delete="/users/{{ u.id }}" hx-target="closest tr" hx-swap="delete" hx-trigger="confirmed">
<span class="icon">
<svg class="feather">
<use href="/static/feather-sprite.svg#x-circle" />
@ -127,12 +126,4 @@
</div>
</div>
</section>
<script>
const fireConfirmModal = (event) => {
Swal.fire({title: 'Den Nutzer wirklich löschen?', showCancelButton: true, cancelButtonText: 'Abbrechen', icon: 'warning', confirmButtonText: "Löschen", showCloseButton: true})
.then((result) => {if (result.isConfirmed) {htmx.trigger(event.target, 'confirmed');} });
}
</script>
{% endblock %}