feat(oidc): admin / my account: correct style

This commit is contained in:
Edouard Vanbelle
2026-08-08 20:21:34 +02:00
parent fa7b651897
commit 93bb114e21
+16 -21
View File
@@ -502,7 +502,8 @@
} }
} }
async function onConnectSso() { async function onConnectSso(e: SubmitEvent) {
e.preventDefault();
ssoBusy = true; ssoBusy = true;
try { try {
const url = await startOidcLink(); const url = await startOidcLink();
@@ -517,7 +518,8 @@
} }
} }
async function onDisconnectSso() { async function onDisconnectSso(e: SubmitEvent) {
e.preventDefault();
const ok = await confirmDialog({ const ok = await confirmDialog({
title: t('profile.sso_disconnect_confirm_title', 'Disconnect Single Sign-On?'), title: t('profile.sso_disconnect_confirm_title', 'Disconnect Single Sign-On?'),
message: t( message: t(
@@ -1069,8 +1071,8 @@
email-match on link, no-alternative-auth refusal on unlink. email-match on link, no-alternative-auth refusal on unlink.
--> -->
{#if canConnectSso} {#if canConnectSso}
<section class="card sso-card" data-testid="profile-sso-connect-card"> <form class="card sso-card" data-testid="profile-sso-connect-card" onsubmit={onConnectSso}>
<h2><Icon name="key" /> {t('profile.sso_connect_title', 'Connect Single Sign-On')}</h2> <h2><Icon name="link" /> {t('profile.sso_connect_title', 'Connect Single Sign-On')}</h2>
<p> <p>
{t( {t(
'profile.sso_connect_description', 'profile.sso_connect_description',
@@ -1078,22 +1080,21 @@
'Link your account to {{provider}} so you can sign in with SSO instead of your password.' 'Link your account to {{provider}} so you can sign in with SSO instead of your password.'
)} )}
</p> </p>
<button <button type="submit" data-testid="profile-sso-connect-btn" disabled={ssoBusy}>
type="button"
data-testid="profile-sso-connect-btn"
onclick={onConnectSso}
disabled={ssoBusy}
>
{t( {t(
'profile.sso_connect_button', 'profile.sso_connect_button',
{ provider: oidcProviderName }, { provider: oidcProviderName },
'Connect with {{provider}}' 'Connect with {{provider}}'
)} )}
</button> </button>
</section> </form>
{:else if canDisconnectSso} {:else if canDisconnectSso}
<section class="card sso-card" data-testid="profile-sso-disconnect-card"> <form
<h2><Icon name="key" /> {t('profile.sso_disconnect_title', 'Single Sign-On')}</h2> class="card sso-card"
data-testid="profile-sso-disconnect-card"
onsubmit={onDisconnectSso}
>
<h2><Icon name="link" /> {t('profile.sso_disconnect_title', 'Single Sign-On')}</h2>
<p> <p>
{t( {t(
'profile.sso_disconnect_description', 'profile.sso_disconnect_description',
@@ -1101,16 +1102,10 @@
'Your account is connected to {{provider}}. Disconnecting will require you to sign in with your password from now on.' 'Your account is connected to {{provider}}. Disconnecting will require you to sign in with your password from now on.'
)} )}
</p> </p>
<button <button type="submit" data-testid="profile-sso-disconnect-btn" disabled={ssoBusy}>
type="button"
class="btn-danger"
data-testid="profile-sso-disconnect-btn"
onclick={onDisconnectSso}
disabled={ssoBusy}
>
{t('profile.sso_disconnect_button', 'Disconnect Single Sign-On')} {t('profile.sso_disconnect_button', 'Disconnect Single Sign-On')}
</button> </button>
</section> </form>
{/if} {/if}
{:else} {:else}
<p>{t('common.loading', 'Loading…')}</p> <p>{t('common.loading', 'Loading…')}</p>