Open zacharydmoore opened 6 months ago
@carbon/react
Chrome
1.52.0
v16.14.0
The Tabs component's left slide arrow (used when there is a small screen and long tabs) has a transparent background now causing the arrow to bleed into text that is now shown.
https://stackblitz.com/edit/github-pkl5n9?file=src%2FApp.jsx
Navigate to Tabs component in Carbon Design System storybook. Shrink browser window until slider arrows begin to show. Press arrow until both left and right show (middle of tabs)
Severity 3 = User can complete task, and/or has a workaround within the user experience of a given component.
No response
Setting z-index to 1 in .cds--tabs .cds--tab--overflow-nav-button--previous seems to address this.
Package
@carbon/react
Browser
Chrome
Package version
1.52.0
React version
v16.14.0
Description
The Tabs component's left slide arrow (used when there is a small screen and long tabs) has a transparent background now causing the arrow to bleed into text that is now shown.
Reproduction/example
https://stackblitz.com/edit/github-pkl5n9?file=src%2FApp.jsx
Steps to reproduce
Navigate to Tabs component in Carbon Design System storybook. Shrink browser window until slider arrows begin to show. Press arrow until both left and right show (middle of tabs)![Screenshot 2024-03-08 at 8 18 27 AM](https://github.com/carbon-design-system/carbon/assets/46874543/bb974b75-d9be-48a7-b958-f6d521a14e8e)
Suggested Severity
Severity 3 = User can complete task, and/or has a workaround within the user experience of a given component.
Application/PAL
No response
Code of Conduct