mirrors/owncast
1
0
Fork 0
mirror of https://github.com/owncast/owncast.git synced 2024-11-25 14:20:54 +03:00
Code Issues Projects Releases Packages Wiki Activity

improve chat input accessibility (#2353)

Browse source 
Sets aria-role="textbox" and aria-placeholder
This commit is contained in:
Albin Larsson 2022-11-17 19:32:25 +01:00 committed by GitHub
parent 3a401991cf
commit 17bf41461c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 3 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
webroot/js/components/chat/chat-input.js
View file

@ -347,8 +347,9 @@ export default class ChatInput extends Component {
>
<${ContentEditable}
id="message-input"
aria-role="textbox"
class="appearance-none block w-full bg-transparent text-sm text-gray-700 h-full focus:outline-none"
placeholderText=${placeholderText}
aria-placeholder=${placeholderText}
innerRef=${this.formMessageInput}
html=${inputHTML}
disabled=${!inputEnabled}

2
webroot/styles/chat.css
View file

@ -62,7 +62,7 @@
/* If the div is empty then show the placeholder */
#message-input:empty:before {
content: attr(placeholderText);
content: attr(aria-placeholder);
pointer-events: none;
position: absolute; /* Fixes firefox positioning caret on the right */
display: block; /* For Firefox */