@mskcc/theme-antd

Ant Design Theme Package

Custom theme configuration for Ant Design components.

Installation

npm install @mskcc/theme-antd @mskc/tokens

Usage

import { ConfigProvider } from 'antd';
import { getDsmTheme } from '@mskcc/theme-antd';

// Configure theme
const theme = getDsmAntdTheme(); // optional: 'light' or 'dark' or leave blank for default
// Use with ConfigProvider
<ConfigProvider theme={theme, 'consumer'}>
  <App />
</ConfigProvider>;

/* Main css file */
@import '@mskcc/tokens/css/consumer.css';
@import '@mskcc/theme-antd/dist/styles/theme.css';

References

Theme Functions

Function	Description	Property	type	default
getDsmTheme(role, theme)	CSS variables version of DSM theme	role	'consumer' or 'pro'	'consumer'
		theme	'light' or 'dark'	'light'
getDsmThemeComponent(role, theme)	CSS-in-JS version of DSM theme	role	'consumer' or 'pro'	'consumer'
		theme	'light' or 'dark'	'light'

Stylesheets

Import	Description
@import '@mskcc/theme-antd/dist/styles/theme.css'	Main theme stylesheet to be paired with @mskcc/tokens