Skip to content

Commit 14b4270

Browse files
sindresorhussindresorhus
committed
Clean up
1 parent 724185a commit 14b4270

4 files changed

Lines changed: 108 additions & 115 deletions

File tree

‎.github/workflows/main.yml‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,8 +13,8 @@ jobs:
1313
- 16
1414
- 14
1515
steps:
16-
- uses: actions/checkout@v2
17-
- uses: actions/setup-node@v2
16+
- uses: actions/checkout@v3
17+
- uses: actions/setup-node@v3
1818
with:
1919
node-version: ${{ matrix.node-version }}
2020
- run: npm install

‎cli.js‎

Lines changed: 44 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -9,21 +9,21 @@ const cli = meow(
99
github-markdown-css > <filename>
1010
1111
Options
12-
--list List available themes
12+
--list List available themes
1313
1414
Set theme:
15-
-l, --light Light theme name from --list values
16-
-d, --dark Dark theme name from --list values
17-
-t, --type, --theme Theme name: 'auto', light', 'dark', or another from --list values.
18-
'auto' means using the media query (prefers-color-scheme)
19-
to switch between the 'light' and 'dark' theme.
15+
--light Light theme name from --list values
16+
--dark Dark theme name from --list values
17+
--theme Theme name: 'auto', light', 'dark', or another from --list values.
18+
'auto' means using the media query (prefers-color-scheme)
19+
to switch between the 'light' and 'dark' theme.
2020
2121
Output options:
22-
--preserveVars Preserve variables in the output. Only applies if light
23-
and dark themes match or if type is not 'auto'
24-
--onlyStyle Only output the styles, forces preserveVars on
25-
--onlyVars Only output the variables for the specified themes
26-
--rootSelector Specify the root selector when outputting styles, default '.markdown-body'
22+
--preserve-variables Preserve variables in the output. Only applies if light
23+
and dark themes match or if type is not 'auto'
24+
--only-style Only output the styles, forces --preserve-variables on
25+
--only-variables Only output the variables for the specified themes
26+
--rootSelector Specify the root selector when outputting styles, default '.markdown-body'
2727
2828
Examples
2929
$ github-markdown-css --list
@@ -37,26 +37,24 @@ const cli = meow(
3737
$ github-markdown-css --light=light --dark=dark
3838
[CSS with variable blocks for 'light' and 'dark' themes]
3939
40-
$ github-markdown-css --theme=dark_dimmed --onlyVars
40+
$ github-markdown-css --theme=dark_dimmed --only-variables
4141
[CSS with single variable block for 'dark_dimmed' theme with no element styles]
4242
4343
$ github-markdown-css --onlyStyles
4444
[CSS with only element styles using variables but no variables set.
45-
Use in combination with output from setting --onlyVars]
45+
Use in combination with output from setting --only-variables]
4646
`,
4747
{
4848
importMeta: import.meta,
4949
flags: {
5050
theme: {
51-
alias: ['t', 'type'],
5251
type: 'string',
52+
alias: ['type'],
5353
},
5454
light: {
55-
alias: 'l',
5655
type: 'string',
5756
},
5857
dark: {
59-
alias: 'd',
6058
type: 'string',
6159
},
6260
list: {
@@ -65,10 +63,10 @@ const cli = meow(
6563
onlyStyle: {
6664
type: 'boolean',
6765
},
68-
onlyVars: {
66+
onlyVariables: {
6967
type: 'boolean',
7068
},
71-
preserveVars: {
69+
preserveVariables: {
7270
type: 'boolean',
7371
},
7472
rootSelector: {
@@ -79,27 +77,35 @@ const cli = meow(
7977
);
8078

8179
(async () => {
82-
const {theme, list, preserveVars, onlyStyle, onlyVars, rootSelector} = cli.flags;
80+
const {
81+
theme,
82+
list,
83+
preserveVariables,
84+
onlyStyle,
85+
onlyVariables,
86+
rootSelector,
87+
} = cli.flags;
88+
8389
let {light, dark} = cli.flags;
8490

8591
/*
86-
* | Theme | Light | Dark | Outcome |
87-
* | ----- | ----- | ---- | ---------------------------------- |
88-
* | ✓ | | | Single mode, use Theme |
89-
* | ✓ | ✓ | | Not allowed, can't determine theme |
90-
* | ✓ | | ✓ | Not allowed, can't determine theme |
91-
* | ✓ | ✓ | ✓ | Not allowed, can't determine theme |
92-
* | | | | Auto, default themes |
93-
* | | ✓ | | Single mode, use Light |
94-
* | | | ✓ | Single mode, use Dark |
95-
* | | ✓ | ✓ | Auto, use Light and Dark |
96-
* | | ✓ | ✓ | Single mode if Light === Dark |
97-
* | auto | | | Auto, default themes |
98-
* | auto | ✓ | | Auto, use Light, default dark |
99-
* | auto | | ✓ | Auto, use Dark, default light |
100-
* | auto | ✓ | ✓ | Auto, use Light and Dark |
101-
* | auto | ✓ | ✓ | Single mode if Light === Dark |
102-
*/
92+
| Theme | Light | Dark | Outcome |
93+
| ----- | ----- | ---- | ---------------------------------- |
94+
| ✓ | | | Single mode, use Theme |
95+
| ✓ | ✓ | | Not allowed, can't determine theme |
96+
| ✓ | | ✓ | Not allowed, can't determine theme |
97+
| ✓ | ✓ | ✓ | Not allowed, can't determine theme |
98+
| | | | Auto, default themes |
99+
| | ✓ | | Single mode, use Light |
100+
| | | ✓ | Single mode, use Dark |
101+
| | ✓ | ✓ | Auto, use Light and Dark |
102+
| | ✓ | ✓ | Single mode if Light === Dark |
103+
| auto | | | Auto, default themes |
104+
| auto | ✓ | | Auto, use Light, default dark |
105+
| auto | | ✓ | Auto, use Dark, default light |
106+
| auto | ✓ | ✓ | Auto, use Light and Dark |
107+
| auto | ✓ | ✓ | Single mode if Light === Dark |
108+
*/
103109

104110
// Use "single" mode when type is a theme name other than 'auto'
105111
if (theme && theme !== 'auto') {
@@ -129,9 +135,9 @@ const cli = meow(
129135
light,
130136
dark,
131137
list,
132-
preserveVariables: preserveVars,
138+
preserveVariables,
133139
onlyStyles: onlyStyle,
134-
onlyVariables: onlyVars,
140+
onlyVariables,
135141
rootSelector,
136142
}),
137143
);

‎index.js‎

Lines changed: 18 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -284,30 +284,24 @@ function applyColors(colors, rules) {
284284
}
285285

286286
/**
287-
* Extract markdown styles from github.com
288-
*
289-
* If the `light` and `dark` themes are different the CSS returned will include
290-
* `prefers-color-scheme` blocks for light and dark that match the specified
291-
* `light` and `dark` themes (considered "auto" mode). This mode will always
292-
* `preserveVars` as they are necessary for the `prefers-color-scheme` blocks
293-
*
294-
* If the `light` and `dark` themes are equal the output will only contain one
295-
* theme (considered "single" mode)
296-
*
297-
* In "single" mode the output will apply the values of all variables to the
298-
* rules themselves.The output will not contain any `var(--variable)` statements.
299-
* You can disable this by setting `preserveVariables` to true
300-
*
301-
* @param {Object} options optional options object
302-
* @param {string} [options.light=light] The theme to use for light theme
303-
* @param {string} [options.dark=dark] The theme to use for dark theme
304-
* @param {boolean} [options.list=false] If `true` will return a list of available themes instead of the CSS
305-
* @param {boolean} [options.preserveVariables=false] If `true` will preserve the block of variables for a given theme even if only exporting one theme. By default variables are applied to the rules themselves and the resulting CSS will not contain any `var(--variable)`
306-
* @param {boolean} [options.onlyVariables=false] Only output the color variables part of the css. forces `preserveVariables` to be `true`
307-
* @param {boolean} [options.onlyStyles=false] Only output the style part of the css without any variables. forces `preserveVariables` to be `true` and ignores the theme values. Useful to get the base styles to use multiple themes
308-
* @param {string} [options.rootSelector=.markdown-body] Set the root selector of the rendered markdown body as it should appear in the output css. Defaults to `.markdown-body`
309-
*/
310-
async function getCSS({
287+
Extract markdown styles from github.com
288+
289+
If the `light` and `dark` themes are different, the returned CSS will include `prefers-color-scheme` blocks for light and dark that match the specified `light` and `dark` themes (considered "auto" mode). This mode will always `preserveVariables` as they are necessary for the `prefers-color-scheme` blocks
290+
291+
If the `light` and `dark` themes are equal, the output will only contain one theme (considered "single" mode).
292+
293+
In "single" mode, the output will apply the values of all variables to the rules themselves. The output will not contain any `var(--variable)` statements. You can disable this by setting `preserveVariables` to `true`.
294+
295+
@param {Object} options - Optional options object.
296+
@param {string} [options.light=light] - The theme to use for light theme.
297+
@param {string} [options.dark=dark] - The theme to use for dark theme.
298+
@param {boolean} [options.list=false] - If `true`, will return a list of available themes instead of the CSS.
299+
@param {boolean} [options.preserveVariables=false] - If `true`, will preserve the block of variables for a given theme even if only exporting one theme. By default, variables are applied to the rules themselves and the resulting CSS will not contain any `var(--variable)`.
300+
@param {boolean} [options.onlyVariables=false] - Only output the color variables part of the CSS. Forces `preserveVariables` to be `true`.
301+
@param {boolean} [options.onlyStyles=false] - Only output the style part of the CSS without any variables. Forces `preserveVariables` to be `true` and ignores the theme values. Useful to get the base styles to use multiple themes.
302+
@param {string} [options.rootSelector=.markdown-body] - Set the root selector of the rendered Markdown body as it should appear in the output CSS. Defaults to `.markdown-body`.
303+
*/
304+
export default async function getCSS({
311305
light = 'light',
312306
dark = 'dark',
313307
list = false,
@@ -456,5 +450,3 @@ async function getCSS({
456450

457451
return string;
458452
}
459-
460-
export default getCSS;

‎readme.md‎

Lines changed: 44 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -13,51 +13,46 @@ First the GitHub.com CSS is fetched. Then we walk through all rules that could t
1313
## API
1414

1515
```js
16-
import githubMarkdownCss from "generate-github-markdown-css";
16+
import githubMarkdownCss from 'generate-github-markdown-css';
1717

1818
/*
19-
* If the `light` and `dark` themes are different the CSS returned will include
20-
* `prefers-color-scheme` blocks for light and dark that match the specified
21-
* `light` and `dark` themes (considered "auto" mode). This mode will always
22-
* `preserveVars` as they are necessary for the `prefers-color-scheme` blocks
23-
*
24-
* If the `light` and `dark` themes are equal the output will only contain one
25-
* theme (considered "single" mode)
26-
*
27-
* In "single" mode the output will apply the values of all variables to the
28-
* rules themselves.The output will not contain any `var(--variable)` statements.
29-
* You can disable this by setting `preserveVariables` to true
30-
*/
19+
If the `light` and `dark` themes are different the CSS returned will include `prefers-color-scheme` blocks for light and dark that match the specified `light` and `dark` themes (considered "auto" mode). This mode will always `preserveVars` as they are necessary for the `prefers-color-scheme` blocks
20+
21+
If the `light` and `dark` themes are equal the output will only contain one theme (considered "single" mode)
22+
23+
In "single" mode the output will apply the values of all variables to the rules themselves.The output will not contain any `var(--variable)` statements. You can disable this by setting `preserveVariables` to true
24+
*/
3125

3226
console.log(await githubMarkdownCss({
33-
// The theme to use for light theme
34-
light: "light",
35-
// The theme to use for dark theme
36-
dark: "dark",
37-
// If `true` will return a list of available themes instead of the CSS
38-
list = false,
39-
// If `true` will preserve the block of variables for a given theme even if
40-
// only exporting one theme. By default variables are applied to the rules
41-
// themselves and the resulting CSS will not contain any `var(--variable)`
42-
preserveVariables = false,
43-
// Only output the color variables part of the css. forces
44-
// `preserveVariables` to be `true`
45-
onlyVariables = false,
46-
// Only output the style part of the css without any variables. forces
47-
// `preserveVariables` to be `true` and ignores the theme values.
48-
// Useful to get the base styles to use multiple themes
49-
onlyStyles = false,
50-
// Set the root selector of the rendered markdown body as it should appear
51-
// in the output css. Defaults to `.markdown-body`
52-
rootSelector = '.markdown-body',
53-
}));
27+
// The theme to use for light theme.
28+
light: 'light',
29+
// The theme to use for dark theme.
30+
dark: 'dark',
31+
// If `true`, will return a list of available themes instead of the CSS.
32+
list = false,
33+
// If `true`, will preserve the block of variables for a given theme even if
34+
// only exporting one theme. By default, variables are applied to the rules
35+
// themselves and the resulting CSS will not contain any `var(--variable)`.
36+
preserveVariables = false,
37+
// Only output the color variables part of the CSS. Forces
38+
// `preserveVariables` to be `true`.
39+
onlyVariables = false,
40+
// Only output the style part of the CSS without any variables. Forces
41+
// `preserveVariables` to be `true` and ignores the theme values.
42+
// Useful to get the base styles to use multiple themes.
43+
onlyStyles = false,
44+
// Set the root selector of the rendered Markdown body as it should appear
45+
// in the output CSS. Defaults to `.markdown-body`.
46+
rootSelector = '.markdown-body',
47+
}
48+
));
5449
//=> '.markdown-body { …'
5550
```
5651

5752
## CLI
5853

59-
```
60-
$ npm install --global generate-github-markdown-css
54+
```sh
55+
npm install --global generate-github-markdown-css
6156
```
6257

