@diplodoc/transform 4.31.3 → 4.32.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (52) hide show
  1. package/README.md +27 -27
  2. package/README.ru.md +30 -27
  3. package/dist/css/print.css.map +1 -1
  4. package/dist/css/yfm.css +115 -60
  5. package/dist/css/yfm.css.map +3 -3
  6. package/dist/css/yfm.min.css +1 -1
  7. package/dist/css/yfm.min.css.map +3 -3
  8. package/dist/js/yfm.js +29 -33
  9. package/dist/js/yfm.js.map +3 -3
  10. package/dist/js/yfm.min.js +1 -1
  11. package/dist/js/yfm.min.js.map +3 -3
  12. package/lib/frontmatter/common.d.ts +21 -0
  13. package/lib/frontmatter/common.js +24 -0
  14. package/lib/frontmatter/common.js.map +1 -0
  15. package/lib/frontmatter/emplace.d.ts +4 -0
  16. package/lib/frontmatter/emplace.js +21 -0
  17. package/lib/frontmatter/emplace.js.map +1 -0
  18. package/lib/frontmatter/extract.d.ts +8 -0
  19. package/lib/frontmatter/extract.js +65 -0
  20. package/lib/frontmatter/extract.js.map +1 -0
  21. package/lib/frontmatter/index.d.ts +4 -0
  22. package/lib/frontmatter/index.js +23 -0
  23. package/lib/frontmatter/index.js.map +1 -0
  24. package/lib/frontmatter/transformValues.d.ts +2 -0
  25. package/lib/frontmatter/transformValues.js +17 -0
  26. package/lib/frontmatter/transformValues.js.map +1 -0
  27. package/lib/index.js +3 -1
  28. package/lib/index.js.map +1 -1
  29. package/lib/liquid/index.d.ts +9 -2
  30. package/lib/liquid/index.js +34 -4
  31. package/lib/liquid/index.js.map +1 -1
  32. package/lib/utilsFS.js.map +1 -1
  33. package/package.json +5 -5
  34. package/src/scss/_common.scss +60 -48
  35. package/src/scss/_cut.scss +1 -1
  36. package/src/scss/_file.scss +2 -4
  37. package/src/scss/_highlight.scss +0 -16
  38. package/src/scss/_modal.scss +15 -13
  39. package/src/scss/_note.scss +12 -21
  40. package/src/scss/_term.scss +6 -9
  41. package/src/scss/brand.scss +48 -0
  42. package/src/scss/private.scss +44 -0
  43. package/src/transform/frontmatter/common.ts +27 -0
  44. package/src/transform/frontmatter/emplace.ts +24 -0
  45. package/src/transform/frontmatter/extract.ts +94 -0
  46. package/src/transform/frontmatter/index.ts +4 -0
  47. package/src/transform/frontmatter/transformValues.ts +22 -0
  48. package/src/transform/index.ts +4 -2
  49. package/src/transform/liquid/index.ts +73 -4
  50. package/src/transform/plugins/file/README.md +68 -14
  51. package/src/transform/utilsFS.ts +2 -2
  52. package/src/scss/_variables.scss +0 -16
