Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: a11y: improve tab order (navbar) #4672

Merged
merged 4 commits into from
Feb 20, 2025
Merged

Conversation

WofWca
Copy link
Collaborator

@WofWca WofWca commented Feb 17, 2025

Toggle "hide whitespace" for easier review.

This ensures that the list of chats follows the search bar,
and that the messages list follows the chat header.
Closes #4225.

This mostly moves code around, and simplifies some things
(such as replacing width: 30% duplication) along the way.

But it also changes the relative sizes of the "chat list" and the
"chat" (main view) sections, to a ratio of 3:8
(before the "chat list" section was 30% of the window size).

Otherwise, besides, of course, the tab order fix,
this is not supposed to affect the behavior and the look of the app.

I testes a lot of things:

  • various screen sizes (small screen mode included)
  • gallery view
  • global gallery view
  • opening "Search in chat"

But there is still a chance that I missed something.

Copy link
Member

@Simon-Laux Simon-Laux left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I tested it and code looks good (though I have not read it line by line).

`__button` in BEM is conventionally used for children elements.
`--` is more clear.
To add module.scss file later.
It's not specific to the navbar.
This ensures that the list of chats follows the search bar,
and that the messages list follows the chat header.
Closes #4225.

This mostly moves code around, and simplifies some things
(such as replacing `width: 30%` duplication) along the way.

But it also changes the relative sizes of the "chat list" and the
"chat" (main view) sections, to a ratio of 3:8
(before the "chat list" section was 30% of the window size).

Otherwise, besides, of course, the tab order fix,
this is not supposed to affect the behavior and the look of the app.
@WofWca WofWca force-pushed the wofwca/rearrange-navbar-html branch from 102fe31 to b9646e5 Compare February 20, 2025 08:43
@WofWca WofWca merged commit 66c96d7 into main Feb 20, 2025
8 of 9 checks passed
@WofWca WofWca deleted the wofwca/rearrange-navbar-html branch February 20, 2025 08:44
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

HTML semantics: move navbars inside the "chat list" and "chat" sections
2 participants