diff options
author | Maksim Sukharev <antreesy.web@gmail.com> | 2023-04-26 10:29:04 +0200 |
---|---|---|
committer | GitHub <noreply@github.com> | 2023-04-26 10:29:04 +0200 |
commit | a223f9b56a29fa3030eb63f57700b09b37551cb7 (patch) | |
tree | 33bdb786609c55e18048422633c9774740c42237 | |
parent | a699d959ec4c6749172ee70d419f0ed90efc80f5 (diff) | |
parent | 908aa403203c82284b7cecf6cf545bc48c1e3dcc (diff) |
Merge pull request #9376 from nextcloud/fix/noid/input-field-labels
Accessibility improvements for text fields and buttons
8 files changed, 17 insertions, 11 deletions
diff --git a/src/components/LeftSidebar/NewGroupConversation/SetContacts/SetContacts.vue b/src/components/LeftSidebar/NewGroupConversation/SetContacts/SetContacts.vue index 7296414e8..933a33f68 100644 --- a/src/components/LeftSidebar/NewGroupConversation/SetContacts/SetContacts.vue +++ b/src/components/LeftSidebar/NewGroupConversation/SetContacts/SetContacts.vue @@ -26,7 +26,7 @@ v-observe-visibility="visibilityChanged" :value.sync="searchText" type="text" - :placeholder="t('spreed', 'Search participants')" + :label="t('spreed', 'Search participants')" @input="handleInput"> <Magnify :size="16" /> </NcTextField> diff --git a/src/components/LeftSidebar/NewGroupConversation/SetConversationName/SetConversationName.vue b/src/components/LeftSidebar/NewGroupConversation/SetConversationName/SetConversationName.vue index c4a9619f3..37808d8f7 100644 --- a/src/components/LeftSidebar/NewGroupConversation/SetConversationName/SetConversationName.vue +++ b/src/components/LeftSidebar/NewGroupConversation/SetConversationName/SetConversationName.vue @@ -25,7 +25,7 @@ v-observe-visibility="visibilityChanged" type="text" :value="value" - :placeholder="t('spreed', 'Conversation name')" + :label="t('spreed', 'Conversation name')" @input="handleInput" @keydown.enter="handleKeydown" /> </div> diff --git a/src/components/LeftSidebar/SearchBox/SearchBox.vue b/src/components/LeftSidebar/SearchBox/SearchBox.vue index 5092d6252..31c65f45b 100644 --- a/src/components/LeftSidebar/SearchBox/SearchBox.vue +++ b/src/components/LeftSidebar/SearchBox/SearchBox.vue @@ -23,7 +23,7 @@ <form @submit.prevent="handleSubmit"> <NcTextField ref="searchConversations" :value.sync="localValue" - :placeholder="placeholderText" + :label="placeholderText" :show-trailing-button="isSearching" trailing-button-icon="close" @trailing-button-click="abortSearch" diff --git a/src/components/MessagesList/MessagesGroup/Message/MessagePart/PollVotersDetails.vue b/src/components/MessagesList/MessagesGroup/Message/MessagePart/PollVotersDetails.vue index 4825e897f..82e72d9f4 100644 --- a/src/components/MessagesList/MessagesGroup/Message/MessagePart/PollVotersDetails.vue +++ b/src/components/MessagesList/MessagesGroup/Message/MessagePart/PollVotersDetails.vue @@ -23,6 +23,7 @@ <NcPopover class="poll-voters-details" trigger="hover"> <template #trigger> <NcButton type="tertiary-no-background" + :aria-label="t('spreed','Voted participants')" class="poll-voters-details__button"> <template #icon> <AvatarWrapper v-for="(item, index) in details.slice(0, 8)" diff --git a/src/components/NewMessageForm/SimplePollsEditor/PollOption.vue b/src/components/NewMessageForm/SimplePollsEditor/PollOption.vue index f959f8b78..99ce82c11 100644 --- a/src/components/NewMessageForm/SimplePollsEditor/PollOption.vue +++ b/src/components/NewMessageForm/SimplePollsEditor/PollOption.vue @@ -25,11 +25,11 @@ <NcTextField class="poll-option__input" v-bind="$attrs" v-on="$listeners" /> <NcButton v-if="canDelete" type="tertiary-no-background" + :aria-label="t('spreed', 'Delete poll option')" @click="deleteOption"> - <Close slot="icon" - decorative - title="" - :size="20" /> + <template #icon> + <Close :size="20" /> + </template> </NcButton> </form> </template> diff --git a/src/components/NewMessageForm/SimplePollsEditor/SimplePollsEditor.vue b/src/components/NewMessageForm/SimplePollsEditor/SimplePollsEditor.vue index 133e531b6..6990cc2b9 100644 --- a/src/components/NewMessageForm/SimplePollsEditor/SimplePollsEditor.vue +++ b/src/components/NewMessageForm/SimplePollsEditor/SimplePollsEditor.vue @@ -31,24 +31,26 @@ <p class="simple-polls-editor__caption"> {{ t('spreed', 'Question') }} </p> - <NcTextField :value.sync="pollQuestion" :placeholder="t('spreed', 'Ask a question')" v-on="$listeners" /> + <NcTextField :value.sync="pollQuestion" :label="t('spreed', 'Ask a question')" v-on="$listeners" /> <!-- Poll options --> <p class="simple-polls-editor__caption"> {{ t('spreed', 'Answers') }} </p> - <PollOption v-for="option, index in pollOptions" + <PollOption v-for="(option, index) in pollOptions" :key="index" :ref="`pollOption${index}`" class="simple-polls-editor__option" :value.sync="pollOptions[index]" - :placeholder="t('spreed', 'Answer {option}', {option: index + 1})" + :label="t('spreed', 'Answer {option}', {option: index + 1})" :can-delete="pollOptions.length > 2" @delete-option="deleteOption(index)" /> <!-- Add options --> <NcButton class="simple-polls-editor__add-more" type="tertiary-no-background" @click="addOption"> - <Plus slot="icon" /> + <template #icon> + <Plus /> + </template> {{ t('spreed', 'Add answer') }} </NcButton> diff --git a/src/components/TopBar/TopBar.vue b/src/components/TopBar/TopBar.vue index 7656a5cfc..ae654306d 100644 --- a/src/components/TopBar/TopBar.vue +++ b/src/components/TopBar/TopBar.vue @@ -117,6 +117,8 @@ <!-- in call: open chat tab --> <NcButton v-else + :aria-label="t('spreed', 'Open chat')" + :title="t('spreed', 'Open chat')" class="top-bar__button chat-button dark-hover" type="tertiary" @click="openSidebar('chat')"> diff --git a/src/views/RoomSelector.vue b/src/views/RoomSelector.vue index e7afc7a71..ac2bc116f 100644 --- a/src/views/RoomSelector.vue +++ b/src/views/RoomSelector.vue @@ -35,6 +35,7 @@ <NcTextField :value.sync="searchText" trailing-button-icon="close" class="search-form" + :label="t('spreed', 'Search conversations or users')" :show-trailing-button="searchText !==''" @trailing-button-click="clearText"> <Magnify :size="16" /> |