Nonscrolling action buttons for long forms (#437)
* nonscroll action bar for long forms * changes from PR comments * fix border
This commit is contained in:
parent
96d89ab72e
commit
518b21c6ae
3 changed files with 15 additions and 3 deletions
|
@ -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));
|
||||
}
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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"
|
||||
|
|
Loading…
Reference in a new issue