mart-w/kanidm
1
0
Fork 0
mirror of https://github.com/kanidm/kanidm.git synced 2025-02-23 12:37:00 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

[htmx] Make it harder to miss the save button on the cred update page (#3013)

Browse source
This commit is contained in:
Merlijn 2024-10-03 06:50:38 +02:00 committed by GitHub
parent c904af2966
commit 1778eaa380
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
5 changed files with 38 additions and 26 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
server/core/static/style.css
View file

@ -268,7 +268,11 @@ body {
height: fit-content;
}
#cred-update-commit-bar {
display: block;
position: fixed;
bottom: 5%;
left: 50%;
transform: translateX(-50%);
background: white;
}

5
server/core/templates/credential_update_add_passkey_partial.html
View file

@ -6,6 +6,7 @@
<button id="passkeyNamingSafariBtn" class="btn btn-primary">Begin Passkey Enrolment</button>
<form id="passkeyNamingForm" class="g-2 d-none">
<b>Adding a new passkey</b>
<label for="passkey-label" class="form-label">Please name this Passkey</label>
<input type="text" name="name" id="passkey-label" autofocus required class="form-control">
@ -19,8 +20,8 @@
hx-post="/ui/api/finish_passkey"
hx-vals='{"class": "(( class ))"}'
id="passkeyNamingSubmitBtn"
class="btn btn-success d-none ms-2" disabled
>Submit</button>
class="btn btn-primary d-none ms-2" disabled
>Add</button>
</div>
</form>
</div>

2
server/core/templates/credential_update_add_totp_partial.html
View file

@ -91,7 +91,7 @@
hx-select="#newTotpForm > *"
hx-vals='{"ignoreBrokenApp": false}'
hx-include="#newTotpForm"
>Submit</button>
>Add</button>
(% endif %)
</div>
</div>

27
server/core/templates/credentials_update_partial.html
View file

@ -2,7 +2,7 @@
<script src="/pkg/external/base64.js" async></script>
<div class="row g-3" id="credentialUpdateDynamicSection" hx-on::before-swap="stillSwapFailureResponse(event)">
<form class="needs-validation" novalidate>
<form class="needs-validation mb-5 pb-5" novalidate>
(% match ext_cred_portal %)
(% when CUExtPortal::None %)
(% when CUExtPortal::Hidden %)
@ -94,21 +94,28 @@
(% let primary_state = primary_state %)
(% include "credentials_update_primary.html" %)
<hr class="my-4"/>
<div class="d-flex flex-row flex-wrap justify-content-between">
<button class="btn btn-danger btn-lg" hx-post="/ui/api/cu_cancel" hx-target="body">Cancel</button>
<div id="cred-update-commit-bar" class="toast" role="alert" aria-live="assertive" aria-atomic="true">
<div class="toast-body">
<span class="d-flex align-items-center">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-floppy2-fill" viewBox="0 0 16 16">
<path d="M12 2h-2v3h2z"/>
<path d="M1.5 0A1.5 1.5 0 0 0 0 1.5v13A1.5 1.5 0 0 0 1.5 16h13a1.5 1.5 0 0 0 1.5-1.5V2.914a1.5 1.5 0 0 0-.44-1.06L14.147.439A1.5 1.5 0 0 0 13.086 0zM4 6a1 1 0 0 1-1-1V1h10v4a1 1 0 0 1-1 1zM3 9h10a1 1 0 0 1 1 1v5H2v-5a1 1 0 0 1 1-1"/>
</svg>
<b class="px-1">Careful</b>- save when you're done:
</span>
<div class="mt-2 pt-2 border-top">
<button class="btn btn-danger" hx-post="/ui/api/cu_cancel" hx-target="body">Cancel</button>
<span class="d-inline-block" tabindex="0" data-bs-toggle="tooltip" data-bs-title="Resolve the warnings at the top.">
<button
class="btn btn-success btn-lg"
class="btn btn-success"
type="submit"
hx-post="/ui/api/cu_commit"
hx-boost="false"
(% if !warnings.is_empty() %)
disabled
(% endif %)
>Submit Changes</button>
(% if !warnings.is_empty() %)disabled(% endif %)
>Save Changes</button>
</span>
</div>
</div>
</div>
</form>
</div>

6
server/core/templates/credentials_update_primary.html
View file

@ -28,7 +28,7 @@
<h6><b>Time-based One Time Password (TOTP)</b></h6>
<p>TOTPs are 6 digit codes generated on-demand as a second authentication factor.</p>
<p>
<button type="button" class="btn btn-success" hx-post="/ui/reset/add_totp">
<button type="button" class="btn btn-primary" hx-post="/ui/reset/add_totp">
Add TOTP
</button>
</p>
@ -48,13 +48,13 @@
<h6><b>Time-based One Time Password (TOTP)</b></h6>
<p>TOTPs are 6 digit codes generated on-demand as a second authentication factor.</p>
(% for totp in totp_set %)
<button type="button" class="btn btn-warning" hx-post="/ui/api/remove_totp" hx-vals='{"name": "(( totp ))"}'>
<button type="button" class="btn btn-warning mb-2" hx-post="/ui/api/remove_totp" hx-vals='{"name": "(( totp ))"}'>
Remove totp (( totp ))
</button>
(% endfor %)
<p>
<button type="button" class="btn btn-success" hx-post="/ui/reset/add_totp">
<button type="button" class="btn btn-primary" hx-post="/ui/reset/add_totp">
Add TOTP
</button>
</p>