Move metadata content and fix Storybook styles

chromaui · Oct 12, 2023 · 1e9f59d · 1e9f59d
1 parent c7b8e1d
commit 1e9f59d
Show file tree

Hide file tree

Showing 5 changed files with 14 additions and 7 deletions.
diff --git a/.storybook/preview.js b/.storybook/preview.js
@@ -17,7 +17,7 @@ ansiHTML.setColors({
 chalk.enabled = true;
 chalk.level = 3;
 
-const style = {
+const codeStyle = {
   display: 'inline-block',
   margin: 0,
   padding: '1rem',
@@ -28,6 +28,14 @@ const style = {
   color: '#c0c4cd',
 };
 
+const htmlStyle = {
+  fontFamily: "'Nunito Sans', sans-serif",
+  fontSize: 14,
+  lineHeight: '1',
+  color: '#5C6870',
+  margin: 20,
+};
+
 export const parameters = {
   layout: 'fullscreen',
 };
@@ -36,11 +44,11 @@ export const decorators = [
   (storyFn, { kind }) => {
     if (kind.startsWith('CLI/')) {
       document.body.style.backgroundColor = '#16242c';
-      return <code style={style} dangerouslySetInnerHTML={{ __html: ansiHTML(storyFn()) }} />;
+      return <code style={codeStyle} dangerouslySetInnerHTML={{ __html: ansiHTML(storyFn()) }} />;
     }
     if (kind.startsWith('HTML/')) {
-      document.body.style.backgroundColor = '#ffffff';
-      return <div style={{ padding: '1em' }} dangerouslySetInnerHTML={{ __html: storyFn() }} />;
+      document.body.style.backgroundColor = '#F6F9FC';
+      return <div style={htmlStyle} dangerouslySetInnerHTML={{ __html: storyFn() }} />;
     }
     document.body.style.backgroundColor = 'paleturquoise';
     return storyFn();

diff --git a/node-src/lib/uploadMetadataFiles.ts b/node-src/lib/uploadMetadataFiles.ts
@@ -4,7 +4,7 @@ import { withFile } from 'tmp-promise';
 
 import { STORYBOOK_BUILD_LOG_FILE } from '../tasks/build';
 import { Context, FileDesc } from '../types';
-import getMetadataHtml from '../ui/content/metadata.html';
+import getMetadataHtml from '../ui/html/metadata.html';
 import { findStorybookConfigFile } from './getStorybookMetadata';
 import { CHROMATIC_LOG_FILE } from './log';
 import { uploadAsIndividualFiles } from './upload';

diff --git a/node-src/ui/content/metadata.html.stories.ts → node-src/ui/html/metadata.html.stories.ts b/node-src/ui/content/metadata.html.stories.ts → node-src/ui/html/metadata.html.stories.ts
diff --git a/node-src/ui/content/metadata.html.ts → node-src/ui/html/metadata.html.ts b/node-src/ui/content/metadata.html.ts → node-src/ui/html/metadata.html.ts
@@ -11,7 +11,6 @@ export default ({ announcedBuild, build }: Context, files: FileDesc[]) => `<!DOC
     <title>Build ${announcedBuild.number} metadata files</title>
     <style>
       body {
-        -webkit-font-smoothing: antialiased;
         font-family: 'Nunito Sans', sans-serif;
         font-size: 14px;
         line-height: 1;

diff --git a/node-src/ui/messages/info/uploadingMetadata.stories.ts b/node-src/ui/messages/info/uploadingMetadata.stories.ts
@@ -1,4 +1,4 @@
-import { files } from '../../content/metadata.html.stories';
+import { files } from '../../html/metadata.html.stories';
 import uploadingMetadata from './uploadingMetadata';
 
 export default {