admin/accounts: avoid scrolling on 'lg' screens
Massimo Melina committed
Nov 15, 2024 at 16:01 UTC
35f0cf2e7b401fa1f15fc0dc5341d2bfe25e1721
2 files changed
+9
-9
admin/src/AccountForm.ts
+7
-7
@@ -55,24 +55,24 @@ export default function AccountForm({ account, done, groups, addToBar, reload }:
55
...wantArray(addToBar),
56
],
57
fields: [
58
- { k: 'username', label: group ? 'Group name' : undefined, autoComplete: 'off', required: true, xl: group ? 12 : 4,
58
+ { k: 'username', label: group ? 'Group name' : undefined, autoComplete: 'off', required: true, lg: group ? 12 : 4,
59
getError: v => v !== account.username && apiCall('get_account', { username: v })
60
.then(got => got?.username === account.username ? "usernames are case-insensitive" : "already used", () => false),
61
},
62
- !group && { k: 'password', md: 6, xl: 4, type: 'password', autoComplete: 'new-password', required: add,
62
+ !group && { k: 'password', md: 6, lg: 4, type: 'password', autoComplete: 'new-password', required: add,
63
label: add ? "Password" : "Change password"
64
},
65
- !group && { k: 'password2', md: 6, xl: 4, type: 'password', autoComplete: 'new-password', label: 'Repeat password',
65
+ !group && { k: 'password2', md: 6, lg: 4, type: 'password', autoComplete: 'new-password', label: 'Repeat password',
66
getError: (x, { values }) => (x||'') !== (values.password||'') && "Enter same password" },
67
- { k: 'disabled', comp: BoolField, fromField: x=>!x, toField: x=>!x, label: "Enabled", xs: 12, sm: 6, xl: 8,
67
+ { k: 'disabled', comp: BoolField, fromField: x=>!x, toField: x=>!x, label: "Enabled", xs: 12, sm: 6, lg: 8,
68
helperText: "Login is prevented if account is disabled, or if all its groups are disabled"},
69
- { k: 'ignore_limits', comp: BoolField, xs: 'auto',
69
+ { k: 'ignore_limits', comp: BoolField, xs: true,
70
helperText: values.ignore_limits ? "Speed limits don't apply to this account" : "Speed limits apply to this account" },
71
- { k: 'admin', comp: BoolField, fromField: (v:boolean) => v||null, label: "Admin-panel access", xs: 12, sm: 6, xl: 8,
71
+ { k: 'admin', comp: BoolField, fromField: (v:boolean) => v||null, label: "Admin-panel access", xs: 12, sm: 6, lg: 8,
72
helperText: "To access THIS interface you are using right now",
73
...!account.admin && account.adminActualAccess && { value: true, disabled: true, helperText: "This permission is inherited. To disable it, act on the groups." },
74
},
75
- { k: 'disable_password_change', comp: BoolField, fromField: x=>!x, toField: x=>!x, label: "Allow password change", xs: 'auto' },
75
+ { k: 'disable_password_change', comp: BoolField, fromField: x=>!x, toField: x=>!x, label: "Allow password change", xs: true },
76
group && h(Alert, { severity: 'info' }, `To add users to this group, select the user and then click "Inherit"`),
77
{ k: 'belongs', comp: MultiSelectField, label: "Inherit from groups", options: belongsOptions,
78
helperText: "Specify groups to inherit permissions from"
admin/src/AccountsPage.ts
+2
-2
@@ -74,7 +74,7 @@ export default function AccountsPage() {
74
75
const scrollProps = { height: '100%', display: 'flex', flexDirection: 'column', overflow: 'auto' } as const
76
return element || h(Grid, { container: true, rowSpacing: 1, columnSpacing: 2, top: 0, flex: '1 1 auto', height: 0 },
77
- h(Grid, { item: true, xs: 12, [sideBreakpoint]: 5, lg: 5, xl: 5, ...scrollProps },
77
+ h(Grid, { item: true, xs: 12, [sideBreakpoint]: 5, lg: 4, xl: 5, ...scrollProps },
78
h(Box, {
79
display: 'flex',
80
flexWrap: 'wrap',
@@ -119,7 +119,7 @@ export default function AccountsPage() {
119
display: 'flex',
120
flexWrap: 'wrap',
121
padding: '.2em 0',
122
- gap: '.5em',
122
+ columnGap: '.5em',
123
alignItems: 'center',
124
}
125
},