FIX background transparent on Preview causing the addons to be visisb…

…le, when they are not supposed to be Thanks to glitchperfect's #6042
storybookjs · Mar 15, 2019 · 5592373 · 5592373
1 parent 11e8a43
commit 5592373
Showing 1 changed file with 7 additions and 4 deletions.
diff --git a/addons/backgrounds/src/containers/BackgroundSelector.tsx b/addons/backgrounds/src/containers/BackgroundSelector.tsx
@@ -2,7 +2,7 @@ import React, { Component, Fragment } from 'react';
 import memoize from 'memoizerific';
 
 import { Combo, Consumer } from '@storybook/api';
-import { Global } from '@storybook/theming';
+import { Global, Theme } from '@storybook/theming';
 
 import { Icons, IconButton, WithTooltip, TooltipLinkList } from '@storybook/components';
 
@@ -123,11 +123,14 @@ export class BackgroundSelector extends Component<{}, State> {
             <Fragment>
               {selectedBackgroundColor ? (
                 <Global
-                  styles={{
+                  styles={(theme: Theme) => ({
                     [`#${iframeId}`]: {
-                      background: selectedBackgroundColor,
+                      background:
+                        selectedBackgroundColor === 'transparent'
+                          ? theme.background.content
+                          : selectedBackgroundColor,
                     },
-                  }}
+                  })}
                 />
               ) : null}
               <WithTooltip