diff --git a/packages/components/src/DraftConfigurator/index.js b/packages/components/src/DraftConfigurator/index.js
index 66238eebda6..5e2fc1c79f0 100644
--- a/packages/components/src/DraftConfigurator/index.js
+++ b/packages/components/src/DraftConfigurator/index.js
@@ -1,52 +1,52 @@
-import React, { useState } from "react";
-import PropTypes from "prop-types";
-import { FormattedMessage } from "react-intl";
-import PatternOptions from "./PatternOptions";
-import DraftSettings from "./DraftSettings";
+import React, { useState } from 'react'
+import PropTypes from 'prop-types'
+import { FormattedMessage } from 'react-intl'
+import PatternOptions from './PatternOptions'
+import DraftSettings from './DraftSettings'
 
 const DraftConfigurator = props => {
-  const [expanded, setExpanded] = useState([]);
+  const [expanded, setExpanded] = useState([])
 
   return (
     <ul className="config l1">
       <li>
-        <FormattedMessage id="app.patternOptions" />
+        <span>
+          <FormattedMessage id="app.patternOptions" />
+        </span>
         <PatternOptions
           noDocs={props.noDocs}
           config={props.config}
           gist={props.gist}
           recipe={props.recipe}
-          updateValue={(name, value) =>
-            props.updateGist(value, "settings", "options", name)
-          }
+          updateValue={(name, value) => props.updateGist(value, 'settings', 'options', name)}
           raiseEvent={props.raiseEvent}
           units={props.units}
         />
       </li>
       <li>
-        <FormattedMessage id="app.draftSettings" />
+        <span>
+          <FormattedMessage id="app.draftSettings" />
+        </span>
         <DraftSettings
           noDocs={props.noDocs}
           config={props.config}
           gist={props.gist}
           recipe={props.recipe}
-          updateValue={(name, value) =>
-            props.updateGist(value, "settings", name)
-          }
+          updateValue={(name, value) => props.updateGist(value, 'settings', name)}
           raiseEvent={props.raiseEvent}
           units={props.units}
         />
       </li>
     </ul>
-  );
-};
+  )
+}
 
 DraftConfigurator.propTypes = {
-  units: PropTypes.oneOf(["metric", "imperial"]).isRequired
-};
+  units: PropTypes.oneOf(['metric', 'imperial']).isRequired
+}
 
 DraftConfigurator.defaultProps = {
   noDocs: false
-};
+}
 
-export default DraftConfigurator;
+export default DraftConfigurator