fix storybook typography display

.storybook/preview.js

@@ -7,6 +7,7 @@ import {
 } from '@reach/router'
 
 // Import global css with custom properties once for all stories.
+import '@oceanprotocol/typographies/css/ocean-typo.css'
 import '../src/global/styles.css'
 
 // Wrapper for all stories previews

src/components/organisms/AssetActions/Compute.stories.tsx

@@ -6,7 +6,7 @@ import squidMock from '../../../../tests/unit/__mocks__/@oceanprotocol/squid'
 import { context } from '../../../../tests/unit/__mocks__/web3provider'
 
 export default {
-  title: 'Organisms/Consume',
+  title: 'Organisms/Compute',
   decorators: [
     (storyFn: () => React.FC): ReactElement => (
       <div style={{ maxWidth: '40rem', margin: 'auto' }}>{storyFn()}</div>

src/global/Typography.stories.tsx

@@ -7,10 +7,11 @@ export default {
 export const Body = () => (
   <div style={{ maxWidth: '600px' }}>
     <p>
-      Montserrat 400 Ummm…to eBay? Oh sure! <a href="">Blame the wizards!</a>{' '}
-      Hello, little man. <strong>I will destroy you!</strong> I’ve been there.
-      My folks were always on me to groom myself and <em>wear underpants</em>.
-      What am I, the pope? Leela’s gonna kill me.
+      Sharp Sans Medium. Ummm…to eBay? Oh sure!{' '}
+      <a href="">Blame the wizards!</a> Hello, little man.{' '}
+      <strong>I will destroy you!</strong> I’ve been there. My folks were always
+      on me to groom myself and <em>wear underpants</em>. What am I, the pope?
+      Leela’s gonna kill me.
     </p>
     <p>
       Yes, I saw. You were doing well, until everyone died. Check it out, y’all.
@@ -22,7 +23,7 @@ export const Body = () => (
 
 export const Headings = () => (
   <>
-    <h1>Montserrat 600</h1>
+    <h1>Sharp Sans Display No.1 Bold</h1>
     <h1>Heading 1</h1>
     <h2>Heading 2</h2>
     <h3>Heading 3</h3>