danny-avila / LibreChat

Enhanced ChatGPT Clone: Features Anthropic, AWS, OpenAI, Assistants API, Azure, Groq, o1, GPT-4o, Mistral, OpenRouter, Vertex AI, Gemini, Artifacts, AI model switching, message search, langchain, DALL-E-3, ChatGPT Plugins, OpenAI Functions, Secure Multi-User System, Presets, completely open-source for self-hosting. Actively in public development.
https://librechat.ai/
MIT License
19.16k stars 3.19k forks source link

Empty button in Side Panel #4445

Open derekjackson-das opened 1 month ago

derekjackson-das commented 1 month ago

Issue Description

There is an empty button called "toggle navigation" that is not visible but is accessible programatically via the keyboard and assistive technology.

WCAG Criteria

1.3.1 Info and Relationships - Level A

Screen recording

In the screen recording you can see that the VoiceOver Cursor essentially dissapears because there is no visible element on the page to move its focus too.

https://share.zight.com/DOu1KLez

Code Snippet

<div role="button" tabindex="0" class="nav-mask active" aria-label="Toggle navigation"></div>

Notes

If it has no purpose it should be deleted. If there is a reason for it to be here it should be programatically hidden as long as it is visually hidden.

In user testing this button in conjunction with the visible toggle button for the sidepanel created some confusion.