diff options
| author | Pytal <24800714+Pytal@users.noreply.github.com> | 2023-02-28 17:12:46 -0800 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2023-02-28 17:12:46 -0800 |
| commit | b92e28e6e6842b8163da6986795e0ac0763412e6 (patch) | |
| tree | 3b31c231880624283a8dda1ade19fdebe61588c9 /apps | |
| parent | 7c477d4028c7c80e9ff48156fa95bb76f84aec71 (diff) | |
| parent | db5d5c1705f7e0d383fd0d639424591fa943aee9 (diff) | |
| download | nextcloud-server-b92e28e6e6842b8163da6986795e0ac0763412e6.tar.gz nextcloud-server-b92e28e6e6842b8163da6986795e0ac0763412e6.zip | |
Merge pull request #36650 from nextcloud/enh/a11y-admin-delegation-select
Diffstat (limited to 'apps')
| -rw-r--r-- | apps/settings/lib/Settings/Admin/Delegation.php | 4 | ||||
| -rw-r--r-- | apps/settings/src/components/AdminDelegating.vue | 11 | ||||
| -rw-r--r-- | apps/settings/src/components/AdminDelegation/GroupSelect.vue | 16 |
3 files changed, 20 insertions, 11 deletions
diff --git a/apps/settings/lib/Settings/Admin/Delegation.php b/apps/settings/lib/Settings/Admin/Delegation.php index 274b71150ed..1b41fe14edc 100644 --- a/apps/settings/lib/Settings/Admin/Delegation.php +++ b/apps/settings/lib/Settings/Admin/Delegation.php @@ -82,9 +82,11 @@ class Delegation implements ISettings { $settings = array_merge( $settings, array_map(function (IDelegatedSettings $setting) use ($section) { + $sectionName = $section->getName() . ($setting->getName() !== null ? ' - ' . $setting->getName() : ''); return [ 'class' => get_class($setting), - 'sectionName' => $section->getName() . ($setting->getName() !== null ? ' - ' . $setting->getName() : ''), + 'sectionName' => $sectionName, + 'id' => mb_strtolower(str_replace(' ', '-', $sectionName)), 'priority' => $section->getPriority(), ]; }, $sectionSettings) diff --git a/apps/settings/src/components/AdminDelegating.vue b/apps/settings/src/components/AdminDelegating.vue index 90f42f73ab5..e61b0cb74bb 100644 --- a/apps/settings/src/components/AdminDelegating.vue +++ b/apps/settings/src/components/AdminDelegating.vue @@ -4,7 +4,7 @@ :doc-url="authorizedSettingsDocLink"> <div class="setting-list"> <div v-for="setting in availableSettings" :key="setting.class"> - <h3>{{ setting.sectionName }}</h3> + <label :for="setting.id">{{ setting.sectionName }}</label> <GroupSelect :available-groups="availableGroups" :authorized-groups="authorizedGroups" :setting="setting" /> </div> </div> @@ -32,3 +32,12 @@ export default { }, } </script> + +<style lang="scss" scoped> +label { + display: block; + font-size: 16px; + margin: 12px 0; + color: var(--color-text-light); +} +</style> diff --git a/apps/settings/src/components/AdminDelegation/GroupSelect.vue b/apps/settings/src/components/AdminDelegation/GroupSelect.vue index 52ecd6c4846..f59a41d86e6 100644 --- a/apps/settings/src/components/AdminDelegation/GroupSelect.vue +++ b/apps/settings/src/components/AdminDelegation/GroupSelect.vue @@ -1,17 +1,16 @@ <template> - <NcMultiselect v-model="selected" - class="group-multiselect" + <NcSelect :input-id="setting.id" + v-model="selected" + class="group-select" :placeholder="t('settings', 'None')" - track-by="gid" label="displayName" :options="availableGroups" - open-direction="bottom" :multiple="true" - :allow-empty="true" /> + :close-on-select="false" /> </template> <script> -import NcMultiselect from '@nextcloud/vue/dist/Components/NcMultiselect' +import NcSelect from '@nextcloud/vue/dist/Components/NcSelect.js' import { generateUrl } from '@nextcloud/router' import axios from '@nextcloud/axios' import { showError } from '@nextcloud/dialogs' @@ -20,7 +19,7 @@ import logger from '../../logger' export default { name: 'GroupSelect', components: { - NcMultiselect, + NcSelect, }, props: { availableGroups: { @@ -67,8 +66,7 @@ export default { </script> <style lang="scss"> -.group-multiselect { +.group-select { width: 100%; - margin-right: 0; } </style> |