├── .gitignore ├── .npmignore ├── README.md ├── package.json ├── src ├── admonition.css ├── highlight.css ├── index.css ├── markdown.css ├── syntax.css └── yue.css └── yue.css /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules/ 2 | package-lock.json 3 | -------------------------------------------------------------------------------- /.npmignore: -------------------------------------------------------------------------------- 1 | src/ 2 | node_modules/ 3 | package-lock.json 4 | .gitignore 5 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # yue.css 2 | 3 | 4 | ## Font 5 | 6 | ``` 7 | --yue-f-base 8 | --yue-f-heading 9 | --yue-f-quote 10 | --yue-f-mono 11 | ``` 12 | 13 | ## Color 14 | 15 | ``` 16 | --yue-c-strong 17 | --yue-c-light 18 | --yue-c-accent 19 | --yue-c-divider 20 | 21 | --yue-c-tr 22 | ``` 23 | 24 | ## License 25 | 26 | MIT. 27 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@typlog/yue", 3 | "description": "Readable content stylish.", 4 | "version": "1.1.1", 5 | "author": "Hsiaoming Yang ", 6 | "license": "MIT", 7 | "homepage": "https://github.com/typlog/yue.css" 8 | } 9 | -------------------------------------------------------------------------------- /src/admonition.css: -------------------------------------------------------------------------------- 1 | :root { 2 | --admonition-bg-opacity: 0.03; 3 | --admonition-head-opacity: 0.08; 4 | } 5 | .dark-theme { 6 | --admonition-bg-opacity: 0.1; 7 | --admonition-head-opacity: 0.3; 8 | } 9 | 10 | .admonition { 11 | position: relative; 12 | padding: 0 18px 18px; 13 | margin: 2em 0; 14 | border-left: 4px solid rgb(var(--admonition-color)); 15 | background-color: rgba(var(--admonition-color), var(--admonition-bg-opacity)); 16 | } 17 | .admonition:before { 18 | position: absolute; 19 | content: '#'; 20 | top: 8px; 21 | left: -12px; 22 | color: #fff; 23 | width: 20px; 24 | height: 20px; 25 | border-radius: 100%; 26 | background-color: rgb(var(--admonition-color)); 27 | text-align: center; 28 | font: normal bold 14px/20px "Helvetica Neue",Arial,sans-serif; 29 | } 30 | .admonition-title { 31 | margin: 0 -18px 18px -19px; 32 | padding: 6px 18px; 33 | font-size: .8em; 34 | font-weight: 700; 35 | color: rgb(var(--admonition-color)); 36 | background-color: rgba(var(--admonition-color), var(--admonition-head-opacity)); 37 | } 38 | .admonition p:last-of-type { 39 | margin-bottom: 0; 40 | } 41 | .admonition.attention { 42 | --admonition-color: 247, 89, 171; 43 | } 44 | .admonition.tip, 45 | .admonition.hint { 46 | --admonition-color: 0, 200, 80; 47 | } 48 | .admonition.tip:before { 49 | content: '?'; 50 | } 51 | .admonition.danger, 52 | .admonition.error { 53 | --admonition-color: 255, 92, 47; 54 | } 55 | .admonition.danger:before, 56 | .admonition.error:before { 57 | content: '!'; 58 | } 59 | .admonition.note { 60 | --admonition-color: 3, 169, 244; 61 | } 62 | .admonition.caution { 63 | --admonition-color: 247, 186, 42; 64 | } 65 | .admonition.important { 66 | --admonition-color: 179, 127, 235; 67 | } 68 | .admonition.warning { 69 | --admonition-color: 255, 145, 0; 70 | } 71 | -------------------------------------------------------------------------------- /src/highlight.css: -------------------------------------------------------------------------------- 1 | .highlight { color: var(--syntax-text); background-color: transparent } 2 | .highlight .hll { background-color: var(--syntax-highlight-bg) } 3 | .highlight .c { color: var(--syntax-comment) } /* Comment */ 4 | .highlight .err { color: var(--syntax-invalid-illegal-text); background-color: var(--syntax-invalid-illegal-bg) } /* Error */ 5 | .highlight .g { color: var(--syntax-meta) } /* Generic */ 6 | .highlight .k { color: var(--syntax-keyword) } /* Keyword */ 7 | .highlight .l { color: var(--syntax-meta) } /* Literal */ 8 | .highlight .o { color: var(--syntax-constant) } /* Operator */ 9 | .highlight .x { color: var(--syntax-meta) } /* Other */ 10 | .highlight .cm { color: var(--syntax-comment) } /* Comment.Multiline */ 11 | .highlight .cp { color: var(--syntax-constant) } /* Comment.Preproc */ 12 | .highlight .c1 { color: var(--syntax-comment) } /* Comment.Single */ 13 | .highlight .cs { color: var(--syntax-comment); background-color: var(--syntax-special-bg) } /* Comment.Special */ 14 | .highlight .gd { color: var(--syntax-markup-deleted-text); background-color: var(--syntax-markup-deleted-bg) } /* Generic.Deleted */ 15 | .highlight .ge { color: var(--syntax-markup-italic); font-style: italic } /* Generic.Emph */ 16 | .highlight .gr { color: var(--syntax-invalid-illegal-text); background-color: var(--syntax-invalid-illegal-bg) } /* Generic.Error */ 17 | .highlight .gh { color: var(--syntax-markup-heading) } /* Generic.Heading */ 18 | .highlight .gi { color: var(--syntax-markup-inserted-text); background-color: var(--syntax-markup-inserted-bg) } /* Generic.Inserted */ 19 | .highlight .go { color: var(--syntax-meta) } /* Generic.Output */ 20 | .highlight .gp { color: var(--syntax-meta) } /* Generic.Prompt */ 21 | .highlight .gs { color: var(--syntax-markup-bold); font-weight: bold } /* Generic.Strong */ 22 | .highlight .gu { color: var(--syntax-markup-heading) } /* Generic.Subheading */ 23 | .highlight .gt { color: var(--syntax-meta) } /* Generic.Traceback */ 24 | .highlight .kc { color: var(--syntax-constant) } /* Keyword.Constant */ 25 | .highlight .kd { color: var(--syntax-keyword) } /* Keyword.Declaration */ 26 | .highlight .kn { color: var(--syntax-keyword) } /* Keyword.Namespace */ 27 | .highlight .kp { color: var(--syntax-keyword) } /* Keyword.Pseudo */ 28 | .highlight .kr { color: var(--syntax-keyword) } /* Keyword.Reserved */ 29 | .highlight .kt { color: var(--syntax-entity) } /* Keyword.Type */ 30 | .highlight .ld { color: var(--syntax-meta) } /* Literal.Date */ 31 | .highlight .m { color: var(--syntax-constant) } /* Literal.Number */ 32 | .highlight .s { color: var(--syntax-string) } /* Literal.String */ 33 | .highlight .il { color: var(--syntax-constant) } /* Literal.Number.Integer.Long */ 34 | .highlight .na { color: var(--syntax-constant) } /* Name.Attribute */ 35 | .highlight .nb { color: var(--syntax-builtin) } /* Name.Builtin */ 36 | .highlight .nc { color: var(--syntax-definition) } /* Name.Class */ 37 | .highlight .no { color: var(--syntax-constant) } /* Name.Constant */ 38 | .highlight .nd { color: var(--syntax-entity) } /* Name.Decorator */ 39 | .highlight .ni { color: var(--syntax-entity) } /* Name.Entity */ 40 | .highlight .ne { color: var(--syntax-exception) } /* Name.Exception */ 41 | .highlight .nf { color: var(--syntax-definition) } /* Name.Function */ 42 | .highlight .nt { color: var(--syntax-tag) } /* Name.Tag */ 43 | .highlight .ow { color: var(--syntax-constant) } /* Operator.Word */ 44 | .highlight .w { color: var(--syntax-meta) } /* Text.Whitespace */ 45 | .highlight .mf { color: var(--syntax-constant) } /* Literal.Number.Float */ 46 | .highlight .mh { color: var(--syntax-constant) } /* Literal.Number.Hex */ 47 | .highlight .mi { color: var(--syntax-constant) } /* Literal.Number.Integer */ 48 | .highlight .mo { color: var(--syntax-constant) } /* Literal.Number.Oct */ 49 | .highlight .sb { color: var(--syntax-meta) } /* Literal.String.Backtick */ 50 | .highlight .sc { color: var(--syntax-string) } /* Literal.String.Char */ 51 | .highlight .sd { color: var(--syntax-comment) } /* Literal.String.Doc */ 52 | .highlight .s2 { color: var(--syntax-string) } /* Literal.String.Double */ 53 | .highlight .se { color: var(--syntax-string) } /* Literal.String.Escape */ 54 | .highlight .sh { color: var(--syntax-comment) } /* Literal.String.Heredoc */ 55 | .highlight .si { color: var(--syntax-string) } /* Literal.String.Interpol */ 56 | .highlight .sx { color: var(--syntax-string) } /* Literal.String.Other */ 57 | .highlight .sr { color: var(--syntax-regexp) } /* Literal.String.Regex */ 58 | .highlight .s1 { color: var(--syntax-string) } /* Literal.String.Single */ 59 | .highlight .ss { color: var(--syntax-string) } /* Literal.String.Symbol */ 60 | .highlight .bp { color: var(--syntax-variable) } /* Name.Builtin.Pseudo */ 61 | .highlight .vc { color: var(--syntax-variable) } /* Name.Variable.Class */ 62 | .highlight .vg { color: var(--syntax-variable) } /* Name.Variable.Global */ 63 | .highlight .vi { color: var(--syntax-variable) } /* Name.Variable.Instance */ 64 | -------------------------------------------------------------------------------- /src/index.css: -------------------------------------------------------------------------------- 1 | @import "./yue.css"; 2 | @import "./markdown.css"; 3 | @import "./admonition.css"; 4 | @import "./syntax.css"; 5 | @import "./highlight.css"; 6 | -------------------------------------------------------------------------------- /src/markdown.css: -------------------------------------------------------------------------------- 1 | .block-table { 2 | overflow: auto; 3 | } 4 | .block-table table { 5 | width: 100%; 6 | max-width: 100%; 7 | border-collapse: collapse; 8 | border-spacing: 0; 9 | margin-bottom: 1.5em; 10 | font-size: 0.96em; 11 | box-sizing: border-box; 12 | } 13 | .block-table th, 14 | .block-table td { 15 | text-align: left; 16 | padding: 8px; 17 | } 18 | .block-table td { 19 | vertical-align: top; 20 | } 21 | .block-table tr { 22 | border-bottom: 1px solid var(--yue-c-tr); 23 | } 24 | .block-table thead tr { 25 | border-width: 2px; 26 | } 27 | .block-table tbody tr:last-child { 28 | border-bottom: 0; 29 | } 30 | .block-table thead th:first-child, 31 | .block-table tbody td:first-child { 32 | padding-left: 0; 33 | } 34 | .block-table thead th:last-child, 35 | .block-table tbody td:last-child { 36 | padding-right: 0; 37 | } 38 | 39 | .block-html { 40 | margin-bottom: 1.5em; 41 | overflow: auto; 42 | } 43 | 44 | .yue .footnotes { 45 | font-size: 80%; 46 | line-height: 1.32; 47 | opacity: 0.96; 48 | } 49 | 50 | .yue .footnotes:before { 51 | content: ''; 52 | display: block; 53 | border-top: 4px solid var(--yue-c-divider); 54 | width: 50%; 55 | max-width: 100px; 56 | margin: 40px 0 20px; 57 | } 58 | 59 | .yue li.task-item { 60 | list-style-type: none; 61 | } 62 | .yue .task-item input[type="checkbox"] { 63 | margin: 0 0.3em 0.4em -1em; 64 | vertical-align: middle; 65 | } 66 | 67 | .block-code { 68 | position: relative; 69 | margin-top: 1.6em; 70 | margin-bottom: 1.6em; 71 | --radius: 6px; 72 | --margin: 1rem; 73 | } 74 | 75 | .block-code::after { 76 | position: absolute; 77 | content: attr(data-language); 78 | top: 0.4rem; 79 | right: 0.5rem; 80 | font-size: 10px; 81 | font-weight: 600; 82 | font-family: var(--yue-f-mono); 83 | color: var(--syntax-text); 84 | opacity: 0.6; 85 | } 86 | 87 | .block-code .math { 88 | overflow: auto; 89 | } 90 | 91 | .block-code > pre, 92 | .highlight > pre { 93 | margin: 0; 94 | overflow: auto; 95 | color: var(--syntax-text); 96 | background-color: var(--syntax-pre-bg); 97 | } 98 | .block-code > pre { 99 | padding: 1em 1.2em; 100 | } 101 | .highlight > pre { 102 | padding: 1.4em 0 1.3em; 103 | } 104 | .highlight > pre > code { 105 | display: inline-block; 106 | min-width: 100%; 107 | } 108 | .highlight > pre .line { 109 | padding-left: 1.5em; 110 | padding-right: 1.5em; 111 | } 112 | 113 | .highlight-table { 114 | overflow: hidden; 115 | } 116 | table.highlight { 117 | margin: 0; 118 | border-radius: 0; 119 | border-collapse: collapse; 120 | width: 100%; 121 | } 122 | table.highlight tr { 123 | border: 0; 124 | } 125 | table.highlight td { 126 | padding: 0 0.8rem; 127 | border: 0; 128 | } 129 | table.highlight td[data-line] { 130 | text-align: right; 131 | width: 1px; 132 | padding: 0 0.5rem; 133 | box-shadow: -.05rem 0 var(--syntax-cap-bg) inset; 134 | } 135 | table.highlight td[data-line]:before { 136 | content: attr(data-line); 137 | opacity: 0.5; 138 | } 139 | .highlight-table > pre { 140 | padding: 0.8rem 0; 141 | background-color: var(--syntax-pre-bg); 142 | border-radius: var(--radius); 143 | } 144 | .highlight-table table.highlight tr { 145 | background-color: transparent; 146 | } 147 | .code-head { 148 | background-color: var(--syntax-cap-bg); 149 | padding: .4rem var(--margin); 150 | border-radius: var(--radius) var(--radius) 0 0; 151 | } 152 | .code-head pre { 153 | margin: 0; 154 | border: 0; 155 | font-size: .84rem; 156 | font-weight: 600; 157 | color: var(--syntax-text); 158 | font-family: var(--yue-f-text); 159 | } 160 | .code-head + .highlight > pre, 161 | .code-head + .highlight-table > pre { 162 | border-top-left-radius: 0; 163 | border-top-right-radius: 0; 164 | } 165 | .highlight-table pre { 166 | margin: 0; 167 | overflow: auto; 168 | } 169 | -------------------------------------------------------------------------------- /src/syntax.css: -------------------------------------------------------------------------------- 1 | :root { 2 | --syntax-light-pre-bg: #ecf5ff; 3 | --syntax-light-cap-bg: #d6e7fb; 4 | --syntax-light-text: #24292f; 5 | --syntax-light-meta: #a6a2ae; 6 | --syntax-light-comment: #6e7781; 7 | --syntax-light-constant: #0550ae; 8 | --syntax-light-entity: #268bd2; 9 | --syntax-light-property: #8250df; 10 | --syntax-light-definition: #24292f; 11 | --syntax-light-tag: #085; 12 | --syntax-light-builtin: #b58900; 13 | --syntax-light-keyword: #cf222e; 14 | --syntax-light-exception: #e6212e; 15 | --syntax-light-string: #0a3069; 16 | --syntax-light-regexp: #e40; 17 | --syntax-light-variable: #a4480f; 18 | --syntax-light-invalid-illegal-text: #f6f8fa; 19 | --syntax-light-invalid-illegal-bg: #82071e; 20 | --syntax-light-markup-heading: #0550ae; 21 | --syntax-light-markup-italic: #24292f; 22 | --syntax-light-markup-bold: #24292f; 23 | --syntax-light-markup-deleted-text: #82071e; 24 | --syntax-light-markup-deleted-bg: #FFEBE9; 25 | --syntax-light-markup-inserted-text: #116329; 26 | --syntax-light-markup-inserted-bg: #dafbe1; 27 | --syntax-light-markup-changed-text: #953800; 28 | --syntax-light-markup-changed-bg: #ffd8b5; 29 | --syntax-light-markup-ignored-text: #eaeef2; 30 | --syntax-light-markup-ignored-bg: #0550ae; 31 | --syntax-light-meta-diff-range: #8250df; 32 | --syntax-light-highlight-bg: #dbecff; 33 | --syntax-light-special-bg: #dccafa; 34 | 35 | --syntax-dark-pre-bg: #1a2b3e; 36 | --syntax-dark-cap-bg: #223e5e; 37 | --syntax-dark-text: #c9d1d9; 38 | --syntax-dark-meta: #6e7781; 39 | --syntax-dark-comment: #8b949e; 40 | --syntax-dark-constant: #79c0ff; 41 | --syntax-dark-entity: #47b0fa; 42 | --syntax-dark-property: #d2a8ff; 43 | --syntax-dark-definition: #c9d1d9; 44 | --syntax-dark-tag: #7ee787; 45 | --syntax-dark-builtin: #ffd34c; 46 | --syntax-dark-keyword: #ff7b72; 47 | --syntax-dark-exception: #da473c; 48 | --syntax-dark-string: #a5d6ff; 49 | --syntax-dark-regexp: #ef954e; 50 | --syntax-dark-variable: #ffa657; 51 | --syntax-dark-invalid-illegal-text: #f0f6fc; 52 | --syntax-dark-invalid-illegal-bg: #8e1519; 53 | --syntax-dark-markup-heading: #1f6feb; 54 | --syntax-dark-markup-italic: #c9d1d9; 55 | --syntax-dark-markup-bold: #c9d1d9; 56 | --syntax-dark-markup-deleted-text: #ffdcd7; 57 | --syntax-dark-markup-deleted-bg: #67060c; 58 | --syntax-dark-markup-inserted-text: #aff5b4; 59 | --syntax-dark-markup-inserted-bg: #033a16; 60 | --syntax-dark-markup-changed-text: #ffdfb6; 61 | --syntax-dark-markup-changed-bg: #5a1e02; 62 | --syntax-dark-markup-ignored-text: #c9d1d9; 63 | --syntax-dark-markup-ignored-bg: #1158c7; 64 | --syntax-dark-meta-diff-range: #d2a8ff; 65 | --syntax-dark-highlight-bg: #091c33; 66 | --syntax-dark-special-bg: #4f425d; 67 | } 68 | 69 | :root, 70 | html.light, 71 | html.light-theme { 72 | --syntax-pre-bg: var(--syntax-light-pre-bg); 73 | --syntax-cap-bg: var(--syntax-light-cap-bg); 74 | --syntax-text: var(--syntax-light-text); 75 | --syntax-meta: var(--syntax-light-meta); 76 | --syntax-comment: var(--syntax-light-comment); 77 | --syntax-constant: var(--syntax-light-constant); 78 | --syntax-entity: var(--syntax-light-entity); 79 | --syntax-property: var(--syntax-light-property); 80 | --syntax-definition: var(--syntax-light-definition); 81 | --syntax-tag: var(--syntax-light-tag); 82 | --syntax-builtin: var(--syntax-light-builtin); 83 | --syntax-keyword: var(--syntax-light-keyword); 84 | --syntax-exception: var(--syntax-light-exception); 85 | --syntax-string: var(--syntax-light-string); 86 | --syntax-regexp: var(--syntax-light-regexp); 87 | --syntax-variable: var(--syntax-light-variable); 88 | --syntax-invalid-illegal-text: var(--syntax-light-invalid-illegal-text); 89 | --syntax-invalid-illegal-bg: var(--syntax-light-invalid-illegal-bg); 90 | --syntax-markup-heading: var(--syntax-light-markup-heading); 91 | --syntax-markup-italic: var(--syntax-light-markup-italic); 92 | --syntax-markup-bold: var(--syntax-light-markup-bold); 93 | --syntax-markup-deleted-text: var(--syntax-light-markup-deleted-text); 94 | --syntax-markup-deleted-bg: var(--syntax-light-markup-deleted-bg); 95 | --syntax-markup-inserted-text: var(--syntax-light-markup-inserted-text); 96 | --syntax-markup-inserted-bg: var(--syntax-light-markup-inserted-bg); 97 | --syntax-markup-changed-text: var(--syntax-light-markup-changed-text); 98 | --syntax-markup-changed-bg: var(--syntax-light-markup-changed-bg); 99 | --syntax-markup-ignored-text: var(--syntax-light-markup-ignored-text); 100 | --syntax-markup-ignored-bg: var(--syntax-light-markup-ignored-bg); 101 | --syntax-meta-diff-range: var(--syntax-light-meta-diff-range); 102 | --syntax-highlight-bg: var(--syntax-light-highlight-bg); 103 | --syntax-special-bg: var(--syntax-light-special-bg); 104 | } 105 | 106 | @media (prefers-color-scheme: dark) { 107 | :root { 108 | --syntax-pre-bg: var(--syntax-dark-pre-bg); 109 | --syntax-cap-bg: var(--syntax-dark-cap-bg); 110 | --syntax-text: var(--syntax-dark-text); 111 | --syntax-meta: var(--syntax-dark-meta); 112 | --syntax-comment: var(--syntax-dark-comment); 113 | --syntax-constant: var(--syntax-dark-constant); 114 | --syntax-entity: var(--syntax-dark-entity); 115 | --syntax-property: var(--syntax-dark-property); 116 | --syntax-definition: var(--syntax-dark-definition); 117 | --syntax-tag: var(--syntax-dark-tag); 118 | --syntax-builtin: var(--syntax-dark-builtin); 119 | --syntax-keyword: var(--syntax-dark-keyword); 120 | --syntax-exception: var(--syntax-dark-exception); 121 | --syntax-string: var(--syntax-dark-string); 122 | --syntax-regexp: var(--syntax-dark-regexp); 123 | --syntax-variable: var(--syntax-dark-variable); 124 | --syntax-invalid-illegal-text: var(--syntax-dark-invalid-illegal-text); 125 | --syntax-invalid-illegal-bg: var(--syntax-dark-invalid-illegal-bg); 126 | --syntax-markup-heading: var(--syntax-dark-markup-heading); 127 | --syntax-markup-italic: var(--syntax-dark-markup-italic); 128 | --syntax-markup-bold: var(--syntax-dark-markup-bold); 129 | --syntax-markup-deleted-text: var(--syntax-dark-markup-deleted-text); 130 | --syntax-markup-deleted-bg: var(--syntax-dark-markup-deleted-bg); 131 | --syntax-markup-inserted-text: var(--syntax-dark-markup-inserted-text); 132 | --syntax-markup-inserted-bg: var(--syntax-dark-markup-inserted-bg); 133 | --syntax-markup-changed-text: var(--syntax-dark-markup-changed-text); 134 | --syntax-markup-changed-bg: var(--syntax-dark-markup-changed-bg); 135 | --syntax-markup-ignored-text: var(--syntax-dark-markup-ignored-text); 136 | --syntax-markup-ignored-bg: var(--syntax-dark-markup-ignored-bg); 137 | --syntax-meta-diff-range: var(--syntax-dark-meta-diff-range); 138 | --syntax-highlight-bg: var(--syntax-dark-highlight-bg); 139 | --syntax-special-bg: var(--syntax-dark-special-bg); 140 | } 141 | } 142 | 143 | html.dark, 144 | html.dark-theme, 145 | .dark-code { 146 | --syntax-pre-bg: var(--syntax-dark-pre-bg); 147 | --syntax-cap-bg: var(--syntax-dark-cap-bg); 148 | --syntax-text: var(--syntax-dark-text); 149 | --syntax-meta: var(--syntax-dark-meta); 150 | --syntax-comment: var(--syntax-dark-comment); 151 | --syntax-constant: var(--syntax-dark-constant); 152 | --syntax-entity: var(--syntax-dark-entity); 153 | --syntax-property: var(--syntax-dark-property); 154 | --syntax-definition: var(--syntax-dark-definition); 155 | --syntax-tag: var(--syntax-dark-tag); 156 | --syntax-builtin: var(--syntax-dark-builtin); 157 | --syntax-keyword: var(--syntax-dark-keyword); 158 | --syntax-exception: var(--syntax-dark-exception); 159 | --syntax-string: var(--syntax-dark-string); 160 | --syntax-regexp: var(--syntax-dark-regexp); 161 | --syntax-variable: var(--syntax-dark-variable); 162 | --syntax-invalid-illegal-text: var(--syntax-dark-invalid-illegal-text); 163 | --syntax-invalid-illegal-bg: var(--syntax-dark-invalid-illegal-bg); 164 | --syntax-markup-heading: var(--syntax-dark-markup-heading); 165 | --syntax-markup-italic: var(--syntax-dark-markup-italic); 166 | --syntax-markup-bold: var(--syntax-dark-markup-bold); 167 | --syntax-markup-deleted-text: var(--syntax-dark-markup-deleted-text); 168 | --syntax-markup-deleted-bg: var(--syntax-dark-markup-deleted-bg); 169 | --syntax-markup-inserted-text: var(--syntax-dark-markup-inserted-text); 170 | --syntax-markup-inserted-bg: var(--syntax-dark-markup-inserted-bg); 171 | --syntax-markup-changed-text: var(--syntax-dark-markup-changed-text); 172 | --syntax-markup-changed-bg: var(--syntax-dark-markup-changed-bg); 173 | --syntax-markup-ignored-text: var(--syntax-dark-markup-ignored-text); 174 | --syntax-markup-ignored-bg: var(--syntax-dark-markup-ignored-bg); 175 | --syntax-meta-diff-range: var(--syntax-dark-meta-diff-range); 176 | --syntax-highlight-bg: var(--syntax-dark-highlight-bg); 177 | --syntax-special-bg: var(--syntax-dark-special-bg); 178 | } 179 | -------------------------------------------------------------------------------- /src/yue.css: -------------------------------------------------------------------------------- 1 | .yue { 2 | font-family: var(--yue-f-base); 3 | } 4 | .yue h1, 5 | .yue h2, 6 | .yue h3, 7 | .yue h4, 8 | .yue h5, 9 | .yue h6 { 10 | font-family: var(--yue-f-heading); 11 | color: var(--yue-c-strong); 12 | } 13 | 14 | .yue h1 { 15 | font-weight: 700; 16 | font-size: 1.8em; 17 | margin: 0 0 3em; 18 | } 19 | 20 | .yue h2 { 21 | font-weight: 700; 22 | font-size: 1.42em; 23 | margin-top: 1.42em; 24 | margin-bottom: 0.4em; 25 | } 26 | 27 | .yue h3 { 28 | font-size: 1.17em; 29 | margin-top: 1.62em; 30 | margin-bottom: 1em; 31 | } 32 | 33 | .yue h4, 34 | .yue h5, 35 | .yue h6 { 36 | font-size: 1em; 37 | margin-top: 1.4em; 38 | margin-bottom: 0.8em; 39 | } 40 | 41 | .yue h6 { 42 | font-weight: 500; 43 | } 44 | 45 | .yue p { 46 | margin-top: 0; 47 | margin-bottom: 1.12em; 48 | hyphens: auto; 49 | } 50 | 51 | .yue h1 a, .yue h2 a, .yue h3 a { 52 | text-decoration: none; 53 | } 54 | 55 | .yue strong, 56 | .yue b { 57 | font-weight: 700; 58 | color: var(--yue-c-strong); 59 | } 60 | 61 | .yue em, 62 | .yue i { 63 | font-style: italic; 64 | color: var(--yue-c-strong); 65 | } 66 | 67 | .yue a img { 68 | border: none; 69 | vertical-align: middle; 70 | } 71 | 72 | .yue a { 73 | color: var(--yue-c-accent); 74 | text-decoration: none; 75 | } 76 | 77 | .yue a:hover { 78 | text-decoration: underline; 79 | } 80 | 81 | .yue figure { 82 | margin: 0; 83 | } 84 | .yue figcaption { 85 | margin-top: 4px; 86 | font-size: 13px; 87 | text-align: center; 88 | color: var(--yue-c-light); 89 | } 90 | .yue figcaption a { 91 | color: var(--yue-c-light); 92 | } 93 | .yue figcaption a:hover { 94 | color: var(--yue-c-accent); 95 | } 96 | 97 | .yue hr { 98 | display: block; 99 | width: 90%; 100 | max-width: 100px; 101 | border: 0; 102 | border-top: 5px solid var(--yue-c-divider); 103 | margin: 2.4em auto; 104 | } 105 | 106 | .yue blockquote { 107 | position: relative; 108 | margin: 0 0 1.64em 0; 109 | padding: 34px 1em 0.1em 20px; 110 | font-size: 1.12em; 111 | font-family: var(--yue-f-quote); 112 | border-left: 4px solid var(--yue-c-accent); 113 | } 114 | .yue blockquote::before { 115 | content: '\201c'; 116 | position: absolute; 117 | top: 0; 118 | left: 20px; 119 | color: var(--yue-c-accent); 120 | font: bold 48px/1 "Times New Roman", Georgia, Palatino, Times, serif; 121 | } 122 | 123 | .yue ul, 124 | .yue ol { 125 | margin: 0 0 24px 6px; 126 | padding-left: 16px; 127 | } 128 | 129 | .yue li { 130 | margin-bottom: 0.2em; 131 | } 132 | 133 | .yue li ul, 134 | .yue li ol { 135 | margin-top: 0; 136 | margin-bottom: 0; 137 | } 138 | 139 | .yue li p { 140 | margin: 0.4em 0 0.6em; 141 | } 142 | 143 | .yue li > code, 144 | .yue p > code, 145 | .yue p > tt { 146 | font-size: 0.86em; 147 | font-family: var(--yue-f-mono); 148 | font-weight: 600; 149 | padding: 1px 3px; 150 | word-wrap: break-word; 151 | border-radius: 2px; 152 | } 153 | 154 | .yue pre { 155 | font-family: var(--yue-f-mono); 156 | } 157 | 158 | .yue iframe { 159 | display: block; 160 | max-width: 100%; 161 | margin-bottom: 1.5em; 162 | } 163 | 164 | .yue figure iframe { 165 | margin: auto; 166 | } 167 | 168 | :lang(zh) .yue em, 169 | :lang(zh-hant) .yue em, 170 | :lang(zh-hans) .yue em, 171 | :lang(ja) .yue em { 172 | font-style: normal; 173 | text-emphasis: filled dot var(--yue-c-light); 174 | text-emphasis-position: under; 175 | } 176 | .yue em:lang(en) { 177 | font-style: italic !important; 178 | text-emphasis: none !important; 179 | } 180 | -------------------------------------------------------------------------------- /yue.css: -------------------------------------------------------------------------------- 1 | .yue{font-family:var(--yue-f-base)}.yue h1,.yue h2,.yue h3,.yue h4,.yue h5,.yue h6{font-family:var(--yue-f-heading);color:var(--yue-c-strong)}.yue h1{font-weight:700;font-size:1.8em;margin:0 0 3em}.yue h2{font-weight:700;font-size:1.42em;margin-top:1.42em;margin-bottom:.4em}.yue h3{font-size:1.17em;margin-top:1.62em;margin-bottom:1em}.yue h4,.yue h5,.yue h6{font-size:1em;margin-top:1.4em;margin-bottom:.8em}.yue h6{font-weight:500}.yue p{margin-top:0;margin-bottom:1.12em;hyphens:auto}.yue h1 a,.yue h2 a,.yue h3 a{text-decoration:none}.yue strong,.yue b{font-weight:700;color:var(--yue-c-strong)}.yue em,.yue i{font-style:italic;color:var(--yue-c-strong)}.yue a img{border:none;vertical-align:middle}.yue a{color:var(--yue-c-accent);text-decoration:none}.yue a:hover{text-decoration:underline}.yue figure{margin:0}.yue figcaption{margin-top:4px;font-size:13px;text-align:center;color:var(--yue-c-light)}.yue figcaption a{color:var(--yue-c-light)}.yue figcaption a:hover{color:var(--yue-c-accent)}.yue hr{display:block;width:90%;max-width:100px;border:0;border-top:5px solid var(--yue-c-divider);margin:2.4em auto}.yue blockquote{position:relative;margin:0 0 1.64em;padding:34px 1em .1em 20px;font-size:1.12em;font-family:var(--yue-f-quote);border-left:4px solid var(--yue-c-accent)}.yue blockquote:before{content:"\201c";position:absolute;top:0;left:20px;color:var(--yue-c-accent);font:700 48px/1 Times New Roman,Georgia,Palatino,Times,serif}.yue ul,.yue ol{margin:0 0 24px 6px;padding-left:16px}.yue li{margin-bottom:.2em}.yue li ul,.yue li ol{margin-top:0;margin-bottom:0}.yue li p{margin:.4em 0 .6em}.yue li>code,.yue p>code,.yue p>tt{font-size:.86em;font-family:var(--yue-f-mono);font-weight:600;padding:1px 3px;word-wrap:break-word;border-radius:2px}.yue pre{font-family:var(--yue-f-mono)}.yue iframe{display:block;max-width:100%;margin-bottom:1.5em}.yue figure iframe{margin:auto}:lang(zh) .yue em,:lang(zh-hant) .yue em,:lang(zh-hans) .yue em,:lang(ja) .yue em{font-style:normal;text-emphasis:filled dot var(--yue-c-light);text-emphasis-position:under}.yue em:lang(en){font-style:italic!important;text-emphasis:none!important}.block-table{overflow:auto}.block-table table{width:100%;max-width:100%;border-collapse:collapse;border-spacing:0;margin-bottom:1.5em;font-size:.96em;box-sizing:border-box}.block-table th,.block-table td{text-align:left;padding:8px}.block-table td{vertical-align:top}.block-table tr{border-bottom:1px solid var(--yue-c-tr)}.block-table thead tr{border-width:2px}.block-table tbody tr:last-child{border-bottom:0}.block-table thead th:first-child,.block-table tbody td:first-child{padding-left:0}.block-table thead th:last-child,.block-table tbody td:last-child{padding-right:0}.block-html{margin-bottom:1.5em;overflow:auto}.yue .footnotes{font-size:80%;line-height:1.32;opacity:.96}.yue .footnotes:before{content:"";display:block;border-top:4px solid var(--yue-c-divider);width:50%;max-width:100px;margin:40px 0 20px}.yue li.task-item{list-style-type:none}.yue .task-item input[type=checkbox]{margin:0 .3em .4em -1em;vertical-align:middle}.block-code{position:relative;margin-top:1.6em;margin-bottom:1.6em;--radius: 6px;--margin: 1rem}.block-code:after{position:absolute;content:attr(data-language);top:.4rem;right:.5rem;font-size:10px;font-weight:600;font-family:var(--yue-f-mono);color:var(--syntax-text);opacity:.6}.block-code .math{overflow:auto}.block-code>pre,.highlight>pre{margin:0;overflow:auto;color:var(--syntax-text);background-color:var(--syntax-pre-bg)}.block-code>pre{padding:1em 1.2em}.highlight>pre{padding:1.4em 0 1.3em}.highlight>pre>code{display:inline-block;min-width:100%}.highlight>pre .line{padding-left:1.5em;padding-right:1.5em}.highlight-table{overflow:hidden}table.highlight{margin:0;border-radius:0;border-collapse:collapse;width:100%}table.highlight tr{border:0}table.highlight td{padding:0 .8rem;border:0}table.highlight td[data-line]{text-align:right;width:1px;padding:0 .5rem;box-shadow:-.05rem 0 var(--syntax-cap-bg) inset}table.highlight td[data-line]:before{content:attr(data-line);opacity:.5}.highlight-table>pre{padding:.8rem 0;background-color:var(--syntax-pre-bg);border-radius:var(--radius)}.highlight-table table.highlight tr{background-color:transparent}.code-head{background-color:var(--syntax-cap-bg);padding:.4rem var(--margin);border-radius:var(--radius) var(--radius) 0 0}.code-head pre{margin:0;border:0;font-size:.84rem;font-weight:600;color:var(--syntax-text);font-family:var(--yue-f-text)}.code-head+.highlight>pre,.code-head+.highlight-table>pre{border-top-left-radius:0;border-top-right-radius:0}.highlight-table pre{margin:0;overflow:auto}:root{--admonition-bg-opacity: .03;--admonition-head-opacity: .08}.dark-theme{--admonition-bg-opacity: .1;--admonition-head-opacity: .3}.admonition{position:relative;padding:0 18px 18px;margin:2em 0;border-left:4px solid rgb(var(--admonition-color));background-color:rgba(var(--admonition-color),var(--admonition-bg-opacity))}.admonition:before{position:absolute;content:"#";top:8px;left:-12px;color:#fff;width:20px;height:20px;border-radius:100%;background-color:rgb(var(--admonition-color));text-align:center;font: 700 14px/20px Helvetica Neue,Arial,sans-serif}.admonition-title{margin:0 -18px 18px -19px;padding:6px 18px;font-size:.8em;font-weight:700;color:rgb(var(--admonition-color));background-color:rgba(var(--admonition-color),var(--admonition-head-opacity))}.admonition p:last-of-type{margin-bottom:0}.admonition.attention{--admonition-color: 247, 89, 171}.admonition.tip,.admonition.hint{--admonition-color: 0, 200, 80}.admonition.tip:before{content:"?"}.admonition.danger,.admonition.error{--admonition-color: 255, 92, 47}.admonition.danger:before,.admonition.error:before{content:"!"}.admonition.note{--admonition-color: 3, 169, 244}.admonition.caution{--admonition-color: 247, 186, 42}.admonition.important{--admonition-color: 179, 127, 235}.admonition.warning{--admonition-color: 255, 145, 0}:root{--syntax-light-pre-bg: #ecf5ff;--syntax-light-cap-bg: #d6e7fb;--syntax-light-text: #24292f;--syntax-light-meta: #a6a2ae;--syntax-light-comment: #6e7781;--syntax-light-constant: #0550ae;--syntax-light-entity: #268bd2;--syntax-light-property: #8250df;--syntax-light-definition: #24292f;--syntax-light-tag: #085;--syntax-light-builtin: #b58900;--syntax-light-keyword: #cf222e;--syntax-light-exception: #e6212e;--syntax-light-string: #0a3069;--syntax-light-regexp: #e40;--syntax-light-variable: #a4480f;--syntax-light-invalid-illegal-text: #f6f8fa;--syntax-light-invalid-illegal-bg: #82071e;--syntax-light-markup-heading: #0550ae;--syntax-light-markup-italic: #24292f;--syntax-light-markup-bold: #24292f;--syntax-light-markup-deleted-text: #82071e;--syntax-light-markup-deleted-bg: #FFEBE9;--syntax-light-markup-inserted-text: #116329;--syntax-light-markup-inserted-bg: #dafbe1;--syntax-light-markup-changed-text: #953800;--syntax-light-markup-changed-bg: #ffd8b5;--syntax-light-markup-ignored-text: #eaeef2;--syntax-light-markup-ignored-bg: #0550ae;--syntax-light-meta-diff-range: #8250df;--syntax-light-highlight-bg: #dbecff;--syntax-light-special-bg: #dccafa;--syntax-dark-pre-bg: #1a2b3e;--syntax-dark-cap-bg: #223e5e;--syntax-dark-text: #c9d1d9;--syntax-dark-meta: #6e7781;--syntax-dark-comment: #8b949e;--syntax-dark-constant: #79c0ff;--syntax-dark-entity: #47b0fa;--syntax-dark-property: #d2a8ff;--syntax-dark-definition: #c9d1d9;--syntax-dark-tag: #7ee787;--syntax-dark-builtin: #ffd34c;--syntax-dark-keyword: #ff7b72;--syntax-dark-exception: #da473c;--syntax-dark-string: #a5d6ff;--syntax-dark-regexp: #ef954e;--syntax-dark-variable: #ffa657;--syntax-dark-invalid-illegal-text: #f0f6fc;--syntax-dark-invalid-illegal-bg: #8e1519;--syntax-dark-markup-heading: #1f6feb;--syntax-dark-markup-italic: #c9d1d9;--syntax-dark-markup-bold: #c9d1d9;--syntax-dark-markup-deleted-text: #ffdcd7;--syntax-dark-markup-deleted-bg: #67060c;--syntax-dark-markup-inserted-text: #aff5b4;--syntax-dark-markup-inserted-bg: #033a16;--syntax-dark-markup-changed-text: #ffdfb6;--syntax-dark-markup-changed-bg: #5a1e02;--syntax-dark-markup-ignored-text: #c9d1d9;--syntax-dark-markup-ignored-bg: #1158c7;--syntax-dark-meta-diff-range: #d2a8ff;--syntax-dark-highlight-bg: #091c33;--syntax-dark-special-bg: #4f425d}:root,html.light,html.light-theme{--syntax-pre-bg: var(--syntax-light-pre-bg);--syntax-cap-bg: var(--syntax-light-cap-bg);--syntax-text: var(--syntax-light-text);--syntax-meta: var(--syntax-light-meta);--syntax-comment: var(--syntax-light-comment);--syntax-constant: var(--syntax-light-constant);--syntax-entity: var(--syntax-light-entity);--syntax-property: var(--syntax-light-property);--syntax-definition: var(--syntax-light-definition);--syntax-tag: var(--syntax-light-tag);--syntax-builtin: var(--syntax-light-builtin);--syntax-keyword: var(--syntax-light-keyword);--syntax-exception: var(--syntax-light-exception);--syntax-string: var(--syntax-light-string);--syntax-regexp: var(--syntax-light-regexp);--syntax-variable: var(--syntax-light-variable);--syntax-invalid-illegal-text: var(--syntax-light-invalid-illegal-text);--syntax-invalid-illegal-bg: var(--syntax-light-invalid-illegal-bg);--syntax-markup-heading: var(--syntax-light-markup-heading);--syntax-markup-italic: var(--syntax-light-markup-italic);--syntax-markup-bold: var(--syntax-light-markup-bold);--syntax-markup-deleted-text: var(--syntax-light-markup-deleted-text);--syntax-markup-deleted-bg: var(--syntax-light-markup-deleted-bg);--syntax-markup-inserted-text: var(--syntax-light-markup-inserted-text);--syntax-markup-inserted-bg: var(--syntax-light-markup-inserted-bg);--syntax-markup-changed-text: var(--syntax-light-markup-changed-text);--syntax-markup-changed-bg: var(--syntax-light-markup-changed-bg);--syntax-markup-ignored-text: var(--syntax-light-markup-ignored-text);--syntax-markup-ignored-bg: var(--syntax-light-markup-ignored-bg);--syntax-meta-diff-range: var(--syntax-light-meta-diff-range);--syntax-highlight-bg: var(--syntax-light-highlight-bg);--syntax-special-bg: var(--syntax-light-special-bg)}@media (prefers-color-scheme: dark){:root{--syntax-pre-bg: var(--syntax-dark-pre-bg);--syntax-cap-bg: var(--syntax-dark-cap-bg);--syntax-text: var(--syntax-dark-text);--syntax-meta: var(--syntax-dark-meta);--syntax-comment: var(--syntax-dark-comment);--syntax-constant: var(--syntax-dark-constant);--syntax-entity: var(--syntax-dark-entity);--syntax-property: var(--syntax-dark-property);--syntax-definition: var(--syntax-dark-definition);--syntax-tag: var(--syntax-dark-tag);--syntax-builtin: var(--syntax-dark-builtin);--syntax-keyword: var(--syntax-dark-keyword);--syntax-exception: var(--syntax-dark-exception);--syntax-string: var(--syntax-dark-string);--syntax-regexp: var(--syntax-dark-regexp);--syntax-variable: var(--syntax-dark-variable);--syntax-invalid-illegal-text: var(--syntax-dark-invalid-illegal-text);--syntax-invalid-illegal-bg: var(--syntax-dark-invalid-illegal-bg);--syntax-markup-heading: var(--syntax-dark-markup-heading);--syntax-markup-italic: var(--syntax-dark-markup-italic);--syntax-markup-bold: var(--syntax-dark-markup-bold);--syntax-markup-deleted-text: var(--syntax-dark-markup-deleted-text);--syntax-markup-deleted-bg: var(--syntax-dark-markup-deleted-bg);--syntax-markup-inserted-text: var(--syntax-dark-markup-inserted-text);--syntax-markup-inserted-bg: var(--syntax-dark-markup-inserted-bg);--syntax-markup-changed-text: var(--syntax-dark-markup-changed-text);--syntax-markup-changed-bg: var(--syntax-dark-markup-changed-bg);--syntax-markup-ignored-text: var(--syntax-dark-markup-ignored-text);--syntax-markup-ignored-bg: var(--syntax-dark-markup-ignored-bg);--syntax-meta-diff-range: var(--syntax-dark-meta-diff-range);--syntax-highlight-bg: var(--syntax-dark-highlight-bg);--syntax-special-bg: var(--syntax-dark-special-bg)}}html.dark,html.dark-theme,.dark-code{--syntax-pre-bg: var(--syntax-dark-pre-bg);--syntax-cap-bg: var(--syntax-dark-cap-bg);--syntax-text: var(--syntax-dark-text);--syntax-meta: var(--syntax-dark-meta);--syntax-comment: var(--syntax-dark-comment);--syntax-constant: var(--syntax-dark-constant);--syntax-entity: var(--syntax-dark-entity);--syntax-property: var(--syntax-dark-property);--syntax-definition: var(--syntax-dark-definition);--syntax-tag: var(--syntax-dark-tag);--syntax-builtin: var(--syntax-dark-builtin);--syntax-keyword: var(--syntax-dark-keyword);--syntax-exception: var(--syntax-dark-exception);--syntax-string: var(--syntax-dark-string);--syntax-regexp: var(--syntax-dark-regexp);--syntax-variable: var(--syntax-dark-variable);--syntax-invalid-illegal-text: var(--syntax-dark-invalid-illegal-text);--syntax-invalid-illegal-bg: var(--syntax-dark-invalid-illegal-bg);--syntax-markup-heading: var(--syntax-dark-markup-heading);--syntax-markup-italic: var(--syntax-dark-markup-italic);--syntax-markup-bold: var(--syntax-dark-markup-bold);--syntax-markup-deleted-text: var(--syntax-dark-markup-deleted-text);--syntax-markup-deleted-bg: var(--syntax-dark-markup-deleted-bg);--syntax-markup-inserted-text: var(--syntax-dark-markup-inserted-text);--syntax-markup-inserted-bg: var(--syntax-dark-markup-inserted-bg);--syntax-markup-changed-text: var(--syntax-dark-markup-changed-text);--syntax-markup-changed-bg: var(--syntax-dark-markup-changed-bg);--syntax-markup-ignored-text: var(--syntax-dark-markup-ignored-text);--syntax-markup-ignored-bg: var(--syntax-dark-markup-ignored-bg);--syntax-meta-diff-range: var(--syntax-dark-meta-diff-range);--syntax-highlight-bg: var(--syntax-dark-highlight-bg);--syntax-special-bg: var(--syntax-dark-special-bg)}.highlight{color:var(--syntax-text);background-color:transparent}.highlight .hll{background-color:var(--syntax-highlight-bg)}.highlight .c{color:var(--syntax-comment)}.highlight .err{color:var(--syntax-invalid-illegal-text);background-color:var(--syntax-invalid-illegal-bg)}.highlight .g{color:var(--syntax-meta)}.highlight .k{color:var(--syntax-keyword)}.highlight .l{color:var(--syntax-meta)}.highlight .o{color:var(--syntax-constant)}.highlight .x{color:var(--syntax-meta)}.highlight .cm{color:var(--syntax-comment)}.highlight .cp{color:var(--syntax-constant)}.highlight .c1{color:var(--syntax-comment)}.highlight .cs{color:var(--syntax-comment);background-color:var(--syntax-special-bg)}.highlight .gd{color:var(--syntax-markup-deleted-text);background-color:var(--syntax-markup-deleted-bg)}.highlight .ge{color:var(--syntax-markup-italic);font-style:italic}.highlight .gr{color:var(--syntax-invalid-illegal-text);background-color:var(--syntax-invalid-illegal-bg)}.highlight .gh{color:var(--syntax-markup-heading)}.highlight .gi{color:var(--syntax-markup-inserted-text);background-color:var(--syntax-markup-inserted-bg)}.highlight .go,.highlight .gp{color:var(--syntax-meta)}.highlight .gs{color:var(--syntax-markup-bold);font-weight:700}.highlight .gu{color:var(--syntax-markup-heading)}.highlight .gt{color:var(--syntax-meta)}.highlight .kc{color:var(--syntax-constant)}.highlight .kd,.highlight .kn,.highlight .kp,.highlight .kr{color:var(--syntax-keyword)}.highlight .kt{color:var(--syntax-entity)}.highlight .ld{color:var(--syntax-meta)}.highlight .m{color:var(--syntax-constant)}.highlight .s{color:var(--syntax-string)}.highlight .il,.highlight .na{color:var(--syntax-constant)}.highlight .nb{color:var(--syntax-builtin)}.highlight .nc{color:var(--syntax-definition)}.highlight .no{color:var(--syntax-constant)}.highlight .nd,.highlight .ni{color:var(--syntax-entity)}.highlight .ne{color:var(--syntax-exception)}.highlight .nf{color:var(--syntax-definition)}.highlight .nt{color:var(--syntax-tag)}.highlight .ow{color:var(--syntax-constant)}.highlight .w{color:var(--syntax-meta)}.highlight .mf,.highlight .mh,.highlight .mi,.highlight .mo{color:var(--syntax-constant)}.highlight .sb{color:var(--syntax-meta)}.highlight .sc{color:var(--syntax-string)}.highlight .sd{color:var(--syntax-comment)}.highlight .s2,.highlight .se{color:var(--syntax-string)}.highlight .sh{color:var(--syntax-comment)}.highlight .si,.highlight .sx{color:var(--syntax-string)}.highlight .sr{color:var(--syntax-regexp)}.highlight .s1,.highlight .ss{color:var(--syntax-string)}.highlight .bp,.highlight .vc,.highlight .vg,.highlight .vi{color:var(--syntax-variable)} 2 | --------------------------------------------------------------------------------