package/README.md CHANGED
@@ -1,5 +1,6 @@
1
1
  **english** | [русский](https://github.com/yandex-cloud/yfm-transform/blob/master/README.ru.md)
2
- - - -
2
+
3
+ ---
3
4
 
4
5
  [![NPM version](https://img.shields.io/npm/v/@diplodoc/transform.svg?style=flat)](https://www.npmjs.org/package/@diplodoc/transform)
5
6
 
@@ -11,49 +12,49 @@ Use it in your code to work with text during program execution. For example, to
11
12
 
12
13
  1. Install a package:
13
14
 
14
- ```shell
15
- npm i @diplodoc/transform
16
- ```
15
+ ```shell
16
+ npm i @diplodoc/transform
17
+ ```
17
18
 
18
19
  1. Add the package in your code using the `require()` or `import()` function:
19
20
 
20
- ```javascript
21
- const transform = require('@diplodoc/transform');
22
- ```
21
+ ```javascript
22
+ const transform = require('@diplodoc/transform');
23
+ ```
23
24
 
24
25
  1. To ensure text is displayed properly, add CSS styles and client scripts to the project:
25
26
 
26
- ```css
27
- @import '~@diplodoc/transform/dist/css/yfm.css';
28
- ```
27
+ ```css
28
+ @import '~@diplodoc/transform/dist/css/yfm.css';
29
+ ```
29
30
 
30
- ```javascript
31
- import '@diplodoc/transform/dist/js/yfm';
32
- ```
31
+ ```javascript
32
+ import '@diplodoc/transform/dist/js/yfm';
33
+ ```
33
34
 
34
35
  ## Usage {#use}
35
36
 
36
37
  The package provides the `transform()` function:
37
38
 
38
- * Input data: [Settings](settings.md) and a string with YFM.
39
- * Returned value: An object with the `result` and `logs` fields.
39
+ - Input data: [Settings](settings.md) and a string with YFM.
40
+ - Returned value: An object with the `result` and `logs` fields.
40
41
 
41
42
  ### Result field
42
43
 
43
44
  `result`: Resulting object, contains the fields:
44
45
 
45
- * `html`: A line with HTML.
46
- * `meta`: [Metadata](../../syntax/meta.md#meta) from the transmitted content.
47
- * `title`: The document title. Returned if `extractTitle = true` or `needTitle = true`.
48
- * `headings`: A list of document headers.
46
+ - `html`: A line with HTML.
47
+ - `meta`: [Metadata](../../syntax/meta.md#meta) from the transmitted content.
48
+ - `title`: The document title. Returned if `extractTitle = true` or `needTitle = true`.
49
+ - `headings`: A list of document headers.
49
50
 
50
51
  ### Logs field
51
52
 
52
53
  `logs`: Information about the transformation process, includes arrays:
53
54
 
54
- * `error`: Errors.
55
- * `warn`: Warnings.
56
- * `info`: Additional information.
55
+ - `error`: Errors.
56
+ - `warn`: Warnings.
57
+ - `info`: Additional information.
57
58
 
58
59
  ### Example of a function invocation
59
60
 
@@ -62,15 +63,14 @@ const fs = require('fs');
62
63
  const transform = require('@diplodoc/transform');
63
64
 
64
65
  const content = fs.readFileSync(filePath, 'utf');
65
- const vars = { user: { name: 'Alice' } };
66
+ const vars = {user: {name: 'Alice'}};
66
67
 
67
68
  const {
68
- result: {html, meta, title, headings},
69
- logs,
70
- } = transform(content, {vars});
69
+ result: {html, meta, title, headings},
70
+ logs,
71
+ } = transform(content, {vars});
71
72
  ```
72
73
 
73
74
  ## License
74
75
 
75
76
  MIT
76
-
package/README.ru.md CHANGED
@@ -1,5 +1,6 @@
1
1
  **русский** | [english](https://github.com/yandex-cloud/yfm-transform/blob/master/README.md)
2
- - - -
2
+
3
+ ---
3
4
 
4
5
  [![NPM version](https://img.shields.io/npm/v/@diplodoc/transform.svg?style=flat)](https://www.npmjs.org/package/@diplodoc/transform)
5
6
 
@@ -11,46 +12,49 @@
11
12
 
12
13
  1. Установите пакет:
13
14
 
14
- ```shell
15
- npm i @diplodoc/transform
16
- ```
15
+ ```shell
16
+ npm i @diplodoc/transform
17
+ ```
17
18
 
18
19
  1. Подключите пакет в своем коде, используя функцию `require()` или `import()`:
19
20
 
20
- ```javascript
21
- const transform = require('@diplodoc/transform');
22
- ```
21
+ ```javascript
22
+ const transform = require('@diplodoc/transform');
23
+ ```
23
24
 
24
25
  1. Для корректного отображения подключите в проект CSS-стили и клиентские скрипты:
25
26
 
26
- ```css
27
- @import '~@diplodoc/transform/dist/css/yfm.css';
28
- ```
27
+ ```css
28
+ @import '~@diplodoc/transform/dist/css/yfm.css';
29
+ ```
29
30
 
30
- ```javascript
31
- import '@diplodoc/transform/dist/js/yfm';
32
- ```
31
+ ```javascript
32
+ import '@diplodoc/transform/dist/js/yfm';
33
+ ```
33
34
 
34
35
  ## Использование {#use}
35
36
 
36
37
  Пакет предоставляет функцию `transform()`:
37
- * входные данные — строка с YFM и [настройки](settings.md);
38
- * возвращаемое значениеобъект с полями `result` и `logs`.
38
+
39
+ - входные данныестрока с YFM и [настройки](settings.md);
40
+ - возвращаемое значение — объект с полями `result` и `logs`.
39
41
 
40
42
  ### Поле result
41
43
 
42
44
  `result` — объект результата, содержит поля:
43
- * `html` — строка с HTML.
44
- * `meta` — [метаданные](../../syntax/meta.md#meta) из переданного контента.
45
- * `title` — заголовок документа. Возвращается, если заданы настройки `extractTitle = true` или `needTitle = true`.
46
- * `headings` — список заголовков документа.
45
+
46
+ - `html` — строка с HTML.
47
+ - `meta` — [метаданные](../../syntax/meta.md#meta) из переданного контента.
48
+ - `title` — заголовок документа. Возвращается, если заданы настройки `extractTitle = true` или `needTitle = true`.
49
+ - `headings` — список заголовков документа.
47
50
 
48
51
  ### Поле logs
49
52
 
50
53
  `logs` — информация о процессе трансформации, включает массивы:
51
- * `error` — ошибки.
52
- * `warn` — предупреждения.
53
- * `info` — дополнительная информация.
54
+
55
+ - `error` — ошибки.
56
+ - `warn` — предупреждения.
57
+ - `info` — дополнительная информация.
54
58
 
55
59
  ### Пример вызова функции
56
60
 
@@ -59,15 +63,14 @@ const fs = require('fs');
59
63
  const transform = require('@diplodoc/transform');
60
64
 
61
65
  const content = fs.readFileSync(filePath, 'utf');
62
- const vars = { user: { name: 'Alice' } };
66
+ const vars = {user: {name: 'Alice'}};
63
67
 
64
68
  const {
65
- result: {html, meta, title, headings},
66
- logs,
67
- } = transform(content, {vars});
69
+ result: {html, meta, title, headings},
70
+ logs,
71
+ } = transform(content, {vars});
68
72
  ```
69
73
 
70
-
71
74
  ## License
72
75
 
73
76
  MIT
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../src/scss/home/runner/work/transform/transform/src/scss/print/code.scss", "../../src/scss/%3Cinput%20css%205puEFZ%3E", "../../src/scss/home/runner/work/transform/transform/src/scss/print/common.scss", "../../src/scss/home/runner/work/transform/transform/src/scss/print/cut.scss", "../../src/scss/home/runner/work/transform/transform/src/scss/print/note.scss", "../../src/scss/home/runner/work/transform/transform/src/scss/print/table.scss", "../../src/scss/home/runner/work/transform/transform/src/scss/print/tabs.scss", "../../src/scss/home/runner/work/transform/transform/src/scss/print/term.scss"],
3
+ "sources": ["../../src/scss/home/runner/work/transform/transform/src/scss/print/code.scss", "../../src/scss/%3Cinput%20css%20UeGPjq%3E", "../../src/scss/home/runner/work/transform/transform/src/scss/print/common.scss", "../../src/scss/home/runner/work/transform/transform/src/scss/print/cut.scss", "../../src/scss/home/runner/work/transform/transform/src/scss/print/note.scss", "../../src/scss/home/runner/work/transform/transform/src/scss/print/table.scss", "../../src/scss/home/runner/work/transform/transform/src/scss/print/tabs.scss", "../../src/scss/home/runner/work/transform/transform/src/scss/print/term.scss"],
4
4
  "sourcesContent": ["@media print {\n .yfm {\n .yfm-clipboard {\n & > pre > code {\n white-space: pre-wrap;\n }\n }\n }\n}", "@media print {\n .yfm .yfm-clipboard > pre > code {\n white-space: pre-wrap;\n }\n}\n@media print {\n .yfm .yfm-page__delimeter {\n display: none;\n }\n .yfm h1[data-original-article], .yfm h2[data-original-article] {\n page-break-before: always;\n }\n}\n@media print {\n .yfm .yfm-cut-title {\n padding-left: 0;\n }\n .yfm .yfm-cut-title:before {\n display: none;\n }\n .yfm .yfm-cut-content {\n height: auto;\n display: block;\n padding: 5px 0 15px 30px;\n }\n}\n.yfm:not(.yfm_no-list-reset) .yfm-cut-content ol {\n counter-reset: cut-list;\n}\n.yfm:not(.yfm_no-list-reset) .yfm-cut-content ol > li {\n counter-increment: cut-list;\n}\n.yfm:not(.yfm_no-list-reset) .yfm-cut-content ol > li::before {\n content: counters(cut-list, \".\") \". \";\n}\n\n@media print {\n .yfm .yfm-note {\n page-break-inside: avoid;\n }\n}\n.yfm .yfm-table-container {\n position: relative;\n}\n.yfm .yfm-table-container > table {\n overflow: initial;\n position: absolute;\n top: 0;\n left: 0;\n max-width: initial;\n transform-origin: top left;\n}\n.yfm .yfm-table-container > table thead {\n display: table-row-group;\n}\n.yfm .yfm-table-container > table th, .yfm .yfm-table-container > table td {\n page-break-inside: avoid;\n white-space: pre-wrap;\n text-overflow: initial;\n}\n\n@media print {\n .yfm .yfm-tab-list {\n display: none;\n }\n .yfm .yfm-tab-panel {\n visibility: visible;\n height: auto;\n display: block;\n }\n .yfm .yfm-tab-panel:before {\n content: attr(data-title);\n margin-bottom: -1px;\n margin-right: 20px;\n border-bottom: 2px solid transparent;\n line-height: 33px;\n font-weight: 700;\n outline: 0;\n cursor: pointer;\n }\n}\n@media print {\n .yfm .yfm-term_title {\n color: currentColor;\n border-bottom: none;\n }\n}\n/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VSb290IjoiL2hvbWUvcnVubmVyL3dvcmsvdHJhbnNmb3JtL3RyYW5zZm9ybS9zcmMvc2NzcyIsInNvdXJjZXMiOlsicHJpbnQvY29kZS5zY3NzIiwicHJpbnQvY29tbW9uLnNjc3MiLCJwcmludC9jdXQuc2NzcyIsInByaW50L25vdGUuc2NzcyIsInByaW50L3RhYmxlLnNjc3MiLCJwcmludC90YWJzLnNjc3MiLCJwcmludC90ZXJtLnNjc3MiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7RUFHWTtJQUNJOzs7QUNKaEI7RUFFUTtJQUNJOztFQUlBO0lBQ0k7OztBQ1JoQjtFQUdZO0lBQ0k7O0VBRUE7SUFDSTs7RUFJUjtJQUNJO0lBQ0E7SUFDQTs7O0FBT1o7RUFDSTs7QUFFQTtFQUNJOztBQUVBO0VBQ0k7OztBQzVCaEI7RUFFUTtJQUNJOzs7QUNGUjtFQUNJOztBQUVBO0VBQ0k7RUFDQTtFQUNBO0VBQ0E7RUFDQTtFQUNBOztBQUVBO0VBQ0k7O0FBR0o7RUFDSTtFQUNBO0VBQ0E7OztBQ25CaEI7RUFHWTtJQUNJOztFQUdKO0lBQ0k7SUFDQTtJQUNBOztFQUdKO0lBQ0k7SUFDQTtJQUNBO0lBQ0E7SUFDQTtJQUNBO0lBQ0E7SUFDQTs7O0FDckJoQjtFQUdZO0lBQ0k7SUFDQSIsInNvdXJjZXNDb250ZW50IjpbIkBtZWRpYSBwcmludCB7XG4gICAgLnlmbSB7XG4gICAgICAgIC55Zm0tY2xpcGJvYXJkIHtcbiAgICAgICAgICAgICYgPiBwcmUgPiBjb2RlIHtcbiAgICAgICAgICAgICAgICB3aGl0ZS1zcGFjZTogcHJlLXdyYXA7XG4gICAgICAgICAgICB9XG4gICAgICAgIH1cbiAgICB9XG59IiwiQG1lZGlhIHByaW50IHtcbiAgICAueWZtIHtcbiAgICAgICAgLnlmbS1wYWdlX19kZWxpbWV0ZXIge1xuICAgICAgICAgICAgZGlzcGxheTogbm9uZTtcbiAgICAgICAgfVxuXG4gICAgICAgIGgxLCBoMiB7XG4gICAgICAgICAgICAmW2RhdGEtb3JpZ2luYWwtYXJ0aWNsZV0ge1xuICAgICAgICAgICAgICAgIHBhZ2UtYnJlYWstYmVmb3JlOiBhbHdheXM7XG4gICAgICAgICAgICB9XG4gICAgICAgIH1cbiAgICB9XG59IiwiQG1lZGlhIHByaW50IHtcbiAgICAueWZtIHtcbiAgICAgICAgLnlmbS1jdXQge1xuICAgICAgICAgICAgJi10aXRsZSB7XG4gICAgICAgICAgICAgICAgcGFkZGluZy1sZWZ0OiAwO1xuXG4gICAgICAgICAgICAgICAgJjpiZWZvcmUge1xuICAgICAgICAgICAgICAgICAgICBkaXNwbGF5OiBub25lO1xuICAgICAgICAgICAgICAgIH1cbiAgICAgICAgICAgIH1cblxuICAgICAgICAgICAgJi1jb250ZW50IHtcbiAgICAgICAgICAgICAgICBoZWlnaHQ6IGF1dG87XG4gICAgICAgICAgICAgICAgZGlzcGxheTogYmxvY2s7XG4gICAgICAgICAgICAgICAgcGFkZGluZzogNXB4IDAgMTVweCAzMHB4O1xuICAgICAgICAgICAgfVxuICAgICAgICB9XG4gICAgfVxufVxuXG4ueWZtLWN1dC1jb250ZW50IHtcbiAgICAueWZtOm5vdCgueWZtX25vLWxpc3QtcmVzZXQpICYgb2wge1xuICAgICAgICBjb3VudGVyLXJlc2V0OiBjdXQtbGlzdDtcblxuICAgICAgICAmID4gbGkge1xuICAgICAgICAgICAgY291bnRlci1pbmNyZW1lbnQ6IGN1dC1saXN0O1xuXG4gICAgICAgICAgICAmOjpiZWZvcmUge1xuICAgICAgICAgICAgICAgIGNvbnRlbnQ6IGNvdW50ZXJzKGN1dC1saXN0LCAnLicpICcuICc7XG4gICAgICAgICAgICB9XG4gICAgICAgIH1cbiAgICB9XG59XG4iLCJAbWVkaWEgcHJpbnQge1xuICAgIC55Zm0ge1xuICAgICAgICAueWZtLW5vdGUge1xuICAgICAgICAgICAgcGFnZS1icmVhay1pbnNpZGU6IGF2b2lkO1xuICAgICAgICB9XG4gICAgfVxufVxuIiwiLnlmbSB7XG4gICAgLnlmbS10YWJsZS1jb250YWluZXIge1xuICAgICAgICBwb3NpdGlvbjogcmVsYXRpdmU7XG5cbiAgICAgICAgJiA+IHRhYmxlIHtcbiAgICAgICAgICAgIG92ZXJmbG93OiBpbml0aWFsO1xuICAgICAgICAgICAgcG9zaXRpb246IGFic29sdXRlO1xuICAgICAgICAgICAgdG9wOiAwO1xuICAgICAgICAgICAgbGVmdDogMDtcbiAgICAgICAgICAgIG1heC13aWR0aDogaW5pdGlhbDtcbiAgICAgICAgICAgIHRyYW5zZm9ybS1vcmlnaW46IHRvcCBsZWZ0O1xuXG4gICAgICAgICAgICB0aGVhZCB7XG4gICAgICAgICAgICAgICAgZGlzcGxheTogdGFibGUtcm93LWdyb3VwO1xuICAgICAgICAgICAgfVxuXG4gICAgICAgICAgICB0aCwgdGQge1xuICAgICAgICAgICAgICAgIHBhZ2UtYnJlYWstaW5zaWRlOiBhdm9pZDtcbiAgICAgICAgICAgICAgICB3aGl0ZS1zcGFjZTogcHJlLXdyYXA7XG4gICAgICAgICAgICAgICAgdGV4dC1vdmVyZmxvdzogaW5pdGlhbDtcbiAgICAgICAgICAgIH1cbiAgICAgICAgfVxuICAgIH1cbn0iLCJAbWVkaWEgcHJpbnQge1xuICAgIC55Zm0ge1xuICAgICAgICAueWZtLXRhYiB7XG4gICAgICAgICAgICAmLWxpc3Qge1xuICAgICAgICAgICAgICAgIGRpc3BsYXk6IG5vbmU7XG4gICAgICAgICAgICB9XG5cbiAgICAgICAgICAgICYtcGFuZWwge1xuICAgICAgICAgICAgICAgIHZpc2liaWxpdHk6IHZpc2libGU7XG4gICAgICAgICAgICAgICAgaGVpZ2h0OiBhdXRvO1xuICAgICAgICAgICAgICAgIGRpc3BsYXk6IGJsb2NrO1xuICAgICAgICAgICAgfVxuXG4gICAgICAgICAgICAmLXBhbmVsOmJlZm9yZSB7XG4gICAgICAgICAgICAgICAgY29udGVudDogYXR0cihkYXRhLXRpdGxlKTtcbiAgICAgICAgICAgICAgICBtYXJnaW4tYm90dG9tOiAtMXB4O1xuICAgICAgICAgICAgICAgIG1hcmdpbi1yaWdodDogMjBweDtcbiAgICAgICAgICAgICAgICBib3JkZXItYm90dG9tOiAycHggc29saWQgdHJhbnNwYXJlbnQ7XG4gICAgICAgICAgICAgICAgbGluZS1oZWlnaHQ6IDMzcHg7XG4gICAgICAgICAgICAgICAgZm9udC13ZWlnaHQ6IDcwMDtcbiAgICAgICAgICAgICAgICBvdXRsaW5lOiAwO1xuICAgICAgICAgICAgICAgIGN1cnNvcjogcG9pbnRlcjtcbiAgICAgICAgICAgIH1cbiAgICAgICAgfVxuICAgIH1cbn1cbiIsIkBtZWRpYSBwcmludCB7XG4gICAgLnlmbSB7XG4gICAgICAgIC55Zm0tdGVybSB7XG4gICAgICAgICAgICAmX3RpdGxlIHtcbiAgICAgICAgICAgICAgICBjb2xvcjogY3VycmVudENvbG9yO1xuICAgICAgICAgICAgICAgIGJvcmRlci1ib3R0b206IG5vbmU7XG4gICAgICAgICAgICB9XG4gICAgICAgIH1cbiAgICB9XG59Il19 */", "@media print {\n .yfm {\n .yfm-page__delimeter {\n display: none;\n }\n\n h1, h2 {\n &[data-original-article] {\n page-break-before: always;\n }\n }\n }\n}", "@media print {\n .yfm {\n .yfm-cut {\n &-title {\n padding-left: 0;\n\n &:before {\n display: none;\n }\n }\n\n &-content {\n height: auto;\n display: block;\n padding: 5px 0 15px 30px;\n }\n }\n }\n}\n\n.yfm-cut-content {\n .yfm:not(.yfm_no-list-reset) & ol {\n counter-reset: cut-list;\n\n & > li {\n counter-increment: cut-list;\n\n &::before {\n content: counters(cut-list, '.') '. ';\n }\n }\n }\n}\n", "@media print {\n .yfm {\n .yfm-note {\n page-break-inside: avoid;\n }\n }\n}\n", ".yfm {\n .yfm-table-container {\n position: relative;\n\n & > table {\n overflow: initial;\n position: absolute;\n top: 0;\n left: 0;\n max-width: initial;\n transform-origin: top left;\n\n thead {\n display: table-row-group;\n }\n\n th, td {\n page-break-inside: avoid;\n white-space: pre-wrap;\n text-overflow: initial;\n }\n }\n }\n}", "@media print {\n .yfm {\n .yfm-tab {\n &-list {\n display: none;\n }\n\n &-panel {\n visibility: visible;\n height: auto;\n display: block;\n }\n\n &-panel:before {\n content: attr(data-title);\n margin-bottom: -1px;\n margin-right: 20px;\n border-bottom: 2px solid transparent;\n line-height: 33px;\n font-weight: 700;\n outline: 0;\n cursor: pointer;\n }\n }\n }\n}\n", "@media print {\n .yfm {\n .yfm-term {\n &_title {\n color: currentColor;\n border-bottom: none;\n }\n }\n }\n}"],
5
5
  "mappings": ";AAAA,OAAA;AAGY,GAAA,IAAA,CAAA,cAAA,EAAA,IAAA,EAAA;AACI,iBAAA;ACDd;AACF;ACJA,OAAA;AAEQ,GFCI,IEDJ,CAAA;AACI,aAAA;ADKV;ACDU,GFJA,IEIA,EAAA,CAAA;EAAA,CFJA,IEIA,EAAA,CAAA;AACI,uBAAA;ADGd;AACF;AEZA,OAAA;AAGY,GHAA,IGAA,CAAA;AACI,kBAAA;AFYd;AEVc,GHHJ,IGGI,CAHJ,aAGI;AACI,aAAA;AFYlB;AERU,GHRA,IGQA,CAAA;AACI,YAAA;AACA,aAAA;AACA,aAAA,IAAA,EAAA,KAAA;AFUd;AACF;AEJI,CHlBQ,GGkBR,KAAA,CAAA,mBAAA,CAVQ,gBAUR;AACI,iBAAA;AFMR;AEJQ,CHrBI,GGqBJ,KAAA,CAHJ,mBAGI,CAbI,gBAaJ,GAAA,EAAA;AACI,qBAAA;AFMZ;AEJY,CHxBA,GGwBA,KAAA,CANR,mBAMQ,CAhBA,gBAgBA,GAAA,EAAA,EAAA;AACI,WAAA,SAAA,QAAA,EAAA,KAAA;AFMhB;AGlCA,OAAA;AAEQ,GJCI,IIDJ,CAAA;AACI,uBAAA;AHoCV;AACF;AIvCI,CLEQ,IKFR,CAAA;AACI,YAAA;AJyCR;AIvCQ,CLDI,IKCJ,CAHJ,oBAGI,EAAA;AACI,YAAA;AAAA,YAAA;AACA,YAAA;AACA,OAAA;AACA,QAAA;AACA,aAAA;AAAA,aAAA;AACA,oBAAA,IAAA;AJyCZ;AIvCY,CLTA,IKSA,CAXR,oBAWQ,EAAA,MAAA;AACI,WAAA;AJyChB;AItCY,CLbA,IKaA,CAfR,oBAeQ,EAAA,MAAA;AAAA,CLbA,IKaA,CAfR,oBAeQ,EAAA,MAAA;AACI,qBAAA;AACA,eAAA;AACA,iBAAA;AJwChB;AK3DA,OAAA;AAGY,GNAA,IMAA,CAAA;AACI,aAAA;AL4Dd;AKzDU,GNJA,IMIA,CAAA;AACI,gBAAA;AACA,YAAA;AACA,aAAA;AL2Dd;AKxDU,GNVA,IMUA,CANA,aAMA;AACI,aAAA,KAAA;AACA,mBAAA;AACA,kBAAA;AACA,mBAAA,IAAA,MAAA;AACA,iBAAA;AACA,iBAAA;AACA,aAAA;AACA,YAAA;AL0Dd;AACF;AMhFA,OAAA;AAGY,GPAA,IOAA,CAAA;AACI,WAAA;AACA,mBAAA;ANgFd;AACF;",
6
6
  "names": []
package/dist/css/yfm.css CHANGED
@@ -2,10 +2,84 @@
2
2
 
3
3
  /* src/scss/yfm.scss */
4
4
  .yfm {
5
+ --yfm-color-text-private: rgba(0, 0, 0, 0.7);
6
+ --yfm-color-link-private: #027bf3;
7
+ --yfm-color-link-hover-private: #004080;
8
+ --yfm-color-base-private: #ffffff;
9
+ --yfm-color-table-private: #333;
10
+ --yfm-color-border-private: rgba(0, 0, 0, 0.07);
11
+ --yfm-color-table-row-background-private: rgba(0, 0, 0, 0.02);
12
+ --yfm-color-accent-private: #027bf3;
13
+ --yfm-color-inline-code-private: rgba(59, 96, 128, 1);
14
+ --yfm-color-inline-code-background-private: rgba(107, 132, 153, 0.12);
15
+ --yfm-color-code-background-private: rgba(107, 132, 153, 0.12);
16
+ --yfm-color-hljs-background-private: rgba(107, 132, 153, 0.12);
17
+ --yfm-color-hljs-subst-private: #444;
18
+ --yfm-color-hljs-comment-private: #888888;
19
+ --yfm-color-hljs-deletion-private: #880000;
20
+ --yfm-color-hljs-section-private: #880000;
21
+ --yfm-color-hljs-pseudo-private: #bc6060;
22
+ --yfm-color-hljs-literal-private: #78a960;
23
+ --yfm-color-hljs-addition-private: #397300;
24
+ --yfm-color-hljs-meta-private: #1f7199;
25
+ --yfm-color-hljs-meta-string-private: #4d99bf;
26
+ --yfm-color-note-tip-private: #56bd67;
27
+ --yfm-color-note-tip-background-private: rgba(63, 201, 46, 0.1);
28
+ --yfm-color-note-warning-private: #f19518;
29
+ --yfm-color-note-warning-background-private: rgba(255, 136, 0, 0.15);
30
+ --yfm-color-note-important-private: #ff4645;
31
+ --yfm-color-note-important-background-private: rgba(235, 50, 38, 0.08);
32
+ --yfm-color-note-info-background-private: rgba(2, 123, 243, 0.08);
33
+ --yfm-color-term-title-private: #027bf3;
34
+ --yfm-color-term-title-hover-private: #004080;
35
+ --yfm-color-term-dfn-background-private: rgb(255, 255, 255);
36
+ --yfm-color-term-dfn-shadow-private: rgba(0, 0, 0, 0.15);
37
+ --yfm-color-term-dfn-presudo-shadow-private: rgb(229, 229, 229);
38
+ --yfm-color-modal-content-private: rgb(255, 255, 255);
39
+ --yfm-color-modal-actions-hover-private: rgba(0, 0, 0, 0.05);
40
+ --yfm-color-modal-wide-content-private: rgba(0, 0, 0, 0.85);
41
+ --yfm-color-modal-wide-content-overlay-private: rgb(0, 0, 0);
42
+ --yfm-color-base: var(--yfm-color-base-private);
43
+ --yfm-color-text: var(--yfm-color-text-private);
44
+ --yfm-color-link: var(--yfm-color-link-private);
45
+ --yfm-color-link-hover: var(--yfm-color-link-hover-private);
46
+ --yfm-color-table: var(--yfm-color-table-private);
47
+ --yfm-color-table-row-background: var(--yfm-color-table-row-background-private);
48
+ --yfm-color-border: var(--yfm-color-border-private);
49
+ --yfm-color-accent: var(--yfm-color-accent-private);
50
+ --yfm-color-inline-code: var(--yfm-color-inline-code-private);
51
+ --yfm-color-inline-code-background: var(--yfm-color-inline-code-background-private);
52
+ --yfm-color-code-background: var(--yfm-color-code-background-private);
53
+ --yfm-color-hljs-background: var(--yfm-color-hljs-background-private);
54
+ --yfm-color-hljs-subst: var(--yfm-color-hljs-subst-private);
55
+ --yfm-color-hljs-comment: var(--yfm-color-hljs-comment-private);
56
+ --yfm-color-hljs-deletion: var(--yfm-color-hljs-deletion-private);
57
+ --yfm-color-hljs-section: var(--yfm-color-hljs-section-private);
58
+ --yfm-color-hljs-pseudo: var(--yfm-color-hljs-pseudo-private);
59
+ --yfm-color-hljs-literal: var(--yfm-color-hljs-literal-private);
60
+ --yfm-color-hljs-addition: var(--yfm-color-hljs-addition-private);
61
+ --yfm-color-hljs-meta: var(--yfm-color-hljs-meta-private);
62
+ --yfm-color-hljs-meta-string: var(--yfm-color-hljs-meta-string-private);
63
+ --yfm-color-note-tip: var(--yfm-color-note-tip-private);
64
+ --yfm-color-note-tip-background: var(--yfm-color-note-tip-background-private);
65
+ --yfm-color-note-warning: var(--yfm-color-note-warning-private);
66
+ --yfm-color-note-warning-background: var(--yfm-color-note-warning-background-private);
67
+ --yfm-color-note-important: var(--yfm-color-note-important-private);
68
+ --yfm-color-note-important-background: var(--yfm-color-note-important-background-private);
69
+ --yfm-color-note-info-background: var(--yfm-color-note-info-background-private);
70
+ --yfm-color-term-title: var(--yfm-color-term-title-private);
71
+ --yfm-color-term-title-hover: var(--yfm-color-term-title-hover-private);
72
+ --yfm-color-term-dfn-background: var(--yfm-color-term-dfn-background-private);
73
+ --yfm-color-term-dfn-shadow: var(--yfm-color-term-dfn-shadow-private);
74
+ --yfm-color-term-dfn-pseudo-shadow: var(--yfm-color-term-dfn-presudo-shadow-private);
75
+ --yfm-color-modal-content: var(--yfm-color-modal-content-private);
76
+ --yfm-color-modal-actions-hover: var(--yfm-color-modal-actions-hover-private);
77
+ --yfm-color-modal-wide-content: var(--yfm-color-modal-wide-content-private);
78
+ --yfm-color-modal-wide-content-overlay: var(--yfm-color-modal-wide-content-overlay-private);
5
79
  font-family:
6
80
  "Segoe UI",
7
- Arial,
8
- Helvetica,
81
+ arial,
82
+ helvetica,
9
83
  sans-serif,
10
84
  "Apple Color Emoji",
11
85
  "Segoe UI Emoji",
@@ -15,16 +89,7 @@
15
89
  line-height: 20px;
16
90
  word-wrap: break-word;
17
91
  color: rgba(0, 0, 0, 0.7);
18
- --yfm-color-hljs-background: rgba(107, 132, 153, 0.12);
19
- --yfm-color-hljs-subst: #444;
20
- --yfm-color-hljs-comment: #888888;
21
- --yfm-color-hljs-deletion: #880000;
22
- --yfm-color-hljs-section: #880000;
23
- --yfm-color-hljs-pseudo: #BC6060;
24
- --yfm-color-hljs-literal: #78A960;
25
- --yfm-color-hljs-addition: #397300;
26
- --yfm-color-hljs-meta: #1f7199;
27
- --yfm-color-hljs-meta-string: #4d99bf;
92
+ color: var(--yfm-color-text);
28
93
  --yfm-font-family-monospace:
29
94
  "Menlo",
30
95
  "Monaco",
@@ -37,8 +102,8 @@
37
102
  monospace;
38
103
  --yfm-font-family-sans:
39
104
  "Segoe UI",
40
- Arial,
41
- Helvetica,
105
+ arial,
106
+ helvetica,
42
107
  sans-serif,
43
108
  "Apple Color Emoji",
44
109
  "Segoe UI Emoji",
@@ -88,13 +153,13 @@
88
153
  }
89
154
  .yfm a {
90
155
  background-color: transparent;
91
- color: #027bf3;
156
+ color: var(--yfm-color-link);
92
157
  -webkit-text-decoration: none;
93
158
  text-decoration: none;
94
159
  }
95
160
  .yfm a:hover,
96
161
  .yfm a:active {
97
- color: #004080;
162
+ color: var(--yfm-color-link-hover);
98
163
  }
99
164
  .yfm a:not([href]) {
100
165
  color: inherit;
@@ -120,7 +185,7 @@
120
185
  .yfm img {
121
186
  -o-object-fit: contain;
122
187
  object-fit: contain;
123
- background-color: #ffffff;
188
+ background-color: var(--yfm-color-base);
124
189
  }
125
190
  .yfm svg {
126
191
  height: auto;
@@ -139,7 +204,7 @@
139
204
  .yfm dl,
140
205
  .yfm table,
141
206
  .yfm pre {
142
- margin: 0 0 15px 0;
207
+ margin: 0 0 15px;
143
208
  }
144
209
  .yfm ul pre,
145
210
  .yfm ol pre,
@@ -167,7 +232,7 @@
167
232
  padding: 0;
168
233
  }
169
234
  .yfm table {
170
- color: #333;
235
+ color: var(--yfm-color-table);
171
236
  display: inline-block;
172
237
  max-width: 100%;
173
238
  width: auto;
@@ -175,15 +240,15 @@
175
240
  position: relative;
176
241
  z-index: 1;
177
242
  box-sizing: border-box;
178
- border: 1px solid rgba(0, 0, 0, 0.07);
243
+ border: 1px solid var(--yfm-color-border);
179
244
  border-radius: 8px;
180
245
  border-collapse: collapse;
181
246
  border-spacing: 0;
182
- background: #ffffff;
247
+ background: var(--yfm-color-base);
183
248
  }
184
249
  .yfm table thead,
185
250
  .yfm table tr:nth-child(2n) {
186
- background-color: rgba(0, 0, 0, 0.02);
251
+ background-color: var(--yfm-color-table-row-background);
187
252
  }
188
253
  .yfm table tr:first-child td,
189
254
  .yfm table tr:first-child th {
@@ -198,7 +263,7 @@
198
263
  padding: 10px 20px;
199
264
  overflow: hidden;
200
265
  text-overflow: ellipsis;
201
- border: 1px solid rgba(0, 0, 0, 0.07);
266
+ border: 1px solid var(--yfm-color-border);
202
267
  }
203
268
  .yfm table th > *:first-child,
204
269
  .yfm table td > *:first-child {
@@ -230,7 +295,7 @@
230
295
  padding: 0;
231
296
  margin: 1.5em 0;
232
297
  overflow: hidden;
233
- background-color: rgba(0, 0, 0, 0.07);
298
+ background-color: var(--yfm-color-border);
234
299
  border: none;
235
300
  }
236
301
  .yfm hr::before {
@@ -245,7 +310,7 @@
245
310
  .yfm blockquote {
246
311
  position: relative;
247
312
  padding-left: 12px;
248
- border-left: 3px solid #027bf3;
313
+ border-left: 3px solid var(--yfm-color-accent);
249
314
  }
250
315
  .yfm blockquote > *:first-child {
251
316
  margin-top: 0;
@@ -317,11 +382,11 @@
317
382
  }
318
383
  .yfm code {
319
384
  padding: 0.1em 0.4em 0.15em;
320
- background-color: rgba(107, 132, 153, 0.12);
385
+ background-color: var(--yfm-color-inline-code-background);
321
386
  border-radius: 4px;
322
387
  font-size: 0.875em;
323
- white-space: normal;
324
- color: rgb(59, 96, 128);
388
+ white-space: pre-wrap;
389
+ color: var(--yfm-color-inline-code);
325
390
  }
326
391
  .yfm pre {
327
392
  word-wrap: normal;
@@ -337,14 +402,14 @@
337
402
  word-wrap: normal;
338
403
  background-color: transparent;
339
404
  border: 0;
340
- color: rgba(0, 0, 0, 0.7);
405
+ color: var(--yfm-color-text);
341
406
  }
342
407
  .yfm pre > code {
343
408
  display: block;
344
409
  padding: 16px;
345
410
  overflow: auto;
346
- background-color: rgba(107, 132, 153, 0.12);
347
- color: rgba(0, 0, 0, 0.7);
411
+ background-color: var(--yfm-color-code-background);
412
+ color: var(--yfm-color-text);
348
413
  white-space: pre;
349
414
  }
350
415
  .yfm sup,
@@ -376,7 +441,7 @@
376
441
  font-weight: 700;
377
442
  }
378
443
  .yfm .yfm-note > p {
379
- margin: 0 0 10px 0;
444
+ margin: 0 0 10px;
380
445
  }
381
446
  .yfm .yfm-note > p:first-child::before {
382
447
  box-sizing: content-box;
@@ -397,23 +462,23 @@
397
462
  .yfm .yfm-note.yfm-accent-tip > p:first-child::before {
398
463
  content: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 16 16"%3E%3Ccircle cx="8" cy="8" r="8" fill="rgb(86,189,103)"/%3E%3Crect width="1" height="5" x="7.5" y="6.5" stroke="%23fff" rx=".5"/%3E%3Ccircle cx="8" cy="4" r="1" fill="%23fff"/%3E%3C/svg%3E');
399
464
  }
400
- .yfm .yfm-note.yfm-accent-alert > p:first-child::before {
401
- content: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 16 16"%3E%3Ccircle cx="8" cy="8" r="8" fill="rgb(255,70,69)"/%3E%3Crect width="1" height="5" x="7.5" y="6.5" stroke="%23fff" rx=".5"/%3E%3Ccircle cx="8" cy="4" r="1" fill="%23fff"/%3E%3C/svg%3E');
402
- }
403
465
  .yfm .yfm-note.yfm-accent-warning > p:first-child::before {
404
466
  content: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 16 16"%3E%3Ccircle cx="8" cy="8" r="8" fill="rgb(241,149,24)"/%3E%3Crect width="1" height="5" x="7.5" y="6.5" stroke="%23fff" rx=".5"/%3E%3Ccircle cx="8" cy="4" r="1" fill="%23fff"/%3E%3C/svg%3E');
405
467
  }
468
+ .yfm .yfm-note.yfm-accent-alert > p:first-child::before {
469
+ content: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 16 16"%3E%3Ccircle cx="8" cy="8" r="8" fill="rgb(255,70,69)"/%3E%3Crect width="1" height="5" x="7.5" y="6.5" stroke="%23fff" rx=".5"/%3E%3Ccircle cx="8" cy="4" r="1" fill="%23fff"/%3E%3C/svg%3E');
470
+ }
406
471
  .yfm .yfm-note.yfm-accent-info {
407
- background: rgba(2, 123, 243, 0.08);
472
+ background: var(--yfm-color-note-info-background);
408
473
  }
409
474
  .yfm .yfm-note.yfm-accent-tip {
410
- background: rgba(63, 201, 46, 0.1);
475
+ background: var(--yfm-color-note-tip-background);
411
476
  }
412
477
  .yfm .yfm-note.yfm-accent-alert {
413
- background: rgba(235, 50, 38, 0.08);
478
+ background: var(--yfm-color-note-important-background);
414
479
  }
415
480
  .yfm .yfm-note.yfm-accent-warning {
416
- background: rgba(255, 136, 0, 0.15);
481
+ background: var(--yfm-color-note-warning-background);
417
482
  }
418
483
  .yfm h1 .yfm-anchor,
419
484
  .yfm h2 .yfm-anchor,
@@ -472,16 +537,13 @@
472
537
  display: block;
473
538
  overflow-x: auto;
474
539
  padding: 16px;
475
- background: rgba(107, 132, 153, 0.12);
476
540
  background: var(--yfm-color-hljs-background);
477
541
  }
478
542
  .yfm .hljs,
479
543
  .yfm .hljs-subst {
480
- color: #444;
481
544
  color: var(--yfm-color-hljs-subst);
482
545
  }
483
546
  .yfm .hljs-comment {
484
- color: #888888;
485
547
  color: var(--yfm-color-hljs-comment);
486
548
  }
487
549
  .yfm .hljs-keyword,
@@ -500,12 +562,10 @@
500
562
  .yfm .hljs-quote,
501
563
  .yfm .hljs-template-tag,
502
564
  .yfm .hljs-deletion {
503
- color: #880000;
504
565
  color: var(--yfm-color-hljs-deletion);
505
566
  }
506
567
  .yfm .hljs-title,
507
568
  .yfm .hljs-section {
508
- color: #880000;
509
569
  color: var(--yfm-color-hljs-section);
510
570
  font-weight: bold;
511
571
  }
@@ -516,26 +576,21 @@
516
576
  .yfm .hljs-link,
517
577
  .yfm .hljs-selector-attr,
518
578
  .yfm .hljs-selector-pseudo {
519
- color: #BC6060;
520
579
  color: var(--yfm-color-hljs-pseudo);
521
580
  }
522
581
  .yfm .hljs-literal {
523
- color: #78A960;
524
582
  color: var(--yfm-color-hljs-literal);
525
583
  }
526
584
  .yfm .hljs-built_in,
527
585
  .yfm .hljs-bullet,
528
586
  .yfm .hljs-code,
529
587
  .yfm .hljs-addition {
530
- color: #397300;
531
588
  color: var(--yfm-color-hljs-addition);
532
589
  }
533
590
  .yfm .hljs-meta {
534
- color: #1f7199;
535
591
  color: var(--yfm-color-hljs-meta);
536
592
  }
537
593
  .yfm .hljs-meta-string {
538
- color: #4d99bf;
539
594
  color: var(--yfm-color-hljs-meta-string);
540
595
  }
541
596
  .yfm .hljs-emphasis {
@@ -581,8 +636,8 @@
581
636
  user-select: none;
582
637
  width: 16px;
583
638
  margin: 0 2px;
584
- color: rgba(0, 0, 0, 0.7);
585
- color: var(--yfm-file-icon-color, rgba(0, 0, 0, 0.7));
639
+ color: --yfm-color-text;
640
+ color: var(--yfm-file-icon-color, --yfm-color-text);
586
641
  background-color: currentColor;
587
642
  background-repeat: no-repeat;
588
643
  background-position: 50%;
@@ -600,7 +655,7 @@
600
655
  content: "\a0";
601
656
  }
602
657
  .yfm-term_title {
603
- color: #027bf3;
658
+ color: var(--yfm-color-term-title);
604
659
  cursor: pointer;
605
660
  border-bottom: 1px dotted;
606
661
  font-size: inherit;
@@ -608,7 +663,7 @@
608
663
  font-style: normal;
609
664
  }
610
665
  .yfm-term_title:hover {
611
- color: #004080;
666
+ color: var(--yfm-color-term-title-hover);
612
667
  }
613
668
  .yfm-term_dfn {
614
669
  position: absolute;
@@ -619,12 +674,12 @@
619
674
  visibility: hidden;
620
675
  opacity: 0;
621
676
  padding: 10px;
622
- background-color: rgb(255, 255, 255);
677
+ background-color: var(--yfm-color-term-dfn-background);
623
678
  font-size: inherit;
624
679
  line-height: inherit;
625
680
  font-style: normal;
626
681
  border-radius: 4px;
627
- box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
682
+ box-shadow: 0 8px 20px var(--yfm-color-term-dfn-shadow);
628
683
  outline: none;
629
684
  }
630
685
  @media screen and (max-width: 600px) {
@@ -641,7 +696,7 @@
641
696
  bottom: 0;
642
697
  left: 0;
643
698
  border-radius: inherit;
644
- box-shadow: 0 0 0 1px rgb(229, 229, 229);
699
+ box-shadow: 0 0 0 1px var(--yfm-color-term-dfn-pseudo-shadow);
645
700
  }
646
701
  .yfm-term_dfn.open {
647
702
  visibility: visible;
@@ -703,7 +758,7 @@
703
758
  }
704
759
  .wide-container .wide-content-wrapper {
705
760
  z-index: 200;
706
- background-color: var(--g-color-base-background);
761
+ background-color: var(--yfm-color-modal-content);
707
762
  height: 90vh;
708
763
  width: 70vw;
709
764
  border-radius: 10px;
@@ -747,7 +802,7 @@
747
802
  transition: background 300ms;
748
803
  }
749
804
  .wide-container .wide-content-wrapper .wide-actions .close-action:hover {
750
- background: var(--g-color-base-simple-hover);
805
+ background: var(--yfm-color-modal-actions-hover);
751
806
  }
752
807
  .wide-element-wrapper {
753
808
  display: flex;
@@ -767,7 +822,7 @@
767
822
  z-index: 100;
768
823
  padding: 6px;
769
824
  box-sizing: content-box;
770
- color: var(--g-color-text-primary);
825
+ color: var(--yfm-color-modal-wide-content);
771
826
  cursor: pointer;
772
827
  }
773
828
  .wide-content-viewer > svg {
@@ -781,7 +836,7 @@
781
836
  position: fixed;
782
837
  top: 0;
783
838
  left: 0;
784
- background-color: black;
839
+ background-color: var(--yfm-color-modal-wide-content-overlay);
785
840
  opacity: 0.6;
786
841
  }
787
842
  .yfm-cut {