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

Tabs (Dropdown Issue) - experimental component (feedback from review) #1451

Closed
6 tasks done
jnm2377 opened this issue Nov 16, 2018 · 1 comment · Fixed by #1458
Closed
6 tasks done

Tabs (Dropdown Issue) - experimental component (feedback from review) #1451

jnm2377 opened this issue Nov 16, 2018 · 1 comment · Fixed by #1458
Assignees
@jnm2377
Labels
role: dev 🤖 type: bug 🐛
Milestone
Carbon X Release:...

Comments

@jnm2377
Copy link
Contributor

jnm2377 commented Nov 16, 2018 •
edited
Loading

When Tabs component reverts to Dropdown at Md breakpoint:

  • Make dropdown field Gray 20 on select (i.e. when menu is open)
  • Change field height of Dropdown to 40px and change menu item heights to 40px as well!
  • Make sure hover states on open Dropdown menu will be #e5e5e5 (Gray 10 hover)
  • Make sure hover state covers the rules (see file and also, structured list component); i.e. you don't want to see hover state AND rules at the same time
  • Use chevron glyph (can ask @joshblack if you have trouble finding) for icon
  • Position chevron 16px from the right edge of the dropdown

Drop_down_Specs_revised.png
@jnm2377 jnm2377 self-assigned this Nov 16, 2018
@jnm2377 jnm2377 mentioned this issue Nov 19, 2018
Merged
jnm2377 added a commit that referenced this issue Nov 20, 2018
@jnm2377
fix(tabs): fix dropdown input heights, icon and hover states, Closes #…
fb41d9b 
…1451 (#1458)

* feat(tabs): add Tabs experimental component

* feat(tabs): add outline to focused tab

* feat(tabs): adds disabled tab item for experimental component

* style(tabs): adds disabled style variable for tabs--x

* feat(tabs): adds experimental tab component

Fixes #1293

* feat(max-breakpoints): add mixin for mobile media queries used in tabs

* fix(tabs): add mobile styling for experimental tabs

* fix(disabled tabs): add disabled tab with other tab items in config file

* fix(tabs): adds disabled functionality on event handlers

* feat(tabs): adds testing for disabled tab

* fix(tabs): changes padding on focus border for link

* fix(tabs): added padding to item border-bottom

* feat(tabs): add functionality for new class on menu open

* feat(tabs): add new class to transition arrow on open

* fix(tabs): change padding for focus on dropdown items

* fix(tabs-test): adds new class option in test

* fix(tabs-test): adds testing for tabs-trigger--open class

* fix(tabs): adds tabindex to a tag for focus state

* fix(tabs): adds :active class to a tag for focus state in Safari

* fix(tabs): fixed transition on dropdown

* fix(tabs): change hover bg color and input heights

* fix(tabs): fix chevron height and width

* fix(tabs): change arrow to new chevron icon

* fix(tabs): fix selected item background color

* fix(tabs): fix icon for stable mode

* fix(tabs): add componentsX configuration

* fix(tabs): add top padding to nav instead of nav item for hover bug

* feat(spacing): add token for 1px spacing

* feat(spacing): add note for 4xs spacing
@carbon-bot
Copy link
Contributor

🎉 This issue has been resolved in version 9.54.1 🎉

The release is available on:

Your semantic-release bot 📦🚀

joshblack pushed a commit to joshblack/carbon that referenced this issue May 2, 2019
@jendowns @alisonjoseph
chore(multiselect): replace deprecated @storybook/react action (carbo…
17d1745 
…n-design-system#1451)
@snyk-bot snyk-bot mentioned this issue Jul 13, 2021
Open
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@jnm2377 jnm2377

Labels
role: dev 🤖 type: bug 🐛
Projects
None yet
Milestone
Carbon X Release: Eggnog Latte
Development

Successfully merging a pull request may close this issue.

fix(tabs): fix dropdown input heights, icon and hover states, Closes #1451
2 participants
@jnm2377 @carbon-bot