diff --git a/.changeset/curvy-zoos-stare.md b/.changeset/curvy-zoos-stare.md new file mode 100644 index 00000000..9d1b8b60 --- /dev/null +++ b/.changeset/curvy-zoos-stare.md @@ -0,0 +1,5 @@ +--- +'@smile/haring-react': minor +--- + +make corrections to color contrasts diff --git a/packages/haring-react/src/Components/CardHeader/CardHeader.stories.tsx b/packages/haring-react/src/Components/CardHeader/CardHeader.stories.tsx index cdbda636..06d3f6c9 100644 --- a/packages/haring-react/src/Components/CardHeader/CardHeader.stories.tsx +++ b/packages/haring-react/src/Components/CardHeader/CardHeader.stories.tsx @@ -27,7 +27,7 @@ const meta = { - + With Fjord Tours you can explore more of the magical fjord landscapes with tours and activities on and around the fjords of Norway diff --git a/packages/haring-react/src/Components/DataBadge/DataBadge.stories.tsx b/packages/haring-react/src/Components/DataBadge/DataBadge.stories.tsx index 12c10745..a9745c02 100644 --- a/packages/haring-react/src/Components/DataBadge/DataBadge.stories.tsx +++ b/packages/haring-react/src/Components/DataBadge/DataBadge.stories.tsx @@ -1,11 +1,15 @@ import type { Meta, StoryObj } from '@storybook/react'; +import { DEFAULT_THEME } from '@mantine/core'; + import { DataBadge as Cmp } from './DataBadge'; +const colorOptions = Object.keys(DEFAULT_THEME.colors); const meta = { argTypes: { color: { - control: { type: 'color' }, + control: 'select', + options: colorOptions, }, }, component: Cmp, diff --git a/packages/haring-react/src/Components/Header/Header.stories.tsx b/packages/haring-react/src/Components/Header/Header.stories.tsx index 54aeaeb1..16e324a4 100644 --- a/packages/haring-react/src/Components/Header/Header.stories.tsx +++ b/packages/haring-react/src/Components/Header/Header.stories.tsx @@ -52,6 +52,13 @@ const meta = { export default meta; type IStory = StoryObj; +const customPrimaryTheme = { + ...primaryTheme, + colors: { + dark: ['#1E0303'], + ...primaryTheme.colors, + }, +}; export const Header: IStory = { args: { @@ -66,7 +73,7 @@ export const Header: IStory = { }, onSearchSubmit: action('search input submitted'), right: rightContentMock, - searchTheme: primaryTheme, + searchTheme: customPrimaryTheme, searchValue: '', withBorder: false, },