grafana/packages/grafana-ui/.storybook/storybookTheme.ts
Torkel Ödegaard 53630b5f13
StatPanels: Refactoring DisplayValueOptions and renaming & adding new panel options to react panels (#23153)
* StatPanels: Refactoring DisplayValueOptions and renaming

* added return

* Progress

* Updated

* Made radio groups full width by default in panel options

* Fixed ts issue

* Updated

* Added remaining options

* Removed unused type

* Updated snapshot

* Renamed to ReduceDataOptions
2020-03-28 23:11:50 +01:00

50 lines
1.4 KiB
TypeScript

//@ts-ignore
import { create } from '@storybook/theming/create';
import lightTheme from '../src/themes/light';
import darkTheme from '../src/themes/dark';
import ThemeCommons from '../src/themes/default';
import { GrafanaTheme } from '@grafana/data';
const createTheme = (theme: GrafanaTheme) => {
return create({
base: theme.name.includes('Light') ? 'light' : 'dark',
colorPrimary: theme.colors.brandPrimary,
colorSecondary: theme.colors.brandPrimary,
// UI
appBg: theme.colors.pageBg,
appContentBg: theme.colors.pageBg,
appBorderColor: theme.colors.pageHeaderBorder,
appBorderRadius: 4,
// Typography
fontBase: ThemeCommons.typography.fontFamily.sansSerif,
fontCode: ThemeCommons.typography.fontFamily.monospace,
// Text colors
textColor: theme.colors.text,
textInverseColor: 'rgba(255,255,255,0.9)',
// Toolbar default and active colors
barTextColor: theme.colors.formInputBorderActive,
barSelectedColor: theme.colors.brandPrimary,
barBg: theme.colors.pageBg,
// Form colors
inputBg: theme.colors.formInputBg,
inputBorder: theme.colors.formInputBorder,
inputTextColor: theme.colors.formInputText,
inputBorderRadius: 4,
brandTitle: 'Grafana UI',
brandUrl: './',
brandImage: './grafana_icon.svg',
});
};
const GrafanaLight = createTheme(lightTheme);
const GrafanaDark = createTheme(darkTheme);
export { GrafanaLight, GrafanaDark };