Nonscrolling action buttons for long forms (#437)

* nonscroll action bar for long forms

* changes from PR comments

* fix border
This commit is contained in:
mfrances17 2021-03-16 08:35:45 -04:00 committed by GitHub
parent 96d89ab72e
commit 518b21c6ae
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 15 additions and 3 deletions

View file

@ -7,4 +7,16 @@
.keycloak__form {
max-width: 1024px;
}
}
.keycloak__form_actions {
position: fixed;
bottom: 0px;
background-color: var(--pf-c-page__main-section--m-light--BackgroundColor);
padding-top: var(--pf-global--spacer--md);
padding-bottom: var(--pf-global--spacer--sm);
padding-left: var(--pf-global--spacer--md);
width: 100%;
border-top: 1px solid var(--pf-global--BorderColor--100);
margin-left: calc(-1 * var(--pf-global--spacer--lg));
}

View file

@ -143,7 +143,7 @@ export const ClientSettings = ({ save }: ClientSettingsProps) => {
ref={register}
/>
</FormGroup>
<ActionGroup>
<ActionGroup className="keycloak__form_actions">
<Button variant="primary" onClick={save}>
{t("common:save")}
</Button>

View file

@ -296,7 +296,7 @@ export const UserFederationLdapSettings = () => {
<LdapSettingsAdvanced form={form} />
</ScrollForm>
<Form onSubmit={form.handleSubmit(save)}>
<ActionGroup>
<ActionGroup className="keycloak__form_actions">
<Button
isDisabled={!form.formState.isDirty}
variant="primary"