Fix alignment and spacing of SSO providers

This commit is contained in:
Andrew Kingston 2021-09-13 16:05:26 +01:00
parent 29e34d16be
commit 4209d3a1cc
1 changed files with 16 additions and 7 deletions

View File

@ -272,7 +272,7 @@
})
</script>
<Layout>
<Layout noPadding>
<Layout gap="XS" noPadding>
<Heading size="M">Authentication</Heading>
<Body>
@ -285,9 +285,9 @@
<Divider />
<Layout gap="XS" noPadding>
<Heading size="S">
<div>
<div class="provider-title">
<GoogleLogo />
Google
<span>Google</span>
<div class="google-save-button">
<div>
<Button
@ -330,9 +330,9 @@
<Divider />
<Layout gap="XS" noPadding>
<Heading size="S">
<div>
<div class="provider-title">
<OidcLogo />
OpenID Connect
<span>OpenID Connect</span>
<div class="oidc-save-button">
<div>
<Button
@ -426,11 +426,20 @@
.google-save-button {
display: inline-block;
margin-left: 400px;
}
.oidc-save-button {
display: inline-block;
margin-left: 320px;
}
.provider-title {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
gap: var(--spacing-m);
}
.provider-title span {
flex: 1 1 auto;
}
</style>