Skip to content

Commit

Permalink
users: fix text misalignment issue in account overview menu
Browse files Browse the repository at this point in the history
  • Loading branch information
@dCO2 @KKoukiou
dCO2 authored and KKoukiou committed Mar 22, 2023
1 parent a06a0dc commit f6dc34a
Show file tree
Hide file tree
Showing 3 changed files with 51 additions and 57 deletions.
104 changes: 49 additions & 55 deletions pkg/users/account-details.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -280,66 +280,60 @@ export function AccountDetails({ accounts, groups, shadow, current_user, user })
<output id="account-last-login">{last_login}</output>
</FormGroup>
<FormGroup fieldId="account-locked" label={_("Options")} hasNoPaddingTop>
<div>
<div className="account-column-one">
<Flex spaceItems={{ default: 'spaceItemsSm' }} alignItems={{ default: 'alignItemsCenter' }}>
<Checkbox id="account-locked"
isDisabled={!superuser.allowed || edited_locked != null || user == current_user}
isChecked={edited_locked != null ? edited_locked : account.isLocked}
onChange={checked => change_locked(checked)}
label={_("Disallow interactive password")} />

<Popover bodyContent={_("Other authentication methods are still available even when interactive password authentication is not allowed.")}
showClose={false}>
<HelpIcon />
</Popover>
</Flex>
</div>
<Flex flex={{ default: 'inlineFlex' }}>
<span id="account-expiration-text">
{expiration.account_text}
</span>
<Button onClick={() => account_expiration_dialog(account, expiration.account_date)}
isDisabled={!superuser.allowed}
variant="link"
isInline
id="account-expiration-button">
{_("edit")}
</Button>
<Flex spaceItems={{ default: 'spaceItemsSm' }} alignItems={{ default: 'alignItemsCenter' }}>
<Flex className="accounts-column-one" spaceItems={{ default: 'spaceItemsSm' }} alignItems={{ default: 'alignItemsCenter' }}>
<Checkbox id="account-locked"
isDisabled={!superuser.allowed || edited_locked != null || user == current_user}
isChecked={edited_locked != null ? edited_locked : account.isLocked}
onChange={checked => change_locked(checked)}
label={_("Disallow interactive password")} />

<Popover bodyContent={_("Other authentication methods are still available even when interactive password authentication is not allowed.")}
showClose={false}>
<HelpIcon />
</Popover>
</Flex>
</div>
<span id="account-expiration-text">
{expiration.account_text}
</span>
<Button onClick={() => account_expiration_dialog(account, expiration.account_date)}
isDisabled={!superuser.allowed}
variant="link"
isInline
id="account-expiration-button">
{_("edit")}
</Button>
</Flex>
</FormGroup>
{ self_mod_allowed &&
<FormGroup fieldId="account-set-password" label={_("Password")}>
<div>
<div className="account-column-one">
{ self_mod_allowed &&
<Button variant="secondary" id="account-set-password"
onClick={() => set_password_dialog(account, current_user)}>
{_("Set password")}
</Button>
}
{ "\n" }
{ superuser.allowed &&
<Button variant="secondary" id="password-reset-button"
onClick={() => reset_password_dialog(account)}>
{_("Force change")}
</Button>
}
</div>
<Flex flex={{ default: 'inlineFlex' }}>
<span id="password-expiration-text">
{expiration.password_text}
</span>
<Button onClick={() => password_expiration_dialog(account, expiration.password_days)}
isDisabled={!superuser.allowed}
variant="link"
isInline
id="password-expiration-button">
{_("edit")}
</Button>
</Flex>
<div className="account-column-one">
{ self_mod_allowed &&
<Button variant="secondary" id="account-set-password"
onClick={() => set_password_dialog(account, current_user)}>
{_("Set password")}
</Button>
}
{ "\n" }
{ superuser.allowed &&
<Button variant="secondary" id="password-reset-button"
onClick={() => reset_password_dialog(account)}>
{_("Force change")}
</Button>
}
</div>
<Flex flex={{ default: 'inlineFlex' }}>
<span id="password-expiration-text">
{expiration.password_text}
</span>
<Button onClick={() => password_expiration_dialog(account, expiration.password_days)}
isDisabled={!superuser.allowed}
variant="link"
isInline
id="password-expiration-button">
{_("edit")}
</Button>
</Flex>
</FormGroup>
}
{ account.home && <FormGroup fieldId="account-home-dir" hasNoPaddingTop label={_("Home directory")}>
Expand Down
2 changes: 1 addition & 1 deletion pkg/users/users.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -55,7 +55,7 @@
}

.account-column-one {
min-width: 270px;
min-width: 280px;
display: inline-block;
}

Expand Down
2 changes: 1 addition & 1 deletion test/reference
Submodule reference updated 5 files
+ − TestAccounts-testBasic-user-detail-page-dark-pixels.png
+ − TestAccounts-testBasic-user-detail-page-medium-pixels.png
+ − TestAccounts-testBasic-user-detail-page-mobile-pixels.png
+ − TestAccounts-testBasic-user-detail-page-pixels.png
+ − TestAccounts-testBasic-user-detail-page-rtl-pixels.png

0 comments on commit f6dc34a

Please sign in to comment.