6358
```
@@ -67,21 +62,21 @@ $ github-markdown-css --help
6762
github-markdown-css > <filename>
6863
6964
Options
70-
--list List available themes
65+
--list List available themes
7166
7267
Set theme:
73-
-l, --light Light theme name from --list values
74-
-d, --dark Dark theme name from --list values
75-
-t, --type, --theme Theme name: 'auto', light', 'dark', or another from --list values.
76-
'auto' means using the media query (prefers-color-scheme)
77-
to switch between the 'light' and 'dark' theme.
68+
--light Light theme name from --list values
69+
--dark Dark theme name from --list values
70+
--theme Theme name: 'auto', light', 'dark', or another from --list values.
71+
'auto' means using the media query (prefers-color-scheme)
72+
to switch between the 'light' and 'dark' theme.
7873
7974
Output options:
80-
--preserveVars Preserve variables in the output. Only applies if light
81-
and dark themes match or if type is not 'auto'
82-
--onlyStyle Only output the styles, forces preserveVars on
83-
--onlyVars Only output the variables for the specified themes
84-
--rootSelector Specify the root selector when outputting styles, default '.markdown-body'
75+
--preserve-variables Preserve variables in the output. Only applies if light
76+
and dark themes match or if type is not 'auto'
77+
--only-style Only output the styles, forces --preserve-variables on
78+
--only-variables Only output the variables for the specified themes
79+
--rootSelector Specify the root selector when outputting styles, default '.markdown-body'
8580
8681
Examples
8782
$ github-markdown-css --list
@@ -95,10 +90,10 @@ $ github-markdown-css --help
9590
$ github-markdown-css --light=light --dark=dark
9691
[CSS with variable blocks for 'light' and 'dark' themes]
9792
98-
$ github-markdown-css --theme=dark_dimmed --onlyVars
93+
$ github-markdown-css --theme=dark_dimmed --only-variables
9994
[CSS with single variable block for 'dark_dimmed' theme with no element styles]
10095
10196
$ github-markdown-css --onlyStyles
10297
[CSS with only element styles using variables but no variables set.
103-
Use in combination with output from setting --onlyVars]
98+
Use in combination with output from setting --only-variables]
10499
```

0 commit comments

Comments
 (0)