Fix CSP-blocked inline handlers on SSO clients page

script-src 'self' blocks onclick handlers and style-src blocks inline
style attributes. Replace onclick with data-toggle-form attributes
wired by mcias.js on DOMContentLoaded, and move inline styles to CSS
utility classes.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-04-01 08:22:17 -07:00
parent ef28805042
commit e082671f53
3 changed files with 39 additions and 6 deletions

View File

@@ -6,22 +6,25 @@
<h2>SSO Clients</h2>
<p class="text-muted text-small">Registered applications that use MCIAS for single sign-on.</p>
</div>
<button class="btn btn-primary" onclick="var f=document.getElementById('create-form');f.hidden=!f.hidden;this.textContent=f.hidden?'Add Client':'Cancel'">Add Client</button>
<button class="btn btn-primary"
data-toggle-form="create-form"
data-label-show="Add Client"
data-label-hide="Cancel">Add Client</button>
</div>
<div id="create-form" class="card mt-2" hidden>
<div class="card-title">Register SSO Client</div>
<form hx-post="/sso-clients" hx-target="#sso-clients-tbody" hx-swap="afterbegin">
<div class="d-flex gap-1" style="flex-wrap:wrap">
<div class="form-group" style="flex:1;min-width:200px">
<div class="d-flex gap-1 flex-wrap">
<div class="form-group flex-1">
<label class="form-label">Client ID / Service Name</label>
<input class="form-control" type="text" name="client_id" required placeholder="e.g. mcr">
</div>
<div class="form-group" style="flex:2;min-width:300px">
<div class="form-group flex-2">
<label class="form-label">Redirect URI</label>
<input class="form-control" type="url" name="redirect_uri" required placeholder="https://service.example.com/sso/callback">
</div>
<div class="form-group" style="flex:1;min-width:200px">
<div class="form-group flex-1">
<label class="form-label">Tags <span class="text-muted text-small">(comma-separated)</span></label>
<input class="form-control" type="text" name="tags" placeholder="env:prod,tier:web">
</div>
@@ -49,6 +52,6 @@
{{end}}
</tbody>
</table>
{{if eq (len .Clients) 0}}<p class="text-muted" style="text-align:center;padding:2rem">No SSO clients registered.</p>{{end}}
{{if eq (len .Clients) 0}}<p class="text-muted text-center p-2">No SSO clients registered.</p>{{end}}
</div>
{{end}}