diff --git a/lib/core/src/client/preview/NoDocs.js b/lib/core/src/client/preview/NoDocs.js
index a27287c17a91..9394b8b4e4d1 100644
--- a/lib/core/src/client/preview/NoDocs.js
+++ b/lib/core/src/client/preview/NoDocs.js
@@ -1,27 +1,26 @@
 import React from 'react';
-import { styled } from '@storybook/theming';
 
-const Wrapper = styled.div({
+const wrapper = {
   fontSize: '14px',
   letterSpacing: '0.2px',
   margin: '10px 0',
-});
+};
 
-const Main = styled.div({
+const main = {
   margin: 'auto',
   padding: '30px',
   borderRadius: '10px',
   background: 'rgba(0,0,0,0.03)',
-});
+};
 
-const Heading = styled.h1({
+const heading = {
   textAlign: 'center',
-});
+};
 
 export const NoDocs = () => (
-  <Wrapper className="sb-nodocs sb-wrapper">
-    <Main>
-      <Heading>No Docs</Heading>
+  <div style={wrapper} className="sb-nodocs sb-wrapper">
+    <div style={main}>
+      <h1 style={heading}>No Docs</h1>
       <p>
         Sorry, but there are no docs for the selected story. To add them, set the story's&nbsp;
         <code>docs</code> parameter. If you think this is an error:
@@ -35,6 +34,6 @@ export const NoDocs = () => (
         If the problem persists, check the browser console, or the terminal you've run Storybook
         from.
       </p>
-    </Main>
-  </Wrapper>
+    </div>
+  </div>
 );