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.

Sign up for GitHub

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

Jump to bottom

Style bug: Charts - space around circle nodes missing #1545

Open
orion-cengage opened this issue Nov 12, 2024 · 2 comments · Fixed by #1578
Open

Style bug: Charts - space around circle nodes missing #1545

orion-cengage opened this issue Nov 12, 2024 · 2 comments · Fixed by #1578
Assignees
@nikitaorliak-cengage
Labels
a11y Issues related to accessibility blocks release High priority tickets that block next release bug Something isn't working react-magma-dom Tasks related to react-magma-dom styles/theme Issues related to styling and/or theming

Comments

@orion-cengage
Copy link
Contributor

orion-cengage commented Nov 12, 2024 •
edited
Loading

Describe the bug
A styling issue was introduced in 4.5.0 where the clear space around the circle nodes on line charts is either missing or only partial, which is going to cause us a11y issues.

Screenshot of styling bug
image
image

To Reproduce
Steps to reproduce the behavior:

  1. Go to Storybook or Docs (4.5 or 4.6) and look at any of the charts based on lines, such as Line and Area
  2. Notice that the space around the circles that gives them visual separation is only kind of visible on the right side
  3. Also notice that if you hover over a circle node, it fixes itself.
  4. To see the correct styling you can go to Docs 4.4

Expected behavior
image
image
@orion-cengage orion-cengage added bug Something isn't working react-magma-dom Tasks related to react-magma-dom styles/theme Issues related to styling and/or theming a11y Issues related to accessibility labels Nov 12, 2024
@nikitaorliak-cengage nikitaorliak-cengage self-assigned this Nov 12, 2024
Merged
3 tasks
@nikitaorliak-cengage nikitaorliak-cengage linked a pull request Nov 19, 2024 that will close this issue
fix(Charts): Fix circle styles for Charts. #1578
Merged
3 tasks
@silvalaura silvalaura moved this from To Do to Ready for Review in React Magma Nov 20, 2024
@github-project-automation github-project-automation bot moved this from Ready for Review to Ready for QA in React Magma Nov 20, 2024
@silvalaura silvalaura added the blocks release High priority tickets that block next release label Nov 20, 2024
@chris-cedrone-cengage
Copy link
Collaborator

There isn't a white border on the circles with Safari 18

Safari

@orion-cengage
Copy link
Contributor Author

I tested as well, and the only issue I found was the same Safari issue Chris pointed out.

@silvalaura silvalaura moved this from Ready for QA to To Do in React Magma Nov 22, 2024
@silvalaura silvalaura reopened this Nov 22, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@nikitaorliak-cengage nikitaorliak-cengage

Labels
a11y Issues related to accessibility blocks release High priority tickets that block next release bug Something isn't working react-magma-dom Tasks related to react-magma-dom styles/theme Issues related to styling and/or theming
Projects
React Magma
Status: In Progress
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

fix(Charts): Fix circle styles for Charts. cengage/react-magma
4 participants
@orion-cengage @chris-cedrone-cengage @silvalaura @nikitaorliak-cengage