From 4ed92b760d7ca81d2b1cd292ad5ac204eca1509f Mon Sep 17 00:00:00 2001 From: Stephen Belovarich Date: Fri, 1 Nov 2024 12:03:56 -0700 Subject: [PATCH] feat: branding --- .storybook/manager.ts | 16 +++++++++ .storybook/preview.ts | 4 +++ .storybook/sw-inline-logo-color.svg | 55 +++++++++++++++++++++++++++++ 3 files changed, 75 insertions(+) create mode 100644 .storybook/manager.ts create mode 100644 .storybook/sw-inline-logo-color.svg diff --git a/.storybook/manager.ts b/.storybook/manager.ts new file mode 100644 index 00000000..749dbd4e --- /dev/null +++ b/.storybook/manager.ts @@ -0,0 +1,16 @@ +import { addons } from '@storybook/manager-api'; +import { create } from '@storybook/theming'; + +import logo from './sw-inline-logo-color.svg'; + +const theme = create({ + base: 'light', // or 'dark' + brandTitle: 'ngx-graph', + brandUrl: 'https://swimlane.github.io/ngx-graph', + brandImage: logo, + brandTarget: '_self' // Optional, specifies where to open the link +}); + +addons.setConfig({ + theme +}); diff --git a/.storybook/preview.ts b/.storybook/preview.ts index 9658f062..fec6ba50 100644 --- a/.storybook/preview.ts +++ b/.storybook/preview.ts @@ -1,10 +1,14 @@ import type { Preview } from '@storybook/angular'; +import { themes } from '@storybook/theming'; import { setCompodocJson } from '@storybook/addon-docs/angular'; import docJson from '../documentation.json'; setCompodocJson(docJson); const preview: Preview = { parameters: { + docs: { + theme: themes.light + }, controls: { matchers: { color: /(background|color)$/i, diff --git a/.storybook/sw-inline-logo-color.svg b/.storybook/sw-inline-logo-color.svg new file mode 100644 index 00000000..b49151f3 --- /dev/null +++ b/.storybook/sw-inline-logo-color.svg @@ -0,0 +1,55 @@ + + + sw-inline-logo-color + Created using Figma + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +