question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Global types added to the toolbar are illegible when using OSX dark theme

See original GitHub issue

Describe the bug A clear and concise description of what the bug is. The dropdown menu on the global types that are defined in the menu is displayed with black text on a black background when using a Mac with dark theme.

To Reproduce Steps to reproduce the behavior:

  1. Install the Storybook a11y add-on or define a global type
  2. Set Mac to dark theme
  3. Click on one of the menus in the toolbar
  4. See that you cannot read anything

Expected behavior A clear and concise description of what you expected to happen.

The menu should not change background color when dark theme is set, or at least the text should also change color.

Screenshots If applicable, add screenshots to help explain your problem. Screen Shot 2021-04-05 at 3 26 39 PM

This one struck me as particularly ironic: Screen Shot 2021-04-08 at 10 49 11 AM

Code snippets If applicable, add code samples to help explain your problem.

System Please paste the results of npx sb@next info here.

% npx sb@next info

Environment Info:

  System:
    OS: macOS 10.15.7
    CPU: (8) x64 Intel(R) Core(TM) i7-7820HQ CPU @ 2.90GHz
  Binaries:
    Node: 12.21.0 - /usr/local/opt/node@12/bin/node
    Yarn: 1.22.4 - /usr/local/bin/yarn
    npm: 6.14.11 - /usr/local/opt/node@12/bin/npm
  Browsers:
    Chrome: 89.0.4389.114
    Safari: 13.1.3
  npmPackages:
    @storybook/addon-a11y: 6.2.2 => 6.2.2 
    @storybook/addon-actions: 6.2.2 => 6.2.2 
    @storybook/addon-essentials: 6.2.2 => 6.2.2 
    @storybook/addon-knobs: 6.2.2 => 6.2.2 
    @storybook/addon-links: 6.2.2 => 6.2.2 
    @storybook/addon-postcss: ^2.0.0 => 2.0.0 
    @storybook/addon-storysource: 6.2.2 => 6.2.2 
    @storybook/addons: 6.2.2 => 6.2.2 
    @storybook/react: 6.2.2 => 6.2.2 
    @storybook/source-loader: 6.2.2 => 6.2.2 
    @storybook/storybook-deployer: ^2.8.7 => 2.8.7 
    @storybook/theming: 6.2.2 => 6.2.2 

Additional context Add any other context about the problem here.

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Comments:5 (4 by maintainers)

github_iconTop GitHub Comments

1reaction
blankwavearcadecommented, Apr 9, 2021

Hi, I’d like to work this issue.

0reactions
randakcommented, May 24, 2021

We traced this down to an incompatibility outside of the core Storybook project, so I’ll close this issue.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Use Dark Mode on your Mac - Apple Support
Open settings: In macOS Ventura or later, choose Apple menu > System Settings, then click Appearance in the sidebar.
Read more >
How do I get my tabs back below the bookmark toolbar? And ...
Black backgrounds with faint light type are not the way to go. ... an option to go to the Mozilla Add-ons site to...
Read more >
TeXShop Changes 5.08 - University of Oregon
MacOS Big Sur introduced a new kind of toolbar search field which expands when being used and collapses otherwise. When TeXShop runs on...
Read more >
Theme your Web Apps like a PRO | Dark Mode in Storybook
How confident are you in your dark mode implementation? @chantastic shows how to implement a dark mode switcher using globalTypes — and all ......
Read more >
Mathworks: it's time for a dark theme. - MATLAB Answers
Most of the OS, GUIs, programs are actually in dark mode, and a vast majority of the users makes indeed use of a...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found