Andreas/LibreChat
1
0
Fork 0
mirror of https://github.com/danny-avila/LibreChat.git synced 2025-12-20 10:20:15 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 3

👐 a11y: Misc. Improvements (#3910)

Browse source 
* fix focus for cancel button in convo delete modal window #3829

* add aria-hidden and aria-label to X and Check svg/button respectively and updated OGDialogClose focus color

* update rename, newchat, newchat icon, ConvoOptions icon
This commit is contained in:
Vesna Tan 2024-09-05 14:30:17 -04:00 • committed by GitHub
parent 9ec665dd2c
commit b9197f90c6
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
5 changed files with 11 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

11
client/src/components/Conversations/Convo.tsx
View file

@ -14,6 +14,7 @@ import { useToastContext } from '~/Providers';
import { ConvoOptions } from './ConvoOptions';
import { cn } from '~/utils';
import store from '~/store';
import { useLocalize } from '~/hooks'
type KeyEvent = KeyboardEvent<HTMLInputElement>;
@ -44,6 +45,7 @@ export default function Conversation({
const [renaming, setRenaming] = useState(false);
const [isPopoverActive, setIsPopoverActive] = useState(false);
const isSmallScreen = useMediaQuery('(max-width: 768px)');
const localize = useLocalize();
const clickHandler = async (event: MouseEvent<HTMLAnchorElement>) => {
if (event.button === 0 && (event.ctrlKey || event.metaKey)) {
@ -146,13 +148,14 @@ export default function Conversation({
value={titleInput ?? ''}
onChange={(e) => setTitleInput(e.target.value)}
onKeyDown={handleKeyDown}
aria-label={`${localize('com_ui_rename')} ${localize('com_ui_chat')}`}
/>
<div className="flex gap-1">
<button onClick={cancelRename}>
<X className="transition-colors h-4 w-4 duration-200 ease-in-out hover:opacity-70" />
<button onClick={cancelRename} aria-label='cancel new name'>
<X aria-hidden={true} className="transition-colors h-4 w-4 duration-200 ease-in-out hover:opacity-70" />
</button>
<button onClick={onRename}>
<Check className="transition-colors h-4 w-4 duration-200 ease-in-out hover:opacity-70" />
<button onClick={onRename} aria-label='submit new name'>
<Check aria-hidden={true} className="transition-colors h-4 w-4 duration-200 ease-in-out hover:opacity-70" />
</button>
</div>
</div>