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

DRAFT - 765-fix: Fix styles active menu item #814

Draft
wants to merge 2 commits into
base: main
Choose a base branch
from

Conversation

JuliaAnt
Copy link
Collaborator

What type of PR is this? (select all that apply)

  • πŸ• Feature
  • πŸ› Bug Fix
  • 🚧 Breaking Change
  • πŸ§‘β€πŸ’» Code Refactor
  • πŸ“ Documentation Update

Description

Fixed styles for the active menu item and resolved the Lighthouse issue related to the touch target size of the dropdown arrow.

Related Tickets & Documents

Screenshots, Recordings

Before:

image

After:

Screenshot 2025-03-12 at 14 20 03

Added/updated tests?

  • πŸ‘Œ Yes
  • πŸ™…β€β™‚οΈ No, because they aren't needed
  • πŸ™‹β€β™‚οΈ No, because I need help

[optional] Are there any post deployment tasks we need to perform?

[optional] What gif best describes this PR or how it makes you feel?

@JuliaAnt JuliaAnt self-assigned this Mar 12, 2025
@github-actions github-actions bot changed the title fix: 765 - change style of active menu item. Fix lighthouse problem 765-fix: Fix styles active menu item Mar 12, 2025
@SpaNb4
Copy link
Collaborator

SpaNb4 commented Mar 13, 2025

The arrow's focus state could be improved
image

This isn't due to your changes, but the spacing is inconsistent here
image

Copy link

Lighthouse Report:

  • Performance: 97 / 100
  • Accessibility: 96 / 100
  • Best Practices: 100 / 100
  • SEO: 100 / 100

View detailed report

Copy link
Collaborator

@SpaNb4 SpaNb4 left a comment

Choose a reason for hiding this comment

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

Keyboard navigation of submenus seems broken to me. First Enter/Space press redirects the page, second opens the menu

2025-03-15.12-16-29.mp4

Copy link
Collaborator

@ansivgit ansivgit left a comment

Choose a reason for hiding this comment

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

image

For a non-yellow background of the hero-banner, the underline blends in with the image. Also, I think the current page should be highlighted.

setDropdownOpen((prev) => !prev);
}
};

const handleEscKeyPress = (e: KeyboardEvent<HTMLElement>) => {
if (e.code === 'Escape') {
Copy link
Collaborator

@ansivgit ansivgit Mar 18, 2025

Choose a reason for hiding this comment

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

Let's all keys' codes move to constant like KEY_CODES = {ESCAPE: 'Escape', .....} You could add it here src/core/const/index.ts

@YulikK YulikK changed the title 765-fix: Fix styles active menu item DRAFT - 765-fix: Fix styles active menu item Mar 18, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Menu items active text color
6 participants