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

Color Picker Knob displaying underneath other color buttons #9595

Closed
bathan opened this issue Jan 22, 2020 · 2 comments
Closed

Color Picker Knob displaying underneath other color buttons #9595

bathan opened this issue Jan 22, 2020 · 2 comments

Comments

@bathan
Copy link

bathan commented Jan 22, 2020

Describe the bug
When using multiple color selectors on same story, it displays oddly.

To Reproduce
Write a story that has more than 1 color picker/prop.

Expected behavior
All color pickers should display on top of other elements.

Screenshots
When having multiple color props, the picker displays only on top of the one it was called from.

Screen Shot 2020-01-22 at 11 25 26

Code snippets

storiesOf('Atoms', module)
    .addDecorator(withKnobs)
    .add(
        'Icon',
        () => (
            <div>
                <Icon
                    size={select('size', ['small', 'medium', 'large'], 'large')}
                    fill={color('fill', colors.white)}
                    secondaryFill={color('secondaryFill', colors.black, 'More Colors')}
                    bgColor={color('bgColor', 'transparent', 'More Colors')}
                    inactive={boolean('inactive', false)}
                    ariaHidden={boolean('ariaHidden', true)}
                />
            </div>
        ));

System:

Environment Info:

  System:
    OS: macOS 10.15.2
    CPU: (8) x64 Intel(R) Core(TM) i7-4870HQ CPU @ 2.50GHz
  Binaries:
    Node: 10.18.0 - ~/.nvm/versions/node/v10.18.0/bin/node
    Yarn: 1.19.2 - /usr/local/bin/yarn
    npm: 6.13.1 - ~/www/disney/dss-arcbook/node_modules/.bin/npm
  Browsers:
    Chrome: 79.0.3945.130
    Firefox: 71.0
    Safari: 13.0.4
  npmPackages:
    @storybook/addon-a11y: 5.0.0 => 5.0.0
    @storybook/addon-actions: 5.0.0 => 5.0.0
    @storybook/addon-backgrounds: 5.0.0 => 5.0.0
    @storybook/addon-centered: 5.0.0 => 5.0.0
    @storybook/addon-info: 5.0.0 => 5.0.0
    @storybook/addon-knobs: 5.0.0 => 5.0.0
    @storybook/addon-links: 5.0.0 => 5.0.0
    @storybook/addon-options: 5.0.0 => 5.0.0
    @storybook/addon-viewport: 5.0.0 => 5.0.0
    @storybook/react: 5.1.4 => 5.1.4

Additional context
MacOS Catalina 10.15.2
Chrome Version 79.0.3945.130 (Official Build) (64-bit)

@bathan bathan changed the title Color Picker Knob displaying underneath other color pickers Color Picker Knob displaying underneath other color buttons Jan 22, 2020
@stale
Copy link

stale bot commented Feb 13, 2020

Hi everyone! Seems like there hasn't been much going on in this issue lately. If there are still questions, comments, or bugs, please feel free to continue the discussion. Unfortunately, we don't have time to get to every issue. We are always open to contributions so please send us a pull request if you would like to help. Inactive issues will be closed after 30 days. Thanks!

@stale stale bot added the inactive label Feb 13, 2020
@stale
Copy link

stale bot commented Mar 14, 2020

Hey there, it's me again! I am going close this issue to help our maintainers focus on the current development roadmap instead. If the issue mentioned is still a concern, please open a new ticket and mention this old one. Cheers and thanks for using Storybook!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants