mathpix-markdown-it 2.0.36 → 2.0.37
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.
- package/README.md +23 -3
- package/doc/changelog.md +32 -0
- package/es5/bundle.js +5 -5
- package/es5/index.js +5 -5
- package/lib/contex-menu/styles.js +2 -1
- package/lib/contex-menu/styles.js.map +1 -1
- package/lib/copy-to-clipboard/clipboard-copy-styles.js +2 -1
- package/lib/copy-to-clipboard/clipboard-copy-styles.js.map +1 -1
- package/lib/mathpix-markdown-model/index.d.ts +34 -5
- package/lib/mathpix-markdown-model/index.js +105 -50
- package/lib/mathpix-markdown-model/index.js.map +1 -1
- package/lib/styles/colors.d.ts +63 -0
- package/lib/styles/colors.js +68 -0
- package/lib/styles/colors.js.map +1 -0
- package/lib/styles/helpers.js +22 -0
- package/lib/styles/helpers.js.map +1 -0
- package/lib/styles/index.d.ts +4 -3
- package/lib/styles/index.js +45 -7
- package/lib/styles/index.js.map +1 -1
- package/lib/styles/styles-code.d.ts +1 -1
- package/lib/styles/styles-code.js +6 -1
- package/lib/styles/styles-code.js.map +1 -1
- package/lib/styles/styles-container.js +2 -1
- package/lib/styles/styles-container.js.map +1 -1
- package/lib/styles/styles-lists.d.ts +1 -1
- package/lib/styles/styles-lists.js +1 -1
- package/lib/styles/styles-lists.js.map +1 -1
- package/lib/styles/styles-tabular.d.ts +1 -1
- package/lib/styles/styles-tabular.js +5 -2
- package/lib/styles/styles-tabular.js.map +1 -1
- package/package.json +1 -1
- package/pr-specs/2026-03-mmd-css-scoping.md +267 -0
- package/lib/styles/halpers.js +0 -13
- package/lib/styles/halpers.js.map +0 -1
- /package/lib/styles/{halpers.d.ts → helpers.d.ts} +0 -0
package/lib/styles/index.js
CHANGED
|
@@ -1,21 +1,59 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.TocStyle = exports.PreviewStyle = exports.MathpixStyle = exports.resetBodyStyles = void 0;
|
|
3
|
+
exports.TocStyle = exports.PreviewStyle = exports.MathpixStyle = exports.resetBodyStyles = exports.COLOR_CODE_BG = void 0;
|
|
4
4
|
var consts_1 = require("../markdown/common/consts");
|
|
5
|
-
|
|
6
|
-
var
|
|
5
|
+
var colors_1 = require("./colors");
|
|
6
|
+
var colors_2 = require("./colors");
|
|
7
|
+
Object.defineProperty(exports, "COLOR_CODE_BG", { enumerable: true, get: function () { return colors_2.COLOR_CODE_BG; } });
|
|
8
|
+
exports.resetBodyStyles = "\nbody {\n margin: 0;\n line-height: normal;\n}\n";
|
|
9
|
+
var layoutStyles = function (_a) {
|
|
10
|
+
var setTextAlignJustify = _a.setTextAlignJustify, maxWidth = _a.maxWidth, isPptx = _a.isPptx;
|
|
11
|
+
var justify = setTextAlignJustify ? 'text-align: justify;' : '';
|
|
12
|
+
return [
|
|
13
|
+
"\n#setText > div {\n justify-content: inherit;\n margin-top: 0;\n margin-bottom: 1em;\n ".concat(justify, "\n ").concat(maxWidth ? 'overflow-x: auto;' : '', "\n}"),
|
|
14
|
+
maxWidth && "\n#setText > blockquote,\n#setText > h1, #setText > h2, #setText > h3,\n#setText > h4, #setText > h5, #setText > h6 {\n overflow-x: auto;\n}",
|
|
15
|
+
!isPptx && "\n#setText div:last-child {\n margin-bottom: 0 !important;\n}",
|
|
16
|
+
"\n#setText > br, #preview-content br {\n line-height: 1.2;\n}",
|
|
17
|
+
"\n#preview-content > div {\n margin-top: 0;\n margin-bottom: 1em;\n ".concat(justify, "\n}"),
|
|
18
|
+
"\n.proof > div,\n#preview-content .proof > div, #setText .proof > div,\n.theorem > div,\n#preview-content .theorem > div, #setText .theorem > div {\n margin-top: 1rem;\n}",
|
|
19
|
+
].filter(Boolean).join('');
|
|
20
|
+
};
|
|
21
|
+
var mathStyles = function (maxWidth) { return [
|
|
22
|
+
"\nmjx-container {\n text-indent: 0;\n overflow-y: hidden;\n overflow-x: auto;\n padding-top: 1px;\n padding-bottom: 1px;\n ".concat(maxWidth ? "max-width: ".concat(maxWidth, ";") : '', "\n}"),
|
|
23
|
+
maxWidth && "\nmjx-container[jax=\"SVG\"] > svg {\n overflow-x: auto;\n}",
|
|
24
|
+
"\n.math-inline mjx-container {\n display: inline-block !important;\n page-break-inside: avoid;\n max-width: 100%;\n padding: 0;\n line-height: 0;\n}\n.math-inline[data-overflow=\"visible\"] mjx-container {\n overflow: visible;\n}\n.math-inline mjx-container mjx-assistive-mml {\n max-width: 100%;\n}\n.math-block {\n align-items: center;\n page-break-after: auto;\n page-break-inside: avoid;\n margin: 0;\n display: block;\n}\n.math-inline {\n display: inline-flex;\n max-width: 100%;\n}\n.math-block[data-width=\"full\"] {\n overflow-x: auto;\n display: flex;\n}\n.math-block[data-width=\"full\"] mjx-container[jax=SVG][display=true] {\n display: flex;\n flex: 1 1;\n justify-content: center;\n}\nsvg .math-inline {\n display: initial;\n max-width: initial;\n}\nsvg .math-inline mjx-container {\n max-width: initial;\n}\nsvg mjx-container {\n overflow: visible;\n padding: 0;\n}\nsvg .math-block[data-width=\"full\"] {\n overflow: visible;\n}\n.math-block, .math-inline {\n --mmd-highlight-color: ".concat(consts_1.HIGHLIGHT_COLOR, ";\n --mmd-highlight-text-color: ").concat(consts_1.HIGHLIGHT_TEXT_COLOR, ";\n}\n.math-block[data-highlight-color] mjx-container[jax=\"SVG\"] > svg {\n background-color: var(--mmd-highlight-color);\n}\n.math-block[data-highlight-text-color] mjx-container[jax=\"SVG\"] > svg {\n color: var(--mmd-highlight-text-color);\n}\n.math-inline[data-highlight-color] mjx-container[jax=\"SVG\"] {\n background-color: var(--mmd-highlight-color);\n}\n.math-inline[data-highlight-text-color] mjx-container[jax=\"SVG\"] {\n color: var(--mmd-highlight-text-color);\n}\n.math-block p {\n flex-shrink: 1;\n}\n.math-block mjx-container {\n margin: 0 !important;\n}\n.math-error {\n background-color: ").concat(colors_1.COLOR_MATH_ERROR_BG, ";\n color: ").concat(colors_1.COLOR_MATH_ERROR_TEXT, ";\n}"),
|
|
25
|
+
].filter(Boolean).join(''); };
|
|
26
|
+
var imageStyles = function () { return "\n#preview-content img, #setText img {\n max-width: 100%;\n}"; };
|
|
27
|
+
var blockquoteStyles = function (useColors) { return "\n#preview-content blockquote, #setText blockquote {\n page-break-inside: avoid;\n ".concat(useColors ? "color: ".concat(colors_1.COLOR_BLOCKQUOTE_TEXT, ";") : '', "\n margin: 0 0 1em 0;\n padding-left: 3em;\n border-left: .5em solid ").concat(useColors ? colors_1.COLOR_BLOCKQUOTE_BORDER : 'currentColor', ";\n}"); };
|
|
28
|
+
var codeBlockStyles = function (useColors) { return "\n#preview-content pre, #setText pre {\n border: none;\n padding: 0;\n overflow: auto;\n font-size: 85%;\n line-height: 1.45;\n border-radius: 6px;\n box-sizing: border-box;\n ".concat(useColors ? "background: ".concat(colors_1.COLOR_CODE_BG, ";") : '', "\n}\n#preview-content pre code, #setText pre code {\n padding: 1rem;\n display: block;\n overflow-x: auto;\n line-height: 24px;\n}"); };
|
|
29
|
+
var tableStyles = function (useColors) { return "\n#preview-content table, #setText table {\n display: table;\n overflow: auto;\n max-width: 100%;\n border-collapse: collapse;\n page-break-inside: avoid;\n margin-bottom: 1em;\n}\n#preview-content table th, #setText table th {\n text-align: center;\n font-weight: bold;\n}\n#preview-content table td, #setText table td,\n#preview-content table th, #setText table th {\n border: 1px solid ".concat(useColors ? colors_1.COLOR_TABLE_BORDER : 'currentColor', ";\n padding: 6px 13px;\n}\n#preview-content table tr, #setText table tr {\n ").concat(useColors ? "background-color: ".concat(colors_1.COLOR_TABLE_ROW_BG, ";") : '', "\n border-top: 1px solid ").concat(useColors ? colors_1.COLOR_TABLE_ROW_BORDER : 'currentColor', ";\n}\n#preview-content table tr:nth-child(2n), #setText table tr:nth-child(2n) {\n ").concat(useColors ? "background-color: ".concat(colors_1.COLOR_TABLE_ROW_ALT_BG, ";") : '', "\n}"); };
|
|
30
|
+
var docStructureStyles = function () { return "\n.main-title,\n#preview-content .main-title, #setText .main-title {\n text-align: center;\n line-height: 1.2;\n margin: 0 auto 1em auto;\n}\n.author,\n#preview-content .author, #setText .author {\n text-align: center;\n margin: 0 auto;\n display: flex;\n justify-content: center;\n flex-wrap: wrap;\n}\n.author p,\n#preview-content .author p, #setText .author p {\n min-width: 30%;\n max-width: 50%;\n padding: 0 7px;\n}\n.author > p > span,\n#preview-content .author > p > span, #setText .author > p > span {\n display: block;\n text-align: center;\n}\n.section-title,\n#preview-content .section-title, #setText .section-title {\n margin-top: 1.5em;\n}\n.abstract,\n#preview-content .abstract, #setText .abstract {\n text-align: justify;\n margin-bottom: 1em;\n}\n.abstract p,\n#preview-content .abstract p, #setText .abstract p {\n margin-bottom: 0;\n}\n#preview-content sup, #setText sup {\n top: -.5em;\n position: relative;\n font-size: 75%;\n line-height: 0;\n vertical-align: baseline;\n}"; };
|
|
31
|
+
var inlineTextStyles = function (useColors) { return "\n.text-url,\n#preview-content .text-url, #setText .text-url {\n ".concat(useColors ? "color: ".concat(colors_1.COLOR_LINK, ";") : '', "\n cursor: text;\n pointer-events: none;\n}\n.text-url a:hover,\n#preview-content .text-url a:hover, #setText .text-url a:hover {\n ").concat(useColors ? "color: ".concat(colors_1.COLOR_LINK, ";") : '', "\n}\nmark,\n#preview-content mark, #setText mark {\n ").concat(useColors ? "background-color: ".concat(colors_1.COLOR_MARK_BG, ";") : '', "\n}\nspan[data-underline-type] mark,\n#preview-content span[data-underline-type] mark,\n#setText span[data-underline-type] mark {\n background: inherit;\n ").concat(useColors ? "background-color: ".concat(colors_1.COLOR_MARK_BG, ";") : '', "\n padding-top: 0;\n padding-bottom: 0;\n}"); };
|
|
32
|
+
var miscStyles = function () { return "\n*[data-has-dotfill] {\n position: relative;\n overflow: hidden;\n}\n*[data-has-dotfill] .dotfill::after {\n position: absolute;\n padding-left: .25ch;\n content: \" . . . . . . . . . . . . . . . . . . . \"\n \". . . . . . . . . . . . . . . . . . . . . . . \"\n \". . . . . . . . . . . . . . . . . . . . . . . \"\n \". . . . . . . . . . . . . . . . . . . . . . . \"\n \". . . . . . . . . . . . . . . . . . . . . . . \"\n \". . . . . . . . . . . . . . . . . . . . . . . \"\n \". . . . . . . . . . . . . . . . . . . . . . . \";\n text-align: right;\n}\n.smiles,\n#preview-content .smiles, #setText .smiles {\n text-align: center;\n}\ndiv.svg-container,\n#preview-content > div.svg-container,\n#setText > div.svg-container {\n display: flex;\n justify-content: center;\n}"; };
|
|
33
|
+
var printStyles = function () { return "\n@media print {\n #preview {\n font-size: 10pt !important;\n }\n .math-block svg, .math-inline svg {\n shape-rendering: crispEdges;\n margin-top: 1px;\n }\n #preview-content img, #setText img {\n display: block;\n }\n #preview-content .figure_img img, #setText .figure_img img {\n display: inline;\n }\n #preview-content h1, #preview-content h2, #preview-content h3,\n #preview-content h4, #preview-content h5, #preview-content h6,\n #setText h1, #setText h2, #setText h3,\n #setText h4, #setText h5, #setText h6 {\n page-break-inside: avoid;\n position: relative;\n border: 2px solid transparent;\n }\n #preview-content h1::after, #preview-content h2::after, #preview-content h3::after,\n #preview-content h4::after, #preview-content h5::after, #preview-content h6::after,\n #setText h1::after, #setText h2::after, #setText h3::after,\n #setText h4::after, #setText h5::after, #setText h6::after {\n content: \"\";\n display: block;\n height: 100px;\n margin-bottom: -100px;\n position: relative;\n }\n}"; };
|
|
34
|
+
var MathpixStyle = function (setTextAlignJustify, useColors, maxWidth, isPptx) {
|
|
7
35
|
if (setTextAlignJustify === void 0) { setTextAlignJustify = false; }
|
|
8
36
|
if (useColors === void 0) { useColors = true; }
|
|
9
37
|
if (maxWidth === void 0) { maxWidth = ''; }
|
|
10
|
-
if (scaleEquation === void 0) { scaleEquation = true; }
|
|
11
38
|
if (isPptx === void 0) { isPptx = false; }
|
|
12
|
-
return "\n #setText > div {\n justify-content: inherit;\n margin-top: 0;\n margin-bottom: 1em;\n ".concat(setTextAlignJustify ? 'text-align: justify;' : '', "\n ").concat(maxWidth ? 'overflow-x: auto;' : '', "\n }\n \n ").concat(maxWidth ? '#setText > blockquote, h1, h2, h3, h4, h5, h6 { overflow-x: auto; }' : '', "\n \n ").concat(!isPptx ? '#setText div:last-child {\n margin-bottom: 0 !important;\n }' : '', "\n\n #setText > br, #preview-content br {\n line-height: 1.2;\n }\n\n #preview-content > div {\n margin-top: 0;\n margin-bottom: 1em;\n ").concat(setTextAlignJustify ? 'text-align: justify;' : '', "\n } \n \n .proof > div, .theorem > div {\n margin-top: 1rem;\n }\n\n #preview-content table {\n margin-bottom: 1em;\n }\n\n #setText table {\n margin-bottom: 1em;\n }\n \n #preview-content .sub-table table, #setText .sub-table table {\n margin-bottom: 0;\n }\n\n mjx-container {\n text-indent: 0;\n overflow-y: hidden;\n overflow-x: auto;\n padding-top: 1px;\n padding-bottom: 1px;\n ").concat(maxWidth ? 'max-width:' + maxWidth + ';' : '', "\n ").concat(maxWidth ? 'overflow-x: auto;' : '', "\n }\n \n ").concat(maxWidth ? 'mjx-container[jax="SVG"] > svg { overflow-x: auto; }' : '', "\n \n .math-inline mjx-container {\n display: inline-block !important;\n page-break-inside: avoid;\n max-width: 100%;\n padding: 0;\n line-height: 0;\n }\n .math-inline[data-overflow=\"visible\"] mjx-container {\n overflow: visible;\n }\n .math-inline mjx-container mjx-assistive-mml {\n max-width: 100%;\n }\n .math-block {\n align-items: center;\n page-break-after: auto;\n page-break-inside: avoid;\n margin: 0;\n display: block; /* mjx-container has block */\n }\n \n .math-inline {\n display: inline-flex; /* mjx-container has inline-block. To prevent displacement during use overflow-x: auto;*/\n max-width: 100%;\n }\n \n .math-block[data-width=\"full\"] {\n overflow-x: auto;\n display: flex; /* mjx-container has flex */\n }\n\n .math-block[data-width=\"full\"] mjx-container[jax=SVG][display=true] {\n display: flex;\n flex: 1 1;\n justify-content: center;\n }\n \n svg .math-inline {\n display: initial;\n max-width: initial;\n }\n \n svg .math-inline mjx-container {\n max-width: initial;\n }\n \n svg mjx-container {\n overflow: visible;\n padding: 0;\n }\n \n svg math-block[data-width=\"full\"] {\n overflow: visible;\n }\n \n .math-block,.math-inline {\n --mmd-highlight-color: ").concat(consts_1.HIGHLIGHT_COLOR, ";\n --mmd-highlight-text-color: ").concat(consts_1.HIGHLIGHT_TEXT_COLOR, ";\n }\n\n .math-block[data-highlight-color] mjx-container[jax=\"SVG\"] > svg {\n background-color: var(--mmd-highlight-color);\n } \n \n .math-block[data-highlight-text-color] mjx-container[jax=\"SVG\"] > svg {\n color: var(--mmd-highlight-text-color);\n } \n .math-inline[data-highlight-color] mjx-container[jax=\"SVG\"] {\n background-color: var(--mmd-highlight-color);\n } \n \n .math-inline[data-highlight-text-color] mjx-container[jax=\"SVG\"] {\n color: var(--mmd-highlight-text-color);\n }\n \n .math-block p {\n flex-shrink: 1;\n }\n .math-block mjx-container {\n margin: 0 !important;\n }\n .math-error {\n background-color: yellow;\n color: red;\n }\n\n #preview-content img, #setText img {\n max-width: 100%;\n }\n \n #preview-content blockquote, #setText blockquote {\n page-break-inside: avoid;\n ").concat(useColors ? 'color: #666;' : '', "\n margin: 0 0 1em 0;\n padding-left: 3em;\n border-left: .5em solid #eee;\n }\n\n #preview-content pre, #setText pre {\n border: none;\n padding: 0;\n overflow: auto;\n font-size: 85%;\n line-height: 1.45;\n border-radius: 6px;\n box-sizing: border-box;\n ").concat(useColors ? 'background: #f8f8fa;' : '', "\n }\n #preview-content pre code, #setText pre code{\n padding: 1rem;\n display: block;\n overflow-x: auto;\n line-height: 24px;\n }\n .empty {\n text-align: center;\n font-size: 18px;\n padding: 50px 0 !important;\n }\n\n #setText table, #preview-content table {\n display: table; \n overflow: auto;\n max-width: 100%;\n border-collapse: collapse;\n page-break-inside: avoid;\n }\n \n #setText table th, #preview-content table th {\n text-align: center;\n font-weight: bold;\n }\n \n #setText table td, #preview-content table td,\n #setText table th, #preview-content table th {\n border: 1px solid #dfe2e5;\n padding: 6px 13px;\n }\n \n #setText table tr, #preview-content table tr {\n ").concat(useColors ? 'background-color: #fff;' : '', "\n border-top: 1px solid ").concat(useColors ? '#c6cbd1' : 'currentColor', ";\n }\n \n #setText table tr:nth-child(2n), #preview-content table tr:nth-child(2n) {\n ").concat(useColors ? 'background-color: #f6f8fa;' : '', "\n }\n \n #preview-content .main-title, #setText .main-title {\n text-align: center;\n line-height: 1.2;\n margin: 0 auto 1em auto;\n }\n\n #preview-content .author, #setText .author {\n text-align: center;\n margin: 0 auto;\n display: flex;\n justify-content: center;\n flex-wrap: wrap;\n }\n\n #preview-content .author p, #setText .author p {\n min-width: 30%;\n max-width: 50%;\n padding: 0 7px;\n }\n\n #preview-content .author > p > span, #setText .author > p > span {\n display: block;\n text-align: center;\n }\n\n #preview-content .section-title, #setText .section-title {\n margin-top: 1.5em;\n }\n\n #preview-content .abstract, #setText .abstract {\n text-align: justify;\n margin-bottom: 1em;\n }\n\n #preview-content .abstract p, #setText .abstract p {\n margin-bottom: 0;\n }\n\n @media print {\n\n #preview {\n font-size: 10pt!important;\n }\n\n svg {\n shape-rendering: crispEdges;\n }\n\n .math-block svg, math-inline svg {\n margin-top: 1px;\n }\n\n #preview-content img, #setText img {\n display: block;\n }\n \n #preview-content .figure_img img, #setText .figure_img img {\n display: inline;\n }\n\n .preview-right {\n word-break: break-word;\n }\n\n #preview-content h1, #setText h1 {\n page-break-inside: avoid;\n position: relative;\n border: 2px solid transparent;\n }\n \n #preview-content h1::after, #setText h1::after {\n content: \"\";\n display: block;\n height: 100px;\n margin-bottom: -100px;\n position: relative;\n }\n \n #preview-content h2, #setText h2 {\n page-break-inside: avoid;\n position: relative;\n border: 2px solid transparent;\n }\n \n #preview-content h2::after, #setText h2::after {\n content: \"\";\n display: block;\n height: 100px;\n margin-bottom: -100px;\n position: relative;\n }\n \n #preview-content h3, #setText h3 {\n page-break-inside: avoid;\n position: relative;\n border: 2px solid transparent;\n }\n \n #preview-content h3::after, #setText h3::after {\n content: \"\";\n display: block;\n height: 100px;\n margin-bottom: -100px;\n position: relative;\n }\n \n #preview-content h4, #setText h4 {\n page-break-inside: avoid;\n position: relative;\n border: 2px solid transparent;\n }\n \n #preview-content h4::after, #setText h4::after {\n content: \"\";\n display: block;\n height: 100px;\n margin-bottom: -100px;\n position: relative;\n }\n \n #preview-content h5, #setText h5 {\n page-break-inside: avoid;\n position: relative;\n border: 2px solid transparent;\n }\n \n #preview-content h5::after, #setText h5::after {\n content: \"\";\n display: block;\n height: 100px;\n margin-bottom: -100px;\n position: relative;\n }\n \n #preview-content h6, #setText h6 {\n page-break-inside: avoid;\n position: relative;\n border: 2px solid transparent;\n }\n \n #preview-content h6::after, #setText h6::after {\n content: \"\";\n display: block;\n height: 100px;\n margin-bottom: -100px;\n position: relative;\n }\n }\n #preview-content sup, #setText sup {\n top: -.5em;\n position: relative;\n font-size: 75%;\n line-height: 0;\n vertical-align: baseline;\n }\n \n #preview-content .text-url, #setText .text-url {\n ").concat(useColors ? 'color: #0B93ff;' : '', "\n cursor: text;\n pointer-events: none;\n }\n \n #preview-content .text-url a:hover, #setText .text-url a:hover {\n ").concat(useColors ? 'color: #0B93ff;' : '', "\n }\n \n mark {\n background-color: #feffe6;\n }\n \n span[data-underline-type] mark {\n background: inherit;\n background-color: #feffe6;\n padding-top: 0;\n padding-bottom: 0;\n }\n \n *[data-has-dotfill] {\n position: relative;\n overflow: hidden;\n }\n \n *[data-has-dotfill] .dotfill::after {\n position: absolute;\n padding-left: .25ch;\n content: \" . . . . . . . . . . . . . . . . . . . \"\n \". . . . . . . . . . . . . . . . . . . . . . . \"\n \". . . . . . . . . . . . . . . . . . . . . . . \"\n \". . . . . . . . . . . . . . . . . . . . . . . \"\n \". . . . . . . . . . . . . . . . . . . . . . . \"\n \". . . . . . . . . . . . . . . . . . . . . . . \"\n \". . . . . . . . . . . . . . . . . . . . . . . \";\n text-align: right;\n }\n \n .smiles {\n text-align: center;\n }\n\n div.svg-container, #setText > div.svg-container {\n display: flex;\n justify-content: center;\n }\n");
|
|
39
|
+
return [
|
|
40
|
+
layoutStyles({ setTextAlignJustify: setTextAlignJustify, maxWidth: maxWidth, isPptx: isPptx }),
|
|
41
|
+
mathStyles(maxWidth),
|
|
42
|
+
imageStyles(),
|
|
43
|
+
blockquoteStyles(useColors),
|
|
44
|
+
codeBlockStyles(useColors),
|
|
45
|
+
tableStyles(useColors),
|
|
46
|
+
docStructureStyles(),
|
|
47
|
+
inlineTextStyles(useColors),
|
|
48
|
+
miscStyles(),
|
|
49
|
+
printStyles(),
|
|
50
|
+
].join('');
|
|
13
51
|
};
|
|
14
52
|
exports.MathpixStyle = MathpixStyle;
|
|
15
|
-
exports.PreviewStyle = "\n
|
|
53
|
+
exports.PreviewStyle = "\n#preview {\n font-family: 'CMU Serif', 'Georgia', Helvetica, Arial, sans-serif;\n font-size: 17px;\n visibility: visible;\n word-break: break-word;\n padding: 2.5em;\n max-width: 800px;\n margin: auto;\n box-sizing: content-box;\n}\n#preview h1, #preview h2, #preview h3, #preview h4, #preview h5, #preview strong {\n font-family: 'CMU Serif Bold', 'Georgia', Helvetica, Arial, sans-serif;\n}\n#preview i, #preview em {\n font-family: 'CMU Serif Italic', 'Georgia', Helvetica, Arial, sans-serif;\n}\n";
|
|
16
54
|
var TocStyle = function (containerName) {
|
|
17
55
|
if (containerName === void 0) { containerName = 'toc'; }
|
|
18
|
-
return "\n
|
|
56
|
+
return "\n#".concat(containerName, " {\n width: 25%;\n overflow-y: auto;\n min-width: 370px;\n}\n@media only screen and (max-width: 960px) {\n #").concat(containerName, " { display: none; }\n}\n@media print {\n #").concat(containerName, " { display: none; }\n}\n#toc_container {\n padding: 70px 0 0 60px;\n}\n#toc_container .toc-title-1 {\n font-weight: 500;\n}\n#toc_container .toc-title-1 a {\n font-size: 1.6em;\n}\n#toc_container .toc-title-2 a {\n font-size: 1.3em;\n}\n#toc_container .toc-title-3, #toc_container .toc-title-4, #toc_container .toc-title-5, .previewPage #toc_container .toc-title-6 {\n padding-left: 20px;\n}\n#toc_container .toc-title-3 a, #toc_container .toc-title-4 > a, #toc_container .toc-title-5 > a, .previewPage #toc_container .toc-title-6 > a {\n font-size: 1em;\n color: ").concat(colors_1.COLOR_TOC_SUBTITLE, ";\n}\n#toc_container ul {\n list-style: none;\n padding: 0;\n margin: 0;\n}\n#toc_container li {\n padding-top: 20px;\n}\n#toc_container li a {\n color: ").concat(colors_1.COLOR_TOC_LINK, ";\n}\n#toc_container li a:hover {\n color: ").concat(colors_1.COLOR_TOC_LINK_HOVER, ";\n}\n#toc_container li a:active,\n#toc_container li .selected {\n color: ").concat(colors_1.COLOR_TOC_LINK_ACTIVE, " !important;\n}\n");
|
|
19
57
|
};
|
|
20
58
|
exports.TocStyle = TocStyle;
|
|
21
59
|
//# sourceMappingURL=index.js.map
|
package/lib/styles/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/styles/index.ts"],"names":[],"mappings":";;;AAAA,oDAAkF;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/styles/index.ts"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const codeStyles
|
|
1
|
+
export declare const codeStyles: (useColors?: boolean) => string;
|
|
@@ -1,5 +1,10 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.codeStyles = void 0;
|
|
4
|
-
|
|
4
|
+
var colors_1 = require("./colors");
|
|
5
|
+
var codeStyles = function (useColors) {
|
|
6
|
+
if (useColors === void 0) { useColors = true; }
|
|
7
|
+
return "\n#preview-content code, #setText code {\n font-family: Inconsolata;\n font-size: inherit;\n display: initial;\n ".concat(useColors ? "background: ".concat(colors_1.COLOR_CODE_BG, ";") : '', "\n}\n#preview-content .mmd-highlight code, #setText .mmd-highlight code,\n#preview-content pre.mmd-highlight code, #setText pre.mmd-highlight code {\n background-color: transparent;\n}\n#preview-content pre code, #setText pre code {\n font-family: 'DM Mono', Inconsolata, monospace;\n ").concat(useColors ? "color: ".concat(colors_1.COLOR_PRE_CODE_TEXT, ";") : '', "\n font-size: 15px;\n}\n.hljs-comment, .hljs-quote,\n#preview-content .hljs-comment, #setText .hljs-comment,\n#preview-content .hljs-quote, #setText .hljs-quote {\n color: ").concat(colors_1.HLJS_COMMENT, ";\n font-style: italic;\n}\n.hljs-command,\n#preview-content .hljs-command, #setText .hljs-command {\n color: ").concat(colors_1.HLJS_COMMAND, ";\n}\n.hljs-keyword, .hljs-selector-tag, .hljs-subst,\n#preview-content .hljs-keyword, #setText .hljs-keyword,\n#preview-content .hljs-selector-tag, #setText .hljs-selector-tag,\n#preview-content .hljs-subst, #setText .hljs-subst {\n color: ").concat(colors_1.HLJS_KEYWORD, ";\n font-weight: bold;\n}\n.hljs-number, .hljs-literal, .hljs-variable,\n.hljs-template-variable, .hljs-tag .hljs-attr,\n#preview-content .hljs-number, #setText .hljs-number,\n#preview-content .hljs-literal, #setText .hljs-literal,\n#preview-content .hljs-variable, #setText .hljs-variable,\n#preview-content .hljs-template-variable, #setText .hljs-template-variable,\n#preview-content .hljs-tag .hljs-attr, #setText .hljs-tag .hljs-attr {\n color: ").concat(colors_1.HLJS_COMMAND, ";\n}\n.hljs-string, .hljs-doctag,\n#preview-content .hljs-string, #setText .hljs-string,\n#preview-content .hljs-doctag, #setText .hljs-doctag {\n color: ").concat(colors_1.HLJS_STRING, ";\n}\n.hljs-title, .hljs-section, .hljs-selector-id,\n#preview-content .hljs-title, #setText .hljs-title,\n#preview-content .hljs-section, #setText .hljs-section,\n#preview-content .hljs-selector-id, #setText .hljs-selector-id {\n color: ").concat(colors_1.HLJS_TITLE, ";\n font-weight: bold;\n}\n.hljs-subst,\n#preview-content .hljs-subst, #setText .hljs-subst {\n font-weight: normal;\n}\n.hljs-type, .hljs-class .hljs-title,\n#preview-content .hljs-type, #setText .hljs-type,\n#preview-content .hljs-class .hljs-title, #setText .hljs-class .hljs-title {\n color: ").concat(colors_1.HLJS_TYPE, ";\n font-weight: bold;\n}\n.hljs-tag, .hljs-name, .hljs-attribute,\n#preview-content .hljs-tag, #setText .hljs-tag,\n#preview-content .hljs-name, #setText .hljs-name,\n#preview-content .hljs-attribute, #setText .hljs-attribute {\n color: ").concat(colors_1.HLJS_TAG, ";\n font-weight: normal;\n}\n.hljs-regexp, .hljs-link,\n#preview-content .hljs-regexp, #setText .hljs-regexp,\n#preview-content .hljs-link, #setText .hljs-link {\n color: ").concat(colors_1.HLJS_REGEXP, ";\n}\n.hljs-symbol, .hljs-bullet,\n#preview-content .hljs-symbol, #setText .hljs-symbol,\n#preview-content .hljs-bullet, #setText .hljs-bullet {\n color: ").concat(colors_1.HLJS_SYMBOL, ";\n}\n.hljs-built_in, .hljs-builtin-name,\n#preview-content .hljs-built_in, #setText .hljs-built_in,\n#preview-content .hljs-builtin-name, #setText .hljs-builtin-name {\n color: ").concat(colors_1.HLJS_STRING, ";\n}\n.hljs-meta,\n#preview-content .hljs-meta, #setText .hljs-meta {\n color: ").concat(colors_1.HLJS_META, ";\n font-weight: bold;\n}\n.hljs-meta-keyword,\n#preview-content .hljs-meta-keyword, #setText .hljs-meta-keyword {\n color: ").concat(colors_1.HLJS_KEYWORD, ";\n}\n.hljs-meta-string,\n#preview-content .hljs-meta-string, #setText .hljs-meta-string {\n color: ").concat(colors_1.HLJS_META_STRING, ";\n}\n.hljs-deletion,\n#preview-content .hljs-deletion, #setText .hljs-deletion {\n background: ").concat(colors_1.HLJS_DELETION_BG, ";\n}\n.hljs-addition,\n#preview-content .hljs-addition, #setText .hljs-addition {\n background: ").concat(colors_1.HLJS_ADDITION_BG, ";\n}\n.hljs-emphasis,\n#preview-content .hljs-emphasis, #setText .hljs-emphasis {\n font-style: italic;\n}\n.hljs-strong,\n#preview-content .hljs-strong, #setText .hljs-strong {\n font-weight: bold;\n}\n");
|
|
8
|
+
};
|
|
9
|
+
exports.codeStyles = codeStyles;
|
|
5
10
|
//# sourceMappingURL=styles-code.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles-code.js","sourceRoot":"","sources":["../../src/styles/styles-code.ts"],"names":[],"mappings":";;;
|
|
1
|
+
{"version":3,"file":"styles-code.js","sourceRoot":"","sources":["../../src/styles/styles-code.ts"],"names":[],"mappings":";;;AAAA,mCAKkB;AAEX,IAAM,UAAU,GAAG,UAAC,SAAyB;IAAzB,0BAAA,EAAA,gBAAyB;IAAa,OAAA,+HAK7D,SAAS,CAAC,CAAC,CAAC,sBAAe,sBAAa,MAAG,CAAC,CAAC,CAAC,EAAE,6SAQhD,SAAS,CAAC,CAAC,CAAC,iBAAU,4BAAmB,MAAG,CAAC,CAAC,CAAC,EAAE,2LAM1C,qBAAY,6HAKZ,qBAAY,+PAMZ,qBAAY,gdAUZ,qBAAY,wKAKZ,oBAAW,4PAMX,mBAAU,wTAUV,kBAAS,6PAOT,iBAAQ,0LAMR,oBAAW,wKAKX,oBAAW,gMAKX,oBAAW,6FAIX,kBAAS,2IAKT,qBAAY,kHAIZ,yBAAgB,8GAIX,yBAAgB,8GAIhB,yBAAgB,kNAU/B;AAnHgE,CAmHhE,CAAC;AAnHW,QAAA,UAAU,cAmHrB"}
|
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.ContainerStyle = void 0;
|
|
4
|
+
var colors_1 = require("./colors");
|
|
4
5
|
var ContainerStyle = function (useColors) {
|
|
5
6
|
if (useColors === void 0) { useColors = true; }
|
|
6
|
-
return "\
|
|
7
|
+
return "\nhtml,body {\n width: 100%;\n height: 100%;\n}\n*, *::before,*::after {\n box-sizing: border-box;\n}\nbody {\n margin: 0;\n ".concat(useColors ? "color: ".concat(colors_1.COLOR_BODY_TEXT, ";") : '', "\n font-size: 14px;\n line-height: normal;\n}\nhr {\n box-sizing: content-box;\n height: 0;\n overflow: visible;\n}\nh1, h2, h3, h4, h5, h6 {\n margin-top: 0;\n margin-bottom: 0.5em;\n ").concat(useColors ? "color: ".concat(colors_1.COLOR_HEADING_TEXT, ";") : '', "\n font-weight: 500;\n}\np {\n margin-top: 0;\n margin-bottom: 1em;\n}\nol, ul, dl {\n margin-top: 0;\n margin-bottom: 1em;\n}\nol ol, ul ul, ol ul, ul ol {\n margin-bottom: 0;\n}\ndt {\n font-weight: 500;\n}\ndd {\n margin-bottom: 0.5em;\n margin-left: 0;\n}\nblockquote {\n margin: 0 0 1em;\n}\ndfn {\n font-style: italic;\n}\nb, strong {\n font-weight: bolder;\n}\nsmall {\n font-size: 80%;\n}\nsub, sup {\n position: relative;\n font-size: 75%;\n line-height: 0;\n vertical-align: baseline;\n}\nsub {\n bottom: -0.25em;\n}\nsup {\n top: -0.5em;\n}\na {\n ").concat(useColors ? "color: ".concat(colors_1.COLOR_LINK, ";") : '', "\n text-decoration: none;\n background-color: transparent;\n outline: none;\n cursor: pointer;\n transition: color 0.3s;\n}\na:hover {\n ").concat(useColors ? "color: ".concat(colors_1.COLOR_LINK_HOVER, ";") : '', "\n}\na:active {\n ").concat(useColors ? "color: ".concat(colors_1.COLOR_LINK_ACTIVE, ";") : '', "\n}\na:active, a:hover {\n text-decoration: none;\n outline: 0;\n}\na[disabled] {\n ").concat(useColors ? "color: ".concat(colors_1.COLOR_LINK_DISABLED, ";") : '', "\n cursor: not-allowed;\n pointer-events: none;\n}\npre, code, kbd, samp {\n font-size: 1em;\n}\npre {\n margin-top: 0;\n margin-bottom: 1em;\n overflow: auto;\n}\nfigure {\n margin: 0 0 1em;\n}\nimg {\n vertical-align: middle;\n border-style: none;\n}\nsvg:not(:root) {\n overflow: hidden;\n}\ntable {\n border-collapse: collapse;\n}\ncaption {\n padding-top: 0.75em;\n padding-bottom: 0.3em;\n ").concat(useColors ? "color: ".concat(colors_1.COLOR_CAPTION_TEXT, ";") : '', "\n text-align: left;\n caption-side: bottom;\n}\nth {\n text-align: inherit;\n}\n");
|
|
7
8
|
};
|
|
8
9
|
exports.ContainerStyle = ContainerStyle;
|
|
9
10
|
//# sourceMappingURL=styles-container.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles-container.js","sourceRoot":"","sources":["../../src/styles/styles-container.ts"],"names":[],"mappings":";;;
|
|
1
|
+
{"version":3,"file":"styles-container.js","sourceRoot":"","sources":["../../src/styles/styles-container.ts"],"names":[],"mappings":";;;AAAA,mCAGkB;AAEX,IAAM,cAAc,GAAG,UAAC,SAAyB;IAAzB,0BAAA,EAAA,gBAAyB;IAAa,OAAA,4IAUjE,SAAS,CAAC,CAAC,CAAC,iBAAU,wBAAe,MAAG,CAAC,CAAC,CAAC,EAAE,8MAY7C,SAAS,CAAC,CAAC,CAAC,iBAAU,2BAAkB,MAAG,CAAC,CAAC,CAAC,EAAE,glBA8ChD,SAAS,CAAC,CAAC,CAAC,iBAAU,mBAAU,MAAG,CAAC,CAAC,CAAC,EAAE,4JAQxC,SAAS,CAAC,CAAC,CAAC,iBAAU,yBAAgB,MAAG,CAAC,CAAC,CAAC,EAAE,gCAG9C,SAAS,CAAC,CAAC,CAAC,iBAAU,0BAAiB,MAAG,CAAC,CAAC,CAAC,EAAE,oGAO/C,SAAS,CAAC,CAAC,CAAC,iBAAU,4BAAmB,MAAG,CAAC,CAAC,CAAC,EAAE,uaA4BjD,SAAS,CAAC,CAAC,CAAC,iBAAU,2BAAkB,MAAG,CAAC,CAAC,CAAC,EAAE,yFAOnD;AAzHoE,CAyHpE,CAAC;AAzHW,QAAA,cAAc,kBAyHzB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const listsStyles = "\n
|
|
1
|
+
export declare const listsStyles = "\nol.enumerate, ul.itemize,\n#preview-content ol.enumerate, #setText ol.enumerate,\n#preview-content ul.itemize, #setText ul.itemize {\n padding-inline-start: 40px;\n margin: 0 0 1em 0;\n}\nli > ol.enumerate, li > ul.itemize,\n#preview-content li > ol.enumerate, #setText li > ol.enumerate,\n#preview-content li > ul.itemize, #setText li > ul.itemize {\n margin: 0;\n}\nul.itemize > li,\n#preview-content ul.itemize > li, #setText ul.itemize > li {\n position: relative;\n min-height: 1.4em;\n margin-bottom: 0;\n}\n.enumerate > .li_enumerate,\n#preview-content .enumerate > .li_enumerate, #setText .enumerate > .li_enumerate {\n margin-bottom: 0;\n}\n.itemize > li > span.li_level, .li_enumerate.not_number > span.li_level,\n#preview-content .itemize > li > span.li_level, #setText .itemize > li > span.li_level,\n#preview-content .li_enumerate.not_number > span.li_level, #setText .li_enumerate.not_number > span.li_level {\n position: absolute;\n right: 100%;\n white-space: nowrap;\n width: max-content;\n display: flex;\n justify-content: flex-end;\n padding-right: 10px;\n box-sizing: border-box;\n}\n.li_enumerate.not_number,\n#preview-content .li_enumerate.not_number, #setText .li_enumerate.not_number {\n position: relative;\n display: inline-block;\n list-style-type: none;\n min-height: 1.4em;\n}\n.itemize > li > span.li_level .math-inline,\n.enumerate > li > span.li_level .math-inline,\n#preview-content .itemize > li > span.li_level .math-inline,\n#setText .itemize > li > span.li_level .math-inline,\n#preview-content .enumerate > li > span.li_level .math-inline,\n#setText .enumerate > li > span.li_level .math-inline {\n display: inline-block;\n}\n";
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.listsStyles = void 0;
|
|
4
|
-
exports.listsStyles = "\n
|
|
4
|
+
exports.listsStyles = "\nol.enumerate, ul.itemize,\n#preview-content ol.enumerate, #setText ol.enumerate,\n#preview-content ul.itemize, #setText ul.itemize {\n padding-inline-start: 40px;\n margin: 0 0 1em 0;\n}\nli > ol.enumerate, li > ul.itemize,\n#preview-content li > ol.enumerate, #setText li > ol.enumerate,\n#preview-content li > ul.itemize, #setText li > ul.itemize {\n margin: 0;\n}\nul.itemize > li,\n#preview-content ul.itemize > li, #setText ul.itemize > li {\n position: relative;\n min-height: 1.4em;\n margin-bottom: 0;\n}\n.enumerate > .li_enumerate,\n#preview-content .enumerate > .li_enumerate, #setText .enumerate > .li_enumerate {\n margin-bottom: 0;\n}\n.itemize > li > span.li_level, .li_enumerate.not_number > span.li_level,\n#preview-content .itemize > li > span.li_level, #setText .itemize > li > span.li_level,\n#preview-content .li_enumerate.not_number > span.li_level, #setText .li_enumerate.not_number > span.li_level {\n position: absolute;\n right: 100%;\n white-space: nowrap;\n width: max-content;\n display: flex;\n justify-content: flex-end;\n padding-right: 10px;\n box-sizing: border-box;\n}\n.li_enumerate.not_number,\n#preview-content .li_enumerate.not_number, #setText .li_enumerate.not_number {\n position: relative;\n display: inline-block;\n list-style-type: none;\n min-height: 1.4em;\n}\n.itemize > li > span.li_level .math-inline,\n.enumerate > li > span.li_level .math-inline,\n#preview-content .itemize > li > span.li_level .math-inline,\n#setText .itemize > li > span.li_level .math-inline,\n#preview-content .enumerate > li > span.li_level .math-inline,\n#setText .enumerate > li > span.li_level .math-inline {\n display: inline-block;\n}\n";
|
|
5
5
|
//# sourceMappingURL=styles-lists.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles-lists.js","sourceRoot":"","sources":["../../src/styles/styles-lists.ts"],"names":[],"mappings":";;;AAAa,QAAA,WAAW,GAAG,
|
|
1
|
+
{"version":3,"file":"styles-lists.js","sourceRoot":"","sources":["../../src/styles/styles-lists.ts"],"names":[],"mappings":";;;AAAa,QAAA,WAAW,GAAG,ypDAiD1B,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const tabularStyles: (useColors?: boolean) => string;
|
|
1
|
+
export declare const tabularStyles: (useColors?: boolean, isPptx?: boolean) => string;
|
|
@@ -1,9 +1,12 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.tabularStyles = void 0;
|
|
4
|
-
var
|
|
4
|
+
var colors_1 = require("./colors");
|
|
5
|
+
var tabularStyles = function (useColors, isPptx) {
|
|
5
6
|
if (useColors === void 0) { useColors = true; }
|
|
6
|
-
|
|
7
|
+
if (isPptx === void 0) { isPptx = false; }
|
|
8
|
+
var cellColors = useColors && !isPptx;
|
|
9
|
+
return "\n.table_tabular,\n#preview-content .table_tabular, #setText .table_tabular {\n overflow-x: auto;\n padding: 0 2px 0.5em 2px;\n}\n.tabular,\n#preview-content .tabular, #setText .tabular {\n display: inline-table !important;\n width: auto;\n table-layout: auto;\n border-collapse: collapse;\n border-spacing: 0;\n margin: 0 0 1em;\n font-size: inherit;\n height: fit-content;\n}\n.tabular th,\n#preview-content .tabular th, #setText .tabular th {\n border: none !important;\n padding: 6px 13px;\n background-color: transparent;\n font-weight: bold;\n}\n.tabular tr,\n#preview-content .tabular tr, #setText .tabular tr {\n border-top: none !important;\n border-bottom: none !important;\n background-color: transparent;\n}\n.tabular td,\n#preview-content .tabular td, #setText .tabular td {\n border-style: none !important;\n ".concat(cellColors ? "background-color: ".concat(colors_1.COLOR_TABULAR_TD_BG, ";") : 'background-color: transparent;', "\n ").concat(cellColors ? "border-color: ".concat(colors_1.COLOR_TABULAR_TD_BORDER, " !important;") : 'border-color: currentColor !important;', "\n word-break: keep-all;\n padding: 0.1em 0.5em !important;\n}\n.tabular td > p,\n#preview-content .tabular td > p, #setText .tabular td > p {\n margin-bottom: 0;\n margin-top: 0;\n}\n.tabular td._empty,\n#preview-content .tabular td._empty, #setText .tabular td._empty {\n height: 1.3em;\n}\n.tabular td .f,\n#preview-content .tabular td .f, #setText .tabular td .f {\n opacity: 0;\n}\n#preview-content .sub-table table, #setText .sub-table table {\n margin-bottom: 0;\n}\nhtml[data-theme=\"dark\"] .tabular tr,\nhtml[data-theme=\"dark\"] #preview-content .tabular tr, html[data-theme=\"dark\"] #setText .tabular tr,\nhtml[data-theme=\"dark\"] .tabular td,\nhtml[data-theme=\"dark\"] #preview-content .tabular td, html[data-theme=\"dark\"] #setText .tabular td {\n ").concat(cellColors ? "background-color: ".concat(colors_1.COLOR_DARK_BG, ";") : 'background-color: transparent;', "\n ").concat(cellColors ? "border-color: ".concat(colors_1.COLOR_DARK_TABULAR_TD_BORDER, " !important;") : 'border-color: currentColor !important;', "\n}\n.figure_img,\n#preview-content .figure_img, #setText .figure_img {\n margin-bottom: 0.5em;\n overflow-x: auto;\n}\ndiv.figure_img img,\n#preview-content div.figure_img img, #setText div.figure_img img {\n ").concat(!isPptx ? 'display: inline;' : '', "\n margin: 0;\n}\n");
|
|
7
10
|
};
|
|
8
11
|
exports.tabularStyles = tabularStyles;
|
|
9
12
|
//# sourceMappingURL=styles-tabular.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles-tabular.js","sourceRoot":"","sources":["../../src/styles/styles-tabular.ts"],"names":[],"mappings":";;;
|
|
1
|
+
{"version":3,"file":"styles-tabular.js","sourceRoot":"","sources":["../../src/styles/styles-tabular.ts"],"names":[],"mappings":";;;AAAA,mCAGkB;AAEX,IAAM,aAAa,GAAG,UAAC,SAAyB,EAAE,MAAuB;IAAlD,0BAAA,EAAA,gBAAyB;IAAE,uBAAA,EAAA,cAAuB;IAC9E,IAAM,UAAU,GAAG,SAAS,IAAI,CAAC,MAAM,CAAC;IACxC,OAAO,o1BAiCL,UAAU,CAAC,CAAC,CAAC,4BAAqB,4BAAmB,MAAG,CAAC,CAAC,CAAC,gCAAgC,iBAC3F,UAAU,CAAC,CAAC,CAAC,wBAAiB,gCAAuB,iBAAc,CAAC,CAAC,CAAC,wCAAwC,mxBAwB9G,UAAU,CAAC,CAAC,CAAC,4BAAqB,sBAAa,MAAG,CAAC,CAAC,CAAC,gCAAgC,iBACrF,UAAU,CAAC,CAAC,CAAC,wBAAiB,qCAA4B,iBAAc,CAAC,CAAC,CAAC,wCAAwC,kOASnH,CAAC,MAAM,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,EAAE,wBAGpC,CAAC;AACF,CAAC,CAAC;AA1EW,QAAA,aAAa,iBA0ExB"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "mathpix-markdown-it",
|
|
3
|
-
"version": "2.0.
|
|
3
|
+
"version": "2.0.37",
|
|
4
4
|
"description": "Mathpix-markdown-it is an open source implementation of the mathpix-markdown spec written in Typescript. It relies on the following open source libraries: MathJax v3 (to render math with SVGs), markdown-it (for standard Markdown parsing)",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"MathJax",
|
|
@@ -0,0 +1,267 @@
|
|
|
1
|
+
# PR: CSS scoping — `#preview-content`/`#setText` specificity boost for all MMD selectors
|
|
2
|
+
|
|
3
|
+
Status: Implemented
|
|
4
|
+
Owner: @OlgaRedozubova
|
|
5
|
+
|
|
6
|
+
---
|
|
7
|
+
|
|
8
|
+
## Context
|
|
9
|
+
|
|
10
|
+
MMD styles use two scoping mechanisms:
|
|
11
|
+
1. **ID selectors** (`#setText h1`, `#preview-content table`) for generic HTML elements — specificity (1,0,1), already beats any host class-based CSS.
|
|
12
|
+
2. **Class selectors** (`.tabular`, `.figure_img`, `.itemize`, `.enumerate`, `.hljs-*`, `.proof`, `.author`, etc.) for MMD-specific elements — were bare, vulnerable to host CSS overrides with equal or higher specificity.
|
|
13
|
+
|
|
14
|
+
When MMD content is embedded on a host page (e.g., `.docs-content table { width: 100% }`), the host styles override MMD class-based rules. This caused tabular tables to stretch, figure alignment to break, list spacing to change, and syntax highlighting colors to be overridden.
|
|
15
|
+
|
|
16
|
+
---
|
|
17
|
+
|
|
18
|
+
## Goal
|
|
19
|
+
|
|
20
|
+
- Boost specificity of all MMD class selectors by adding `#preview-content`/`#setText` scoped variants.
|
|
21
|
+
- Keep bare selectors as fallback for `markdownToHTML()` which returns raw HTML without wrapper.
|
|
22
|
+
- Clean up dead code, fix bugs, restructure style modules for readability.
|
|
23
|
+
- No new wrapper elements, no breaking changes to HTML output or public API signatures.
|
|
24
|
+
|
|
25
|
+
---
|
|
26
|
+
|
|
27
|
+
## Scoping Strategy
|
|
28
|
+
|
|
29
|
+
### Pattern: bare + scoped
|
|
30
|
+
|
|
31
|
+
Every MMD class selector now follows this pattern:
|
|
32
|
+
|
|
33
|
+
```css
|
|
34
|
+
.selector,
|
|
35
|
+
#preview-content .selector, #setText .selector {
|
|
36
|
+
/* styles */
|
|
37
|
+
}
|
|
38
|
+
```
|
|
39
|
+
|
|
40
|
+
- **Bare** (0,1,0) — fallback for `markdownToHTML()` consumers without `#setText`/`#preview-content` wrapper.
|
|
41
|
+
- **Scoped** (1,1,0) — beats host `.docs-content .selector` (0,1,x) when inside containers.
|
|
42
|
+
|
|
43
|
+
### Exceptions (bare only, no scoped)
|
|
44
|
+
|
|
45
|
+
| Selector | Reason |
|
|
46
|
+
|---|---|
|
|
47
|
+
| `.math-block`, `.math-inline`, `.math-error` | `math-` prefix is distinctive enough; no known collisions |
|
|
48
|
+
| `mjx-container` | Custom element, cannot collide with host CSS |
|
|
49
|
+
| `*[data-has-dotfill]`, `*[data-has-dotfill] .dotfill` | `data-` attribute scoping is sufficient |
|
|
50
|
+
| `svg .math-inline`, `svg mjx-container`, etc. | SVG context selectors |
|
|
51
|
+
|
|
52
|
+
### Exceptions (scoped only, no bare)
|
|
53
|
+
|
|
54
|
+
| Selector | Reason |
|
|
55
|
+
|---|---|
|
|
56
|
+
| `code`, `pre code`, `pre`, `table`, `blockquote`, `img`, `sup`, `h1`–`h6` | Generic HTML elements — bare selectors would affect all elements on host page |
|
|
57
|
+
|
|
58
|
+
---
|
|
59
|
+
|
|
60
|
+
## Non-Goals
|
|
61
|
+
|
|
62
|
+
- Adding a `.mmd` wrapper class (rejected: `#setText` already serves as wrapper).
|
|
63
|
+
- Renaming CSS classes `.tabular` → `.mmd-tabular` (rejected: breaking change with no real benefit).
|
|
64
|
+
- Shadow DOM encapsulation.
|
|
65
|
+
|
|
66
|
+
---
|
|
67
|
+
|
|
68
|
+
## Existing Protection (no changes needed)
|
|
69
|
+
|
|
70
|
+
| Element | Protection | Mechanism |
|
|
71
|
+
|---|---|---|
|
|
72
|
+
| Generic `<h1>`–`<h6>`, `<table>`, `<blockquote>`, `<pre>`, `<code>` | `#setText`, `#preview-content` | ID specificity (1,0,1) |
|
|
73
|
+
| `.tabular` display | `display: inline-table !important` | `!important` |
|
|
74
|
+
| `.tabular td` borders, padding | `border-style: none !important`, `padding !important` | `!important` |
|
|
75
|
+
| `.tabular tr` borders | `border-top/bottom: none !important` | `!important` |
|
|
76
|
+
| `<td>` text-align | `style="text-align: ..."` | Inline style |
|
|
77
|
+
| `<ul>/<ol>` list-style-type | `style="list-style-type: ..."` | Inline style |
|
|
78
|
+
| `<blockquote>` margins, padding | `style="margin: ...; padding: ..."` | Inline style (forDocx) |
|
|
79
|
+
|
|
80
|
+
---
|
|
81
|
+
|
|
82
|
+
## Changes by File
|
|
83
|
+
|
|
84
|
+
### `src/styles/index.ts` — restructured into sub-functions
|
|
85
|
+
|
|
86
|
+
Monolithic `MathpixStyle` function split into 10 named sub-functions composed via array join:
|
|
87
|
+
|
|
88
|
+
```typescript
|
|
89
|
+
export const MathpixStyle = (...) => [
|
|
90
|
+
layoutStyles({ setTextAlignJustify, maxWidth, isPptx }),
|
|
91
|
+
mathStyles(maxWidth),
|
|
92
|
+
imageStyles(),
|
|
93
|
+
blockquoteStyles(useColors),
|
|
94
|
+
codeBlockStyles(useColors),
|
|
95
|
+
tableStyles(useColors),
|
|
96
|
+
docStructureStyles(),
|
|
97
|
+
inlineTextStyles(useColors),
|
|
98
|
+
miscStyles(),
|
|
99
|
+
printStyles(),
|
|
100
|
+
].join('');
|
|
101
|
+
```
|
|
102
|
+
|
|
103
|
+
Scoped selectors added for: `.proof`, `.theorem`, `.main-title`, `.author`, `.section-title`, `.abstract`, `.text-url`, `mark`, `span[data-underline-type] mark`, `.smiles`, `div.svg-container`. Bare `h1, h2, ...` in `maxWidth` overflow block scoped as `#setText > h1, #setText > h2, ...`.
|
|
104
|
+
|
|
105
|
+
Dead code removed: `.empty` (never generated), `.preview-right` (used as id, not class), `scaleEquation` parameter (accepted but never used in CSS output).
|
|
106
|
+
|
|
107
|
+
Specificity side-effect fix: `.tabular` had `margin: 0` which at (0,1,0) was overridden by `#setText table { margin-bottom: 1em }` (1,0,1). After scoping, `#setText .tabular` (1,1,0) beats `#setText table` (1,0,1), dropping the margin. Fixed by replacing `margin: 0` with `margin: 0 0 1em` so `.tabular` explicitly declares its own bottom margin. Additionally, `font-size: inherit` and other defensive defaults now ensure `.tabular` renders consistently regardless of context (e.g., standalone vs nested inside a list) — previously, list context could affect table width and font size via cascade.
|
|
108
|
+
|
|
109
|
+
`useColors=false` color leaks fixed: blockquote `border-left`, table `border`, and `mark` `background-color` now gated behind `useColors`.
|
|
110
|
+
|
|
111
|
+
Bug fix: `div.svg-container` child combinator consistency (`>` for both `#preview-content` and `#setText`).
|
|
112
|
+
|
|
113
|
+
### `src/styles/styles-tabular.ts` — replaced `.table_tabular .tabular` with ID scoping
|
|
114
|
+
|
|
115
|
+
Before (commit f0e068a): specificity boosted via `.table_tabular .tabular` compound selector.
|
|
116
|
+
Now: replaced with `#preview-content .tabular, #setText .tabular` — cleaner, consistent with other files.
|
|
117
|
+
|
|
118
|
+
```css
|
|
119
|
+
.tabular,
|
|
120
|
+
#preview-content .tabular, #setText .tabular {
|
|
121
|
+
display: inline-table !important;
|
|
122
|
+
width: auto;
|
|
123
|
+
/* ... */
|
|
124
|
+
}
|
|
125
|
+
```
|
|
126
|
+
|
|
127
|
+
Also scoped: `.table_tabular`, `.tabular th/tr/td/td>p`, `.tabular td._empty`, `.tabular td .f`, `.figure_img`, `div.figure_img img`, dark theme selectors.
|
|
128
|
+
|
|
129
|
+
Note: `.sub-table` rule moved here from `index.ts` (where it didn't belong).
|
|
130
|
+
|
|
131
|
+
### `src/styles/styles-code.ts` — scoped hljs, normalized indentation
|
|
132
|
+
|
|
133
|
+
All 19 `.hljs-*` rule blocks now follow bare + scoped pattern. Indentation normalized to 0/2 (0 for selectors, 2 for properties).
|
|
134
|
+
|
|
135
|
+
### `src/styles/styles-lists.ts` — scoped all selectors
|
|
136
|
+
|
|
137
|
+
All list selectors (`ol.enumerate`, `ul.itemize`, `.li_enumerate`, `.li_level`, `.not_number`) now have bare + scoped variants.
|
|
138
|
+
|
|
139
|
+
### `src/styles/halpers.ts` → `src/styles/helpers.ts` — renamed, cleaned up
|
|
140
|
+
|
|
141
|
+
- Fixed typo in filename: `halpers` → `helpers`
|
|
142
|
+
- Fixed `max-width:` formatting (added space after colon)
|
|
143
|
+
- Added scoped variants for `.math-block`, `.smiles`, `.smiles-inline`, `.table_tabular`
|
|
144
|
+
- Combined h1-h6 `::-webkit-scrollbar` into single `hideScroll()` call
|
|
145
|
+
- Normalized indentation
|
|
146
|
+
|
|
147
|
+
### `src/mathpix-markdown-model/index.ts`
|
|
148
|
+
|
|
149
|
+
- Import path updated: `halpers` → `helpers`
|
|
150
|
+
- Removed `scaleEquation` from `StyleBundleOpts` interface, `buildStyles()`, and all public method signatures
|
|
151
|
+
|
|
152
|
+
### `tests/_styles.js`
|
|
153
|
+
|
|
154
|
+
- Updated `MathpixStyle` calls: removed `scaleEquation` argument
|
|
155
|
+
- Updated `max-width` assertion: `'max-width:800px;'` → `'max-width: 800px;'`
|
|
156
|
+
- Added `t()` trim helper for composition/buildStyles assertions (accounts for `parts.map(s => s.trim()).join('\n')` in `buildStyles`)
|
|
157
|
+
- Added `tabularStyles(isPptx=true)` snapshot test
|
|
158
|
+
- Added `codeStyles(false)` coverage in `getMathpixStyle(useColors=false)` test
|
|
159
|
+
- Added `tabularStyles(true, true)` assertion in `buildStyles isPptx` test
|
|
160
|
+
- All 79 tests pass
|
|
161
|
+
|
|
162
|
+
### Snapshot files
|
|
163
|
+
|
|
164
|
+
All 17 `tests/_data/_styles/*.snap.css` files regenerated (including `tabularStyles-pptx`).
|
|
165
|
+
|
|
166
|
+
---
|
|
167
|
+
|
|
168
|
+
## Style system improvements (from prior commits)
|
|
169
|
+
|
|
170
|
+
### `buildStyles(opts: StyleBundleOpts)` — single style builder
|
|
171
|
+
|
|
172
|
+
All 4 style assembly points (`loadMathJax`, `getMathpixStyleOnly`, `getMathpixStyle`, `getMathpixMarkdownStyles`) delegate to a single `buildStyles()` method.
|
|
173
|
+
|
|
174
|
+
```typescript
|
|
175
|
+
interface StyleBundleOpts {
|
|
176
|
+
setTextAlignJustify?: boolean;
|
|
177
|
+
useColors?: boolean;
|
|
178
|
+
maxWidth?: string;
|
|
179
|
+
isPptx?: boolean;
|
|
180
|
+
resetBody?: boolean;
|
|
181
|
+
container?: boolean;
|
|
182
|
+
mathjax?: boolean;
|
|
183
|
+
code?: boolean; // default: true
|
|
184
|
+
preview?: boolean;
|
|
185
|
+
toc?: boolean;
|
|
186
|
+
tocContainerName?: string;
|
|
187
|
+
menu?: boolean;
|
|
188
|
+
}
|
|
189
|
+
```
|
|
190
|
+
|
|
191
|
+
Module composition per caller:
|
|
192
|
+
|
|
193
|
+
| Module | loadMathJax | getMathpixStyleOnly | getMathpixStyle | getMathpixMarkdownStyles |
|
|
194
|
+
|---|:---:|:---:|:---:|:---:|
|
|
195
|
+
| resetBody | conditional | - | - | - |
|
|
196
|
+
| container | - | - | + | + |
|
|
197
|
+
| mathjax | - | + | + | + |
|
|
198
|
+
| MathpixStyle | + | + | + | + |
|
|
199
|
+
| code | + | + | + | - |
|
|
200
|
+
| tabular | + | + | + | + |
|
|
201
|
+
| lists | + | + | + | + |
|
|
202
|
+
| preview | - | - | if stylePreview | - |
|
|
203
|
+
| toc | + | - | if preview+toc | - |
|
|
204
|
+
| menu+clipboard | + | + | if stylePreview | - |
|
|
205
|
+
|
|
206
|
+
### `loadMathJax` DOM re-injection fix
|
|
207
|
+
|
|
208
|
+
Previously, if `#Mathpix-styles` already existed in the DOM, `loadMathJax()` skipped style update entirely. Now it updates `innerHTML` of the existing element.
|
|
209
|
+
|
|
210
|
+
### `useColors` propagation
|
|
211
|
+
|
|
212
|
+
Added `useColors` parameter to `loadMathJax`, `getMathpixStyleOnly`, `getMathpixStyle` — passed through to all style functions.
|
|
213
|
+
|
|
214
|
+
### `codeStyles` conversion
|
|
215
|
+
|
|
216
|
+
Converted from static string to function accepting `useColors` parameter.
|
|
217
|
+
|
|
218
|
+
### Pre-existing bug fixes
|
|
219
|
+
|
|
220
|
+
- Missing dot: `math-inline svg` → `.math-inline svg` in `@media print`
|
|
221
|
+
- Missing dot: `svg math-block` → `svg .math-block`
|
|
222
|
+
- Missing template interpolation: `#{containerName}` → `#${containerName}` in TocStyle
|
|
223
|
+
- Dead code: removed empty `if (showToc) {}`
|
|
224
|
+
|
|
225
|
+
### CSS output cleanup
|
|
226
|
+
|
|
227
|
+
- All style files normalized to 0/2 indentation (0 spaces for selectors, 2 spaces for properties).
|
|
228
|
+
- `buildStyles` refactored from string concatenation to `parts.map(s => s.trim()).join('\n')` — eliminates blank lines between CSS modules.
|
|
229
|
+
- Removed duplicate `overflow-x: auto` in `mjx-container` rule (was emitted both unconditionally and conditionally when `maxWidth` is set).
|
|
230
|
+
- Color constants extracted into `src/styles/colors.ts` (link, text, border, background, hljs, toc, menu, clipboard colors).
|
|
231
|
+
- `src/contex-menu/styles.ts` and `src/copy-to-clipboard/clipboard-copy-styles.ts` refactored: colors moved to constants, formatting normalized, minor CSS optimizations (`0px` → `0`, padding shorthand).
|
|
232
|
+
|
|
233
|
+
---
|
|
234
|
+
|
|
235
|
+
## Downstream Impact
|
|
236
|
+
|
|
237
|
+
- Consumers that override MMD class selectors (e.g., `#preview-main .tabular { width: 100% }`) at specificity (1,1,0) — same as the new scoped selectors. Consumer styles that load after MMD styles win by cascade order. No breakage expected.
|
|
238
|
+
- Consumers with their own `.math-block`/`.math-inline` SCSS — bare selectors preserved, no breakage.
|
|
239
|
+
- `auto-render.ts` uses `querySelectorAll('.math-inline, .math-block')` — DOM query, not affected by CSS changes.
|
|
240
|
+
|
|
241
|
+
---
|
|
242
|
+
|
|
243
|
+
## Constraints / Invariants
|
|
244
|
+
|
|
245
|
+
- HTML output class names unchanged — no downstream breakage.
|
|
246
|
+
- Public API method signatures changed: `scaleEquation` parameter removed (was unused). Positional callers must shift arguments. `buildStyles(opts)` available as named-parameter alternative.
|
|
247
|
+
- Inherited CSS properties (`font-family`, `color`, `line-height`) intentionally cascade from host into MMD content.
|
|
248
|
+
|
|
249
|
+
---
|
|
250
|
+
|
|
251
|
+
## Done When
|
|
252
|
+
|
|
253
|
+
- [x] All MMD class selectors scoped via `#preview-content`/`#setText` (or justified exception)
|
|
254
|
+
- [x] Defensive defaults for tables, figures, lists
|
|
255
|
+
- [x] `.table_tabular .tabular` replaced with ID scoping
|
|
256
|
+
- [x] hljs selectors scoped in styles-code.ts
|
|
257
|
+
- [x] lists selectors scoped in styles-lists.ts
|
|
258
|
+
- [x] `halpers.ts` → `helpers.ts` rename + cleanup
|
|
259
|
+
- [x] `index.ts` restructured into sub-functions
|
|
260
|
+
- [x] Dead code removed (`scaleEquation`, `.empty`, `.preview-right`)
|
|
261
|
+
- [x] `buildStyles(opts)` single builder with `StyleBundleOpts`
|
|
262
|
+
- [x] `loadMathJax` DOM re-injection fix
|
|
263
|
+
- [x] `useColors` propagated through all style functions
|
|
264
|
+
- [x] Pre-existing bugs fixed
|
|
265
|
+
- [x] Snapshot + composition + buildStyles tests (79 tests)
|
|
266
|
+
- [x] All existing tests pass
|
|
267
|
+
- [x] PR reviewed and merged
|
package/lib/styles/halpers.js
DELETED
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.getMaxWidthStyle = void 0;
|
|
4
|
-
var getMaxWidthStyle = function (maxWidth, isHideScroll) {
|
|
5
|
-
if (maxWidth === void 0) { maxWidth = ''; }
|
|
6
|
-
if (isHideScroll === void 0) { isHideScroll = false; }
|
|
7
|
-
if (!maxWidth) {
|
|
8
|
-
return '';
|
|
9
|
-
}
|
|
10
|
-
return "\n #setText {\n ".concat('max-width:' + maxWidth + ';', "\n }\n #setText > div {\n overflow-x: auto; \n -webkit-overflow-scrolling: touch;\n }\n \n .math-block {\n min-width: unset;\n overflow-x: auto; \n -webkit-overflow-scrolling: touch;\n }\n \n ").concat(isHideScroll ? '#setText > div::-webkit-scrollbar { display: none; }' : '', "\n \n ").concat(isHideScroll ? '#setText > blockquote::-webkit-scrollbar { display: none; }' : '', "\n ").concat(isHideScroll ? '#setText > h1::-webkit-scrollbar { display: none; }' : '', "\n ").concat(isHideScroll ? '#setText > h2::-webkit-scrollbar { display: none; }' : '', "\n ").concat(isHideScroll ? '#setText > h3::-webkit-scrollbar { display: none; }' : '', "\n ").concat(isHideScroll ? '#setText > h4::-webkit-scrollbar { display: none; }' : '', "\n ").concat(isHideScroll ? '#setText > h5::-webkit-scrollbar { display: none; }' : '', "\n ").concat(isHideScroll ? '#setText > h6::-webkit-scrollbar { display: none; }' : '', "\n \n ").concat(isHideScroll ? '.table_tabular::-webkit-scrollbar { display: none; }' : '', "\n \n ").concat(isHideScroll ? 'mjx-container::-webkit-scrollbar { display: none; }' : '', "\n \n mjx-container[jax=\"SVG\"] > svg { \n overflow-x: auto; \n }\n \n ").concat(isHideScroll ? 'mjx-container[jax="SVG"] > svg::-webkit-scrollbar { display: none; }' : '', "\n \n .smiles-inline, .smiles {\n ").concat('max-width:' + maxWidth + ';', "\n overflow-x: auto;\n }\n \n ").concat(isHideScroll ? '.smiles::-webkit-scrollbar { display: none; }' : '', "\n ").concat(isHideScroll ? '.smiles-inline::-webkit-scrollbar { display: none; }' : '', "\n ");
|
|
11
|
-
};
|
|
12
|
-
exports.getMaxWidthStyle = getMaxWidthStyle;
|
|
13
|
-
//# sourceMappingURL=halpers.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"halpers.js","sourceRoot":"","sources":["../../src/styles/halpers.ts"],"names":[],"mappings":";;;AAAO,IAAM,gBAAgB,GAAG,UAAC,QAAqB,EAAE,YAAoB;IAA3C,yBAAA,EAAA,aAAqB;IAAE,6BAAA,EAAA,oBAAoB;IAC1E,IAAI,CAAC,QAAQ,EAAE;QACb,OAAO,EAAE,CAAA;KACV;IACD,OAAO,kCAED,YAAY,GAAG,QAAQ,GAAG,GAAG,8PAa/B,YAAY,CAAC,CAAC,CAAC,uDAAuD,CAAC,CAAC,CAAC,EAAE,yBAE3E,YAAY,CAAC,CAAC,CAAC,8DAA8D,CAAC,CAAC,CAAC,EAAE,mBAClF,YAAY,CAAC,CAAC,CAAC,sDAAsD,CAAC,CAAC,CAAC,EAAE,mBAC1E,YAAY,CAAC,CAAC,CAAC,sDAAsD,CAAC,CAAC,CAAC,EAAE,mBAC1E,YAAY,CAAC,CAAC,CAAC,sDAAsD,CAAC,CAAC,CAAC,EAAE,mBAC1E,YAAY,CAAC,CAAC,CAAC,sDAAsD,CAAC,CAAC,CAAC,EAAE,mBAC1E,YAAY,CAAC,CAAC,CAAC,sDAAsD,CAAC,CAAC,CAAC,EAAE,mBAC1E,YAAY,CAAC,CAAC,CAAC,sDAAsD,CAAC,CAAC,CAAC,EAAE,yBAE1E,YAAY,CAAC,CAAC,CAAC,uDAAuD,CAAC,CAAC,CAAC,EAAE,6BAE3E,YAAY,CAAC,CAAC,CAAC,sDAAsD,CAAC,CAAC,CAAC,EAAE,yGAM1E,YAAY,CAAC,CAAC,CAAC,uEAAuE,CAAC,CAAC,CAAC,EAAE,0DAGzF,YAAY,GAAG,QAAQ,GAAG,GAAG,yDAI/B,YAAY,CAAC,CAAC,CAAC,gDAAgD,CAAC,CAAC,CAAC,EAAE,mBACpE,YAAY,CAAC,CAAC,CAAC,uDAAuD,CAAC,CAAC,CAAC,EAAE,SAC9E,CAAA;AACH,CAAC,CAAC;AA/CW,QAAA,gBAAgB,oBA+C3B"}
|
|
File without changes
|