react-components/styleguide.config.js at master · PakistanJs/react-components · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
const path = require('path');
const loaders = require('loaders');

module.exports = {
	title: 'PakistanJS React Components',
	components: './src/components/[A-Z]*',
	theme: {
		baseBackground: '#fdfdfc',
		link: '#274e75',
		linkHover: '#90a7bf',
		border: '#e0d2de',
		font: ['Raleway', 'sans-serif'],
	},
	styles: {
		SectionHeading: {
			heading: {
				fontSize: '36px',
				fontWeight: '400',
				fontFamily: '"Raleway", sans-serif'
			},
			pathLine: {
				fontSize: '12px'
			}
		},
		TabButton: {
			button: {
				textTransform: 'capitalize',
				fontFamily: '"Raleway", sans-serif'
			}
		},
		Playground: {
			root: {
				borderRadius: 0,
				borderWidth: [[0, 0, 1, 0]],
			},
			codeToggle: {
				marginTop: 1,
				border: 0,
			},
			hideCode: {
				background: 'none',
			},
		},
		Markdown: {
			para: {
				color: '#555',
				fontSize: '14px',
				fontFamily: '"Raleway", sans-serif',
			},
			pre: {
				border: 0,
				background: 'none',
			},
			code: {
				fontSize: 14,
			},
		},
	},
	template: './src/styleguide/index.html',
	getComponentPathLine(componentPath) {
		const name = path.basename(componentPath, '.js');
		return `import { ${name} } from 'components/pkjs-react-components';`;
	},
	webpackConfig: Object.assign({},
		require('./webpack.config.js'),
		{
			resolve: {
				alias: {
					// Override Styleguidist components
					'rsg-components/Wrapper': path.join(__dirname, 'src/styleguide/components/Wrapper'),
					'rsg-components/Logo': path.join(__dirname, 'src/styleguide/components/Logo'),
					'rsg-components/StyleGuide/StyleGuideRenderer': path.join(
						__dirname,
						'src/styleguide/components/StyleGuide'
					),
				},
			},
			module: {
				loaders: [
					loaders.babel,
					{ test: /\.(jpg|png)$/, loader: 'url-loader' },
					{
						test: /\.css$/,
						loader: 'style-loader!css-loader?modules',
					},
				],
			},
		}
	)
};