|
| 1 | +const titleize = require('titleize'); |
| 2 | + |
| 3 | +const cleanTitleize = str => titleize(str.replace(/(_|-)/g, ' ')); |
| 4 | + |
1 | 5 | module.exports = { |
2 | 6 | // Components |
3 | 7 | components: { |
4 | | - globPattern: 'src/components/**/*.html', // source components to process |
5 | | - forNavPath: 'tmp/componentsForNav.json', // temporary file built by the index |
6 | | - indexPath: 'components/index.html', // target location of components index |
7 | | - buildPages: true, // false to skip building pages |
8 | | - buildScreenshots: true, // false to skip building screenshots |
9 | | - frontMatter: { // font matter defaults (i.e. optional) |
10 | | - name: undefined, // undefined to infer component name |
11 | | - title: undefined, // undefined to infer component title |
12 | | - bodyClass: 'bg-white', // class to apply on <body> |
13 | | - screenshot: { // per-component screenshot options |
14 | | - selector: '[data-name="component"]', // DOM element to capture |
15 | | - autocrop: true, // autocrop the capture |
16 | | - 'background-position': 'center center', // CSS background position |
17 | | - 'background-size': 'cover', // CSS background size ('cover', 'contain', 'auto') |
| 8 | + globPattern: 'src/components/**/*.html', // source components to process |
| 9 | + indexByCategory: { |
| 10 | + path: 'components/index.html', // target location of index by category |
| 11 | + json: 'tmp/componentsByCategory.json', // temporary JSON file built by the index |
| 12 | + }, |
| 13 | + build: { |
| 14 | + pages: true, // false to skip building pages |
| 15 | + screenshots: true, // false to skip building screenshots |
| 16 | + }, |
| 17 | + prettify: { |
| 18 | + id: cleanTitleize, // prettify component id into component name |
| 19 | + category: cleanTitleize, // prettify component category |
| 20 | + title: (category, name) => `${category} | ${name}`, // compose title from category and name |
| 21 | + }, |
| 22 | + frontMatter: { // font matter defaults (i.e. optional) |
| 23 | + name: undefined, // undefined to infer component name |
| 24 | + title: undefined, // undefined to infer component title |
| 25 | + category: undefined, // undefined to infer component category |
| 26 | + bodyClass: 'bg-white', // class to apply on <body> |
| 27 | + screenshot: { // per-component screenshot options |
| 28 | + selector: '[data-name="component"]', // DOM element to capture |
| 29 | + autocrop: true, // autocrop the capture |
| 30 | + 'background-position': 'center center', // CSS bg position |
| 31 | + 'background-size': 'cover', // CSS bg size ('cover', 'contain', 'auto') |
18 | 32 | }, |
19 | 33 | }, |
20 | 34 | }, |
21 | 35 | // Screenshot options |
22 | 36 | // (components only for now, but could apply to other areas for consistency) |
23 | 37 | screenshot: { |
24 | | - basename: 'screenshot.jpg', // name of *JPEG* screenshot |
25 | | - aspectRatio: '4x3', // Tachyons aspect ratio of screenshots |
26 | | - viewportWidth: 1024, // viewport width used for capture |
27 | | - viewportHeight: 768, // viewport height used for capture |
28 | | - targetMinWidth: 400, // min width of target (final) screenshot |
29 | | - targetMinHeight: 160, // min height of target (final) screenshot |
30 | | - mozjpegQuality: 90, // mozjpeg optimizer quality (default 75) |
| 38 | + basename: 'screenshot.jpg', // name of *JPEG* screenshot |
| 39 | + aspectRatio: '4x3', // Tachyons aspect ratio of screenshots |
| 40 | + viewport: { |
| 41 | + width: 1024, // viewport width used for capture |
| 42 | + height: 768, // viewport height used for capture |
| 43 | + }, |
| 44 | + target: { |
| 45 | + minWidth: 400, // min width of target (final) screenshot |
| 46 | + minHeight: 160, // min height of target (final) screenshot |
| 47 | + }, |
| 48 | + mozjpegQuality: 90, // mozjpeg optimizer quality (default 75) |
31 | 49 | }, |
32 | 50 | // Misc |
33 | 51 | tachyonsCssPath: 'src/css/tachyons.css', |
|
0 commit comments