Merge pull request #31 from raferdev/development

Version 2.0

Author: raferdev

.changeset/curly-berries-play.md

@@ -4,8 +4,8 @@ concurrency:
   cancel-in-progress: true
 
 on:
-  push:
-    branches: [main]
+  release:
+    types: [published]
 jobs:
   build:
     name: Build

.github/workflows/deploy.yml

@@ -2,12 +2,22 @@ import { create } from '@storybook/theming/create'
 
 import imageLogo from '../public/logo-dark-theme.png'
 
-export default create({
-  base: 'dark',
+const raferdevTheme = create({
+  base: 'light',
   brandTitle: 'Raferdev Storybook',
   brandUrl: 'https://storybook.rafer.dev',
   brandImage: imageLogo.toString(),
   brandTarget: '_self',
 
+  appBg: '#9ccfff',
+  appContentBg: '#f5f4df',
+  appBorderColor: '#a7a7a7',
+  appBorderRadius: 4,
+
+  barBg: '#2585b8',
+  barTextColor: '#fff',
+
   fontBase: 'var(--font-sans)',
 })
+
+export default raferdevTheme

.storybook/components/raferdevTheme.ts

@@ -36,6 +36,7 @@ const config: StorybookConfig = {
         ],
       },
     },
+    '@storybook/addon-mdx-gfm',
   ],
 
   previewHead: (head) => `

.storybook/main.ts

@@ -14,11 +14,15 @@ const preview: Preview = {
       },
     },
     backgrounds: {
-      default: 'default',
+      default: 'dark',
       values: [
         {
-          name: 'default',
-          value: '#fff',
+          name: 'light',
+          value: `#e9e9f2`,
+        },
+        {
+          name: 'dark',
+          value: `#2d2d30`,
         },
       ],
     },

.storybook/preview.ts

@@ -3,5 +3,10 @@
 }
 
 #storybook-docs > .sbdocs.sbdocs-wrapper.css-k7lbue {
-  background-color: transparent !important;
+  background: rgb(44, 152, 209);
+  background: linear-gradient(
+    180deg,
+    rgba(44, 152, 209, 1) 0%,
+    rgba(255, 255, 255, 1) 96%
+  );
 }