mirror of
https://github.com/grafana/grafana.git
synced 2024-12-28 01:41:24 -06:00
d282b7a6f8
* moved themecontext to data * chore(grafana-ui): re-export ThemeContext from grafana/data for backwards compatibility * Moved icon bundling to core. * feat(plugins): share react-inlinesvg with plugins for grafana/ui bundling * chore(codeowners): add generate-icon-bundle.js to file * chore(storybook): update path to iconBundle file for theme * feat(plugins): share i18n dependency via systemjs * Make sure that icon bundle is initialized for tests. * Removed comment. * added tests for icon root. * Removing the need of having an init variable. * feat(grafana-ui): add icon svgs to bundle for projects that don't rely on grafana --------- Co-authored-by: Marcus Andersson <marcus.andersson@grafana.com>
47 lines
1.5 KiB
TypeScript
47 lines
1.5 KiB
TypeScript
import { GrafanaTheme2, createTheme } from '@grafana/data';
|
|
//@ts-ignore
|
|
import { create } from '@storybook/theming';
|
|
import '../../../public/app/core/icons/iconBundle';
|
|
|
|
const createStorybookTheme = (theme: GrafanaTheme2) => {
|
|
return create({
|
|
base: theme.colors.mode,
|
|
colorPrimary: theme.colors.primary.main,
|
|
colorSecondary: theme.colors.error.main,
|
|
|
|
// UI
|
|
appBg: theme.colors.background.canvas,
|
|
appContentBg: theme.colors.background.primary,
|
|
appBorderColor: theme.colors.border.medium,
|
|
appBorderRadius: 0,
|
|
|
|
// Typography
|
|
fontBase: theme.typography.fontFamily,
|
|
fontCode: theme.typography.fontFamilyMonospace,
|
|
|
|
// Text colors
|
|
textColor: theme.colors.text.primary,
|
|
textInverseColor: theme.colors.background.primary,
|
|
|
|
// Toolbar default and active colors
|
|
barTextColor: theme.colors.text.primary,
|
|
barSelectedColor: theme.colors.emphasize(theme.colors.primary.text),
|
|
barBg: theme.colors.background.primary,
|
|
|
|
// Form colors
|
|
inputBg: theme.components.input.background,
|
|
inputBorder: theme.components.input.borderColor,
|
|
inputTextColor: theme.components.input.text,
|
|
inputBorderRadius: parseInt(theme.shape.borderRadius(1), 10),
|
|
|
|
brandTitle: 'Grafana UI',
|
|
brandUrl: './',
|
|
brandImage: `public/img/grafana_text_logo-${theme.colors.mode}.svg`,
|
|
});
|
|
};
|
|
|
|
const GrafanaLight = createStorybookTheme(createTheme({ colors: { mode: 'light' } }));
|
|
const GrafanaDark = createStorybookTheme(createTheme({ colors: { mode: 'dark' } }));
|
|
|
|
export { GrafanaLight, GrafanaDark };
|