@nakobase/nakobase-md-html 1.3.0 → 2.1.0
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 +28 -9
- package/dist/cjs/constants.d.ts +1 -0
- package/dist/cjs/constants.d.ts.map +1 -1
- package/dist/cjs/constants.js +2 -1
- package/dist/cjs/index.d.ts.map +1 -1
- package/dist/cjs/index.js +6 -2
- package/dist/cjs/types.d.ts +1 -0
- package/dist/cjs/types.d.ts.map +1 -1
- package/dist/cjs/utils/md-container.d.ts +4 -0
- package/dist/cjs/utils/md-container.d.ts.map +1 -1
- package/dist/cjs/utils/md-container.js +32 -3
- package/dist/styles/base.css +1 -0
- package/dist/styles/rich.css +1 -0
- package/package.json +7 -4
- package/dist/styles/style.css +0 -1
package/README.md
CHANGED
|
@@ -28,26 +28,45 @@ const html = mdToHtml(
|
|
|
28
28
|
|
|
29
29
|
This is a test of the markdown to html converter.
|
|
30
30
|
`,
|
|
31
|
-
{
|
|
32
|
-
|
|
31
|
+
{
|
|
32
|
+
codeHighlight: true, // Enable code highlighting (optional, default is false)
|
|
33
|
+
rich: true // Enable rich features like containers and custom blocks (optional, default is false)
|
|
34
|
+
}
|
|
35
|
+
);
|
|
33
36
|
|
|
34
37
|
console.log(html);
|
|
35
38
|
```
|
|
36
39
|
|
|
40
|
+
Add `.nbcontents` to the container of the markdown.
|
|
41
|
+
|
|
42
|
+
```html
|
|
43
|
+
<div class="nbcontent">
|
|
44
|
+
<!-- HTML parsed from markdown -->
|
|
45
|
+
</div>
|
|
46
|
+
```
|
|
47
|
+
|
|
37
48
|
### Styles
|
|
38
49
|
|
|
39
50
|
We have some default styles that are applied to the HTML.
|
|
40
51
|
|
|
52
|
+
#### Basic Usage (Performance Focused)
|
|
53
|
+
For simple markdown content, use only the base styles:
|
|
54
|
+
|
|
41
55
|
```ts
|
|
42
|
-
import '@nakobase/nakobase-md-html/styles/
|
|
56
|
+
import '@nakobase/nakobase-md-html/styles/base.css';
|
|
57
|
+
```
|
|
58
|
+
|
|
59
|
+
#### Rich Features
|
|
60
|
+
For content with custom blocks, containers, and rich features:
|
|
43
61
|
|
|
44
|
-
|
|
62
|
+
```ts
|
|
63
|
+
import '@nakobase/nakobase-md-html/styles/base.css';
|
|
64
|
+
import '@nakobase/nakobase-md-html/styles/rich.css';
|
|
45
65
|
```
|
|
46
66
|
|
|
47
|
-
|
|
67
|
+
### Code Highlighting
|
|
68
|
+
If you want code highlighting, also import a Prism theme:
|
|
48
69
|
|
|
49
|
-
```
|
|
50
|
-
|
|
51
|
-
<!-- HTML parsed from markdown -->
|
|
52
|
-
</div>
|
|
70
|
+
```ts
|
|
71
|
+
import 'prismjs/themes/prism-okaidia.css'; // or any other prism theme
|
|
53
72
|
```
|
package/dist/cjs/constants.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../src/constants.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,gBAAgB,MAAM,CAAC;AAEpC,eAAO,MAAM,eAAe
|
|
1
|
+
{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../src/constants.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,gBAAgB,MAAM,CAAC;AAEpC,eAAO,MAAM,eAAe;;;;;;;CAOlB,CAAC"}
|
package/dist/cjs/constants.js
CHANGED
package/dist/cjs/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":";AACA,OAAO,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":";AACA,OAAO,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAqB1C,eAAO,MAAM,QAAQ,GACnB,UAAU,MAAM,EAChB,UAAU,eAAe,KACxB,MAmCF,CAAC"}
|
package/dist/cjs/index.js
CHANGED
|
@@ -20,7 +20,8 @@ const MdItContainer = require('markdown-it-container');
|
|
|
20
20
|
const MdItTaskLists = require('markdown-it-task-lists');
|
|
21
21
|
const mdToHtml = (markdown, options) => {
|
|
22
22
|
const {
|
|
23
|
-
codeHighlight
|
|
23
|
+
codeHighlight,
|
|
24
|
+
rich
|
|
24
25
|
} = options || {};
|
|
25
26
|
if (!(markdown && markdown.length)) return '';
|
|
26
27
|
const md = (0, _markdownIt.default)({
|
|
@@ -35,7 +36,10 @@ const mdToHtml = (markdown, options) => {
|
|
|
35
36
|
});
|
|
36
37
|
md.use(MdItInlineComments).use(MdItImSize).use(MdItTaskLists, {
|
|
37
38
|
enabled: true
|
|
38
|
-
})
|
|
39
|
+
});
|
|
40
|
+
if (rich) {
|
|
41
|
+
md.use(MdItContainer, _constants.CONTAINER_TYPES.DETAILS, _mdContainer.detailsOptions).use(MdItContainer, _constants.CONTAINER_TYPES.BOX, _mdContainer.boxOptions).use(MdItContainer, _constants.CONTAINER_TYPES.BUBBLE, _mdContainer.bubbleOptions).use(MdItContainer, _constants.CONTAINER_TYPES.BUBBLE_IMAGE, _mdContainer.bubbleImageOptions).use(MdItContainer, _constants.CONTAINER_TYPES.HEADING, _mdContainer.headingOptions).use(_mdCustomBlocks.mdCustomBlocks).use(_mdCustomInlines.mdCustomInlines);
|
|
42
|
+
}
|
|
39
43
|
if (codeHighlight) {
|
|
40
44
|
md.use(_mdRendererFence.mdRendererFence);
|
|
41
45
|
}
|
package/dist/cjs/types.d.ts
CHANGED
package/dist/cjs/types.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/types.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,eAAe;IAC9B,aAAa,CAAC,EAAE,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/types.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,eAAe;IAC9B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB"}
|
|
@@ -15,4 +15,8 @@ export declare const boxOptions: {
|
|
|
15
15
|
validate: (params: string) => boolean;
|
|
16
16
|
render: (tokens: Token[], idx: number) => string;
|
|
17
17
|
};
|
|
18
|
+
export declare const headingOptions: {
|
|
19
|
+
validate: (params: string) => boolean;
|
|
20
|
+
render: (tokens: Token[], idx: number) => string;
|
|
21
|
+
};
|
|
18
22
|
//# sourceMappingURL=md-container.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"md-container.d.ts","sourceRoot":"","sources":["../../../src/utils/md-container.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,uBAAuB,CAAC;AAK/C,eAAO,MAAM,cAAc;uBACG,MAAM;qBAGR,KAAK,EAAE,OAAO,MAAM;CAc/C,CAAC;AAMF,eAAO,MAAM,aAAa;uBACI,MAAM;qBAGR,KAAK,EAAE,OAAO,MAAM;CA2C/C,CAAC;AAMF,eAAO,MAAM,kBAAkB;uBACD,MAAM;qBAGR,KAAK,EAAE,OAAO,MAAM;CA4C/C,CAAC;AAOF,eAAO,MAAM,UAAU;uBACO,MAAM;qBAGR,KAAK,EAAE,OAAO,MAAM;CAc/C,CAAC"}
|
|
1
|
+
{"version":3,"file":"md-container.d.ts","sourceRoot":"","sources":["../../../src/utils/md-container.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,uBAAuB,CAAC;AAK/C,eAAO,MAAM,cAAc;uBACG,MAAM;qBAGR,KAAK,EAAE,OAAO,MAAM;CAc/C,CAAC;AAMF,eAAO,MAAM,aAAa;uBACI,MAAM;qBAGR,KAAK,EAAE,OAAO,MAAM;CA2C/C,CAAC;AAMF,eAAO,MAAM,kBAAkB;uBACD,MAAM;qBAGR,KAAK,EAAE,OAAO,MAAM;CA4C/C,CAAC;AAOF,eAAO,MAAM,UAAU;uBACO,MAAM;qBAGR,KAAK,EAAE,OAAO,MAAM;CAc/C,CAAC;AA0BF,eAAO,MAAM,cAAc;uBACG,MAAM;qBAGR,KAAK,EAAE,OAAO,MAAM;CAa/C,CAAC"}
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.detailsOptions = exports.bubbleOptions = exports.bubbleImageOptions = exports.boxOptions = void 0;
|
|
6
|
+
exports.headingOptions = exports.detailsOptions = exports.bubbleOptions = exports.bubbleImageOptions = exports.boxOptions = void 0;
|
|
7
7
|
var _utils = require("markdown-it/lib/common/utils");
|
|
8
8
|
// ::: details Detail
|
|
9
9
|
// summary here
|
|
@@ -45,8 +45,8 @@ const bubbleOptions = exports.bubbleOptions = {
|
|
|
45
45
|
const {
|
|
46
46
|
src = '',
|
|
47
47
|
alt = '',
|
|
48
|
-
width = '
|
|
49
|
-
height = '
|
|
48
|
+
width = '80',
|
|
49
|
+
height = '80',
|
|
50
50
|
pos = 'left',
|
|
51
51
|
webp = ''
|
|
52
52
|
} = attrs;
|
|
@@ -141,4 +141,33 @@ const boxHtml = (boxType, boxTitle) => {
|
|
|
141
141
|
default:
|
|
142
142
|
return `<div class="box ${boxType}">${boxTitle ? `<span>${boxTitle}</span>` : ''}`;
|
|
143
143
|
}
|
|
144
|
+
};
|
|
145
|
+
|
|
146
|
+
// Heading
|
|
147
|
+
// ::: heading1
|
|
148
|
+
// markdown
|
|
149
|
+
// :::
|
|
150
|
+
const headingOptions = exports.headingOptions = {
|
|
151
|
+
validate: function (params) {
|
|
152
|
+
return /^(heading1)$/.test(params.trim());
|
|
153
|
+
},
|
|
154
|
+
render: function (tokens, idx) {
|
|
155
|
+
const isOpeningTag = tokens[idx].nesting === 1;
|
|
156
|
+
if (isOpeningTag) {
|
|
157
|
+
const m = tokens[idx].info.trim().match(/^(heading1)$/);
|
|
158
|
+
if (!m) return '';
|
|
159
|
+
const headingType = m[1]; // heading1
|
|
160
|
+
return headingHtml(headingType);
|
|
161
|
+
} else {
|
|
162
|
+
return '</div>\n';
|
|
163
|
+
}
|
|
164
|
+
}
|
|
165
|
+
};
|
|
166
|
+
const headingHtml = headingType => {
|
|
167
|
+
switch (headingType) {
|
|
168
|
+
case 'heading1':
|
|
169
|
+
return `<div class="heading ${headingType}">`;
|
|
170
|
+
default:
|
|
171
|
+
return `<div class="heading ${headingType}">`;
|
|
172
|
+
}
|
|
144
173
|
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
@media screen and (max-width: 576px){pre>code{padding:1rem .8rem;font-size:.85em}}.nbcontent{--background: oklch(100% 0 0deg);--foreground: oklch(14.1% 0.005 285.823deg);--primary: oklch(21% 0.006 285.885deg);--primary-foreground: oklch(98.5% 0 0deg);--secondary: oklch(96.7% 0.001 286.375deg);--secondary-foreground: oklch(21% 0.006 285.885deg);--muted: oklch(96.7% 0.001 286.375deg);--muted-foreground: oklch(55.2% 0.016 285.938deg);--accent: oklch(96.7% 0.001 286.375deg);--accent-foreground: oklch(21% 0.006 285.885deg);--destructive: oklch(57.7% 0.245 27.325deg);--border: oklch(92% 0.004 286.32deg);--input: oklch(92% 0.004 286.32deg);--ring: oklch(70.5% 0.015 286.067deg);--link: oklch(62.3% 0.214 259.815deg);--warning: oklch(97.54% 0.025552 84.593deg);--warning-foreground: oklch(83.04% 0.1459 74.36deg);--danger: oklch(96.56% 0.0177 4.51deg);--danger-foreground: oklch(72.71% 0.1684 24.66deg);--rounded-xs: 4px;--rounded-sm: 7px;--rounded-md: 10px;--rounded-lg: 14px;--rounded-full: 99rem;line-height:1.8;background-color:var(--background);color:var(--foreground)}.nbcontent>*:first-child{margin-top:0}.nbcontent i,.nbcontent cite,.nbcontent em,.nbcontent var{font-style:italic}.nbcontent strong{font-weight:bold}.nbcontent a{color:var(--link)}.nbcontent a:hover{text-decoration:underline}.nbcontent p+p{margin-top:1.2em}.nbcontent h1,.nbcontent h2,.nbcontent h3,.nbcontent h4,.nbcontent h5,.nbcontent h6{font-weight:bold}.nbcontent h1+p,.nbcontent h2+p,.nbcontent h3+p,.nbcontent h4+p,.nbcontent h5+p,.nbcontent h6+p{margin-top:.2em}.nbcontent h1,.nbcontent h2{margin-top:1.9em;margin-bottom:1.5rem;padding-bottom:.1em;border-bottom:solid 1px var(--border)}.nbcontent h3,.nbcontent h4,.nbcontent h5,.nbcontent h6{margin-top:1.8em;margin-bottom:.4em}.nbcontent h1{font-size:1.7em}.nbcontent h2{font-size:1.5em}.nbcontent h3{font-size:1.3em}.nbcontent h4{font-size:1.1em}.nbcontent h5{font-size:1em}.nbcontent h6{font-size:.9em}@media screen and (max-width: 576px){.nbcontent h1{font-size:1.6em}.nbcontent h2{font-size:1.4em}.nbcontent h3{font-size:1.2em}.nbcontent h4{font-size:1.1em}.nbcontent h5{font-size:1em}.nbcontent h6{font-size:.85em}}.nbcontent ul,.nbcontent ol{margin:1.4rem 0;line-height:1.6}.nbcontent ul>li,.nbcontent ol>li{margin:.4rem 0}.nbcontent ul ul,.nbcontent ul ol,.nbcontent ol ul,.nbcontent ol ol{margin:.2em 0}.nbcontent ul p,.nbcontent ol p{margin:0}.nbcontent ul{padding-left:1.8em}.nbcontent ul>li{list-style:disc}.nbcontent ul>li::marker{font-size:1.1em}.nbcontent ol{padding-left:1.7em}.nbcontent ol>li{list-style:decimal;padding-left:.2em}.nbcontent ol>li::marker{font-weight:600;letter-spacing:-0.05em}.nbcontent .contains-task-list .task-list-item{list-style:none}.nbcontent .task-list-item-checkbox{margin-left:-1.5em;font-size:1em;pointer-events:none}.nbcontent code{padding:.2em .4em;background:var(--secondary);font-size:.85em;border-radius:var(--rounded-xs);vertical-align:.08em;color:var(--foreground)}.nbcontent code,.nbcontent .code-filename{font-family:"JetBrains Mono","Fira Code","SFMono-Regular",Consolas,"Liberation Mono",Menlo,"Cascadia Code","Source Code Pro",monospace,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";-webkit-font-smoothing:antialiased}.nbcontent .code-container{position:relative;margin:1.3rem 0}.nbcontent .code-filename{display:table;max-width:100%;background:var(--primary);color:var(--primary-foreground);font-size:12px;line-height:1.3;border-radius:var(--rounded-xs) var(--rounded-xs) 0 0;padding:6px 12px 20px;margin-bottom:-24px}.nbcontent .code-filename-container+pre{border-top-left-radius:0}.nbcontent pre{margin:1.3rem 0;background:var(--primary);overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:var(--rounded-md);word-break:normal;word-wrap:normal;display:flex}.nbcontent pre:after{content:"";width:8px;flex-shrink:0}.nbcontent pre code{margin:0;padding:0;background:rgba(0,0,0,0);font-size:.9em}.nbcontent pre>code{display:block;padding:1.1rem}.nbcontent table{margin:1.2rem auto;width:auto;border-collapse:collapse;font-size:.95em;line-height:1.5;word-break:normal;display:block;overflow:auto;-webkit-overflow-scrolling:touch}.nbcontent th,.nbcontent td{padding:.6rem;border:solid 1px var(--border);background:var(--background)}.nbcontent th{font-weight:700;background:var(--secondary)}.nbcontent img:not(.emoji){margin:1.5rem auto;display:table;max-width:100%;height:auto}.nbcontent img+br{display:none}.nbcontent img~em{display:block;margin:-1rem auto 0;line-height:1.3;text-align:center;color:var(--muted-foreground);font-size:.92em}.nbcontent a:has(img){display:table;margin:0 auto}.nbcontent hr{border-top:2px solid var(--border);margin:2.5rem 0}.nbcontent blockquote{font-size:.97em;margin:1.4rem 0;border-left:solid 3px var(--border);padding:2px 0 2px .7em;color:var(--muted-foreground)}.nbcontent blockquote p{margin:1rem 0}.nbcontent blockquote>:first-child{margin-top:0}.nbcontent blockquote>:last-child{margin-bottom:0}.nbcontent blockquote.twitter-tweet{display:none}.dark .nbcontent{--background: oklch(14.1% 0.005 285.823deg);--foreground: oklch(98.5% 0 0deg);--primary: oklch(92% 0.004 286.32deg);--primary-foreground: oklch(21% 0.006 285.885deg);--secondary: oklch(27.4% 0.006 286.033deg);--secondary-foreground: oklch(98.5% 0 0deg);--muted: oklch(27.4% 0.006 286.033deg);--muted-foreground: oklch(70.5% 0.015 286.067deg);--accent: oklch(27.4% 0.006 286.033deg);--accent-foreground: oklch(98.5% 0 0deg);--destructive: oklch(70.4% 0.191 22.216deg);--border: oklch(100% 0 0deg / 0.1);--input: oklch(100% 0 0deg / 0.15);--ring: oklch(55.2% 0.016 285.938deg);--link: oklch(62.3% 0.214 259.815deg);--warning: oklch(97.54% 0.025552 84.593deg);--warning-foreground: oklch(83.04% 0.1459 74.36deg);--danger: oklch(96.56% 0.0177 4.51deg);--danger-foreground: oklch(72.71% 0.1684 24.66deg);--rounded-xs: 4px;--rounded-sm: 7px;--rounded-md: 10px;--rounded-lg: 14px;--rounded-full: 99rem}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.nbcontent details{font-size:.95em;margin:1rem 0;line-height:1.7}.nbcontent summary{cursor:pointer;outline:0;padding:.7em .7em .7em .9em;border:solid 1px var(--border);color:var(--primary);font-size:.9em;border-radius:var(--rounded-sm);background:var(--background)}.nbcontent summary::-webkit-details-marker{color:var(--muted-foreground)}.nbcontent details[open]>summary{border-radius:var(--rounded-sm) var(--rounded-sm) 0 0;box-shadow:none;background:var(--background);border-bottom:none}.nbcontent .details-content{padding:.5em .9em;border:solid 1px var(--border);border-radius:0 0 var(--rounded-lg) var(--rounded-lg);background:var(--background)}.nbcontent .details-content>*{margin:.5em 0}.nbcontent .bubble{display:flex;align-items:center;gap:1rem;margin:1rem 0}.nbcontent .bubble img{width:80px;height:80px;border-radius:50%;border:2px solid var(--border);padding:.2rem}.nbcontent .bubble .bubble-content{position:relative;width:100%;padding:.5rem .8rem;color:var(--foreground);background-color:var(--secondary);border-radius:5px}.nbcontent .bubble .bubble-content::before,.nbcontent .bubble .bubble-content::after{position:absolute;top:50%;left:-12px;width:12px;height:15px;clip-path:polygon(0 50%, 100% 0, 100% 100%);content:"";transform:translateY(-50%)}.nbcontent .bubble .bubble-content::before{background-color:var(--secondary)}.nbcontent .bubble .bubble-content::after{left:-9px;background-color:var(--secondary)}.nbcontent .bubble.right{flex-direction:row-reverse}.nbcontent .bubble.right .bubble-content::before,.nbcontent .bubble.right .bubble-content::after{left:auto;right:-12px;clip-path:polygon(0 0, 100% 50%, 0 100%)}.nbcontent .bubble.right .bubble-content::after{left:auto;right:-9px}.nbcontent .bubble-image{display:flex;align-items:center;gap:1rem;margin:1.5rem 0}.nbcontent .bubble-image .bubble-image-wrapper{flex-basis:40%;display:flex;align-items:center;justify-content:center;max-width:100%;border:2px solid var(--border);border-radius:5px}.nbcontent .bubble-image .bubble-image-wrapper img{width:100%;height:auto;margin:0}.nbcontent .bubble-image .bubble-image-content{flex-basis:60%;position:relative;width:100%;padding:.5rem .8rem;color:var(--foreground);background-color:var(--secondary);border-radius:5px}.nbcontent .bubble-image .bubble-image-content::before,.nbcontent .bubble-image .bubble-image-content::after{position:absolute;top:50%;left:-12px;width:12px;height:15px;clip-path:polygon(0 50%, 100% 0, 100% 100%);content:"";transform:translateY(-50%);background-color:var(--secondary)}.nbcontent .bubble-image .bubble-image-content::after{left:-9px}@media screen and (max-width: 768px){.nbcontent .bubble-image{flex-direction:column}.nbcontent .bubble-image .bubble-image-content::before,.nbcontent .bubble-image .bubble-image-content::after{top:-12px;left:50%;width:28px;height:12px;clip-path:polygon(50% 0, 0 100%, 100% 100%);transform:translateX(-50%)}.nbcontent .bubble-image .bubble-image-content::after{top:-9px}}.nbcontent .box{margin:1.5rem 0}.nbcontent .box.box1{position:relative;border:1px solid var(--border);border-radius:var(--rounded-sm);padding:1rem}.nbcontent .box.box1 span{position:absolute;top:0;left:1rem;font-size:1.2em;color:var(--foreground);background-color:var(--background);padding:0 .5em;transform:translateY(-50%)}.nbcontent .box.box2{position:relative;border-radius:var(--rounded-sm);padding:1rem;background-color:var(--secondary)}.nbcontent .box.box3{position:relative;border-radius:var(--rounded-sm);padding:1rem;background-color:var(--background);border:2px solid var(--warning-foreground)}.nbcontent .box.box3 .msg-container{position:absolute;top:0;left:1rem;background-color:var(--background);padding:0 .5rem;transform:translateY(-50%);display:flex;flex-direction:row;align-items:center;gap:.3rem;color:var(--warning-foreground);font-weight:bold}.nbcontent .box.box3 .icon{box-sizing:border-box;position:relative;width:20px;height:20px;border:2px solid var(--warning-foreground);background-color:var(--warning-foreground);border-radius:50%}.nbcontent .box.box3 .icon::before,.nbcontent .box.box3 .icon::after{content:"";position:absolute;border-radius:3px;width:2px;background:#fff;left:7px}.nbcontent .box.box3 .icon::before{top:2px;height:2px}.nbcontent .box.box3 .icon::after{height:8px;bottom:2px}.nbcontent .box.box4{position:relative;border-radius:var(--rounded-sm);padding:1rem;background-color:var(--background);border:2px solid var(--danger-foreground)}.nbcontent .box.box4 .msg-container{position:absolute;top:0;left:1rem;background-color:var(--background);padding:0 .5rem;transform:translateY(-50%);display:flex;flex-direction:row;align-items:center;gap:.3rem;color:var(--danger-foreground);font-weight:bold}.nbcontent .box.box4 .icon{box-sizing:border-box;position:relative;width:20px;height:20px;border:2px solid var(--danger-foreground);background-color:var(--danger-foreground);border-radius:50%}.nbcontent .box.box4 .icon::before,.nbcontent .box.box4 .icon::after{content:"";position:absolute;border-radius:3px;width:2px;background:#fff;left:7px}.nbcontent .box.box4 .icon::before{top:2px;height:2px}.nbcontent .box.box4 .icon::after{height:8px;bottom:2px}.nbcontent .box.box5{position:relative;border-radius:var(--rounded-sm);padding:1rem;background-color:var(--warning)}.dark .nbcontent .box.box5{color:var(--background)}.nbcontent .box.box5 .msg-container{display:flex;flex-direction:row;align-items:center;gap:.3rem;color:var(--warning-foreground);font-weight:bold}.nbcontent .box.box5 .icon{box-sizing:border-box;position:relative;width:20px;height:20px;border:2px solid var(--warning-foreground);background-color:var(--warning-foreground);border-radius:50%}.nbcontent .box.box5 .icon::before,.nbcontent .box.box5 .icon::after{content:"";position:absolute;border-radius:3px;width:2px;background:#fff;left:7px}.nbcontent .box.box5 .icon::before{top:2px;height:2px}.nbcontent .box.box5 .icon::after{height:8px;bottom:2px}.nbcontent .box.box6{position:relative;border-radius:var(--rounded-sm);padding:1rem;background-color:var(--danger)}.dark .nbcontent .box.box6{color:var(--background)}.nbcontent .box.box6 .msg-container{display:flex;flex-direction:row;align-items:center;gap:.3rem;color:var(--danger-foreground);font-weight:bold}.nbcontent .box.box6 .icon{box-sizing:border-box;position:relative;width:20px;height:20px;border:2px solid var(--danger-foreground);background-color:var(--danger-foreground);border-radius:50%}.nbcontent .box.box6 .icon::before,.nbcontent .box.box6 .icon::after{content:"";position:absolute;border-radius:3px;width:2px;background:#fff;left:7px}.nbcontent .box.box6 .icon::before{top:2px;height:2px}.nbcontent .box.box6 .icon::after{height:8px;bottom:2px}.nbcontent .heading{margin:1.5rem 0}.nbcontent .heading h1,.nbcontent .heading h2,.nbcontent .heading h3,.nbcontent .heading h4,.nbcontent .heading h5,.nbcontent .heading h6{margin:0}.nbcontent .heading.heading1{display:inline-block;position:relative;padding-left:1.5rem;font-weight:bold}.nbcontent .heading.heading1::before{position:absolute;top:0;left:0;width:17px;height:28px;color:var(--primary);background-image:url(data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20height%3D%221.25em%22%20viewBox%3D%220%200%20448%20512%22%3E%3Cstyle%3Esvg%7Bfill%3A%235ab9ff%7D%3C%2Fstyle%3E%3Cpath%20d%3D%22M438.6%20105.4c12.5%2012.5%2012.5%2032.8%200%2045.3l-256%20256c-12.5%2012.5-32.8%2012.5-45.3%200l-128-128c-12.5-12.5-12.5-32.8%200-45.3s32.8-12.5%2045.3%200L160%20338.7%20393.4%20105.4c12.5-12.5%2032.8-12.5%2045.3%200z%22%2F%3E%3C%2Fsvg%3E);background-position:50%;background-repeat:no-repeat;content:""}.nbcontent .external-link{display:inline-flex;align-items:center;gap:.3em;color:var(--link)}.nbcontent .external-link::after{content:"";display:inline-block;width:.9em;height:.9em;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'%3E%3C/path%3E%3Cpolyline points='15 3 21 3 21 9'%3E%3C/polyline%3E%3Cline x1='10' y1='14' x2='21' y2='3'%3E%3C/line%3E%3C/svg%3E") no-repeat center/contain;background-color:var(--link);vertical-align:-0.125em;position:relative;top:-0.05em}.nbcontent .highlight{background:linear-gradient(transparent 60%, #fef08a 40%);padding:0 2px;border-radius:2px}.dark .nbcontent .highlight{background:linear-gradient(transparent 60%, #ca8a04 40%)}.nbcontent .highlight.highlight-red{background:linear-gradient(transparent 60%, #fecaca 40%)}.dark .nbcontent .highlight.highlight-red{background:linear-gradient(transparent 60%, #dc2626 40%)}.nbcontent .highlight.highlight-green{background:linear-gradient(transparent 60%, #bbf7d0 40%)}.dark .nbcontent .highlight.highlight-green{background:linear-gradient(transparent 60%, #16a34a 40%)}.nbcontent .highlight.highlight-blue{background:linear-gradient(transparent 60%, #bfdbfe 40%)}.dark .nbcontent .highlight.highlight-blue{background:linear-gradient(transparent 60%, #2563eb 40%)}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@nakobase/nakobase-md-html",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "2.1.0",
|
|
4
4
|
"description": "Convert Markdown to **sanitized HTML** and apply consistent styles – simple, secure, and styled.",
|
|
5
5
|
"main": "dist/cjs/index.js",
|
|
6
6
|
"types": "dist/cjs/index.d.ts",
|
|
@@ -9,8 +9,11 @@
|
|
|
9
9
|
".": {
|
|
10
10
|
"import": "./dist/cjs/index.js"
|
|
11
11
|
},
|
|
12
|
-
"./styles/
|
|
13
|
-
"import": "./dist/styles/
|
|
12
|
+
"./styles/base.css": {
|
|
13
|
+
"import": "./dist/styles/base.css"
|
|
14
|
+
},
|
|
15
|
+
"./styles/rich.css": {
|
|
16
|
+
"import": "./dist/styles/rich.css"
|
|
14
17
|
}
|
|
15
18
|
},
|
|
16
19
|
"files": [
|
|
@@ -26,7 +29,7 @@
|
|
|
26
29
|
"clean": "rimraf dist",
|
|
27
30
|
"build:types": "tsc --project tsconfig.build.json",
|
|
28
31
|
"build:js": "babel src --extensions .ts,.tsx --ignore **/*.d.ts --out-dir dist/cjs",
|
|
29
|
-
"build:styles": "sass src/styles/
|
|
32
|
+
"build:styles": "sass src/styles/base.scss:dist/styles/base.css --no-source-map --style compressed && sass src/styles/rich.scss:dist/styles/rich.css --no-source-map --style compressed",
|
|
30
33
|
"build": "pnpm run clean && pnpm run build:types && pnpm run build:styles && pnpm run build:js",
|
|
31
34
|
"start": "pnpm run build && node dist/cjs/index.js",
|
|
32
35
|
"test": "jest",
|
package/dist/styles/style.css
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
@media screen and (max-width: 576px){pre>code{padding:1rem .8rem;font-size:.85em}}.nbcontent{--background: oklch(100% 0 0deg);--foreground: oklch(14.1% 0.005 285.823deg);--primary: oklch(21% 0.006 285.885deg);--primary-foreground: oklch(98.5% 0 0deg);--secondary: oklch(96.7% 0.001 286.375deg);--secondary-foreground: oklch(21% 0.006 285.885deg);--muted: oklch(96.7% 0.001 286.375deg);--muted-foreground: oklch(55.2% 0.016 285.938deg);--accent: oklch(96.7% 0.001 286.375deg);--accent-foreground: oklch(21% 0.006 285.885deg);--destructive: oklch(57.7% 0.245 27.325deg);--border: oklch(92% 0.004 286.32deg);--input: oklch(92% 0.004 286.32deg);--ring: oklch(70.5% 0.015 286.067deg);--link: oklch(45.2% 0.313214 264.052deg);--warning: oklch(97.54% 0.025552 84.593deg);--warning-foreground: oklch(83.04% 0.1459 74.36deg);--danger: oklch(96.56% 0.0177 4.51deg);--danger-foreground: oklch(72.71% 0.1684 24.66deg);--rounded-xs: 4px;--rounded-sm: 7px;--rounded-md: 10px;--rounded-lg: 14px;--rounded-full: 99rem;line-height:1.8;background-color:var(--background);color:var(--foreground)}.nbcontent>*:first-child{margin-top:0}.nbcontent i,.nbcontent cite,.nbcontent em,.nbcontent var{font-style:italic}.nbcontent strong{font-weight:bold}.nbcontent a{color:var(--link)}.nbcontent a:hover{text-decoration:underline}.nbcontent p+p{margin-top:1.2em}.nbcontent h1,.nbcontent h2,.nbcontent h3,.nbcontent h4,.nbcontent h5,.nbcontent h6{font-weight:bold}.nbcontent h1+p,.nbcontent h2+p,.nbcontent h3+p,.nbcontent h4+p,.nbcontent h5+p,.nbcontent h6+p{margin-top:.2em}.nbcontent h1,.nbcontent h2{margin-top:1.9em;margin-bottom:1rem;padding-bottom:.1em;border-bottom:solid 1px var(--border)}.nbcontent h3,.nbcontent h4,.nbcontent h5,.nbcontent h6{margin-top:1.8em;margin-bottom:.4em}.nbcontent h1{font-size:1.7em}.nbcontent h2{font-size:1.5em}.nbcontent h3{font-size:1.3em}.nbcontent h4{font-size:1.1em}.nbcontent h5{font-size:1em}.nbcontent h6{font-size:.9em}@media screen and (max-width: 576px){.nbcontent h1{font-size:1.6em}.nbcontent h2{font-size:1.4em}.nbcontent h3{font-size:1.2em}.nbcontent h4{font-size:1.1em}.nbcontent h5{font-size:1em}.nbcontent h6{font-size:.85em}}.nbcontent ul,.nbcontent ol{margin:1.4rem 0;line-height:1.6}.nbcontent ul>li,.nbcontent ol>li{margin:.4rem 0}.nbcontent ul ul,.nbcontent ul ol,.nbcontent ol ul,.nbcontent ol ol{margin:.2em 0}.nbcontent ul p,.nbcontent ol p{margin:0}.nbcontent ul{padding-left:1.8em}.nbcontent ul>li{list-style:disc}.nbcontent ul>li::marker{font-size:1.1em}.nbcontent ol{padding-left:1.7em}.nbcontent ol>li{list-style:decimal;padding-left:.2em}.nbcontent ol>li::marker{font-weight:600;letter-spacing:-0.05em}.nbcontent .contains-task-list .task-list-item{list-style:none}.nbcontent .task-list-item-checkbox{margin-left:-1.5em;font-size:1em;pointer-events:none}.nbcontent code{padding:.2em .4em;background:var(--secondary);font-size:.85em;border-radius:var(--rounded-xs);vertical-align:.08em;color:var(--foreground)}.nbcontent code,.nbcontent .code-filename{font-family:"JetBrains Mono","Fira Code","SFMono-Regular",Consolas,"Liberation Mono",Menlo,"Cascadia Code","Source Code Pro",monospace,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";-webkit-font-smoothing:antialiased}.nbcontent .code-container{position:relative;margin:1.3rem 0}.nbcontent .code-filename{display:table;max-width:100%;background:var(--primary);color:var(--primary-foreground);font-size:12px;line-height:1.3;border-radius:var(--rounded-xs) var(--rounded-xs) 0 0;padding:6px 12px 20px;margin-bottom:-24px}.nbcontent .code-filename-container+pre{border-top-left-radius:0}.nbcontent pre{margin:1.3rem 0;background:var(--primary);overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:var(--rounded-md);word-break:normal;word-wrap:normal;display:flex}.nbcontent pre:after{content:"";width:8px;flex-shrink:0}.nbcontent pre code{margin:0;padding:0;background:rgba(0,0,0,0);font-size:.9em}.nbcontent pre>code{display:block;padding:1.1rem}.nbcontent table{margin:1.2rem auto;width:auto;border-collapse:collapse;font-size:.95em;line-height:1.5;word-break:normal;display:block;overflow:auto;-webkit-overflow-scrolling:touch}.nbcontent th,.nbcontent td{padding:.6rem;border:solid 1px var(--border);background:var(--background)}.nbcontent th{font-weight:700;background:var(--secondary)}.nbcontent img:not(.emoji){margin:1.5rem auto;display:table;max-width:100%;height:auto}.nbcontent img+br{display:none}.nbcontent img~em{display:block;margin:-1rem auto 0;line-height:1.3;text-align:center;color:var(--muted-foreground);font-size:.92em}.nbcontent a:has(img){display:table;margin:0 auto}.nbcontent hr{border-top:2px solid var(--border);margin:2.5rem 0}.nbcontent blockquote{font-size:.97em;margin:1.4rem 0;border-left:solid 3px var(--border);padding:2px 0 2px .7em;color:var(--muted-foreground)}.nbcontent blockquote p{margin:1rem 0}.nbcontent blockquote>:first-child{margin-top:0}.nbcontent blockquote>:last-child{margin-bottom:0}.nbcontent blockquote.twitter-tweet{display:none}.nbcontent details{font-size:.95em;margin:1rem 0;line-height:1.7}.nbcontent summary{cursor:pointer;outline:0;padding:.7em .7em .7em .9em;border:solid 1px var(--border);color:var(--primary);font-size:.9em;border-radius:var(--rounded-sm);background:var(--background)}.nbcontent summary::-webkit-details-marker{color:var(--muted-foreground)}.nbcontent details[open]>summary{border-radius:var(--rounded-sm) var(--rounded-sm) 0 0;box-shadow:none;background:var(--background);border-bottom:none}.nbcontent .details-content{padding:.5em .9em;border:solid 1px var(--border);border-radius:0 0 var(--rounded-lg) var(--rounded-lg);background:var(--background)}.nbcontent .details-content>*{margin:.5em 0}.nbcontent .bubble{display:flex;align-items:center;gap:1rem;margin:1rem 0}.nbcontent .bubble img{width:60px;height:60px;border-radius:50%;border:2px solid var(--border)}.nbcontent .bubble .bubble-content{position:relative;width:100%;padding:.5rem .8rem;color:var(--foreground);background-color:var(--secondary);border-radius:5px}.nbcontent .bubble .bubble-content::before,.nbcontent .bubble .bubble-content::after{position:absolute;top:50%;left:-12px;width:12px;height:15px;clip-path:polygon(0 50%, 100% 0, 100% 100%);content:"";transform:translateY(-50%)}.nbcontent .bubble .bubble-content::before{background-color:var(--secondary)}.nbcontent .bubble .bubble-content::after{left:-9px;background-color:var(--secondary)}.nbcontent .bubble.right{flex-direction:row-reverse}.nbcontent .bubble.right .bubble-content::before,.nbcontent .bubble.right .bubble-content::after{left:auto;right:-12px;clip-path:polygon(0 0, 100% 50%, 0 100%)}.nbcontent .bubble.right .bubble-content::after{left:auto;right:-9px}.nbcontent .bubble-image{display:flex;align-items:center;gap:1rem;margin:1rem 0}.nbcontent .bubble-image .bubble-image-wrapper,.nbcontent .bubble-image .bubble-image-content{flex-basis:50%}.nbcontent .bubble-image .bubble-image-wrapper{display:flex;align-items:center;justify-content:center;max-width:100%;border:2px solid var(--border);border-radius:5px}.nbcontent .bubble-image .bubble-image-wrapper img{width:100%;height:auto;margin:0}.nbcontent .bubble-image .bubble-image-content{position:relative;width:100%;padding:.5rem .8rem;color:var(--foreground);background-color:var(--secondary);border-radius:5px}.nbcontent .bubble-image .bubble-image-content::before,.nbcontent .bubble-image .bubble-image-content::after{position:absolute;top:50%;left:-12px;width:12px;height:15px;clip-path:polygon(0 50%, 100% 0, 100% 100%);content:"";transform:translateY(-50%);background-color:var(--secondary)}.nbcontent .bubble-image .bubble-image-content::after{left:-9px}@media screen and (max-width: 768px){.nbcontent .bubble-image{flex-direction:column}.nbcontent .bubble-image .bubble-image-content::before,.nbcontent .bubble-image .bubble-image-content::after{top:-12px;left:50%;width:28px;height:12px;clip-path:polygon(50% 0, 0 100%, 100% 100%);transform:translateX(-50%)}.nbcontent .bubble-image .bubble-image-content::after{top:-9px}}.nbcontent .box{margin:1.2rem 0}.nbcontent .box.box1{position:relative;border:1px solid var(--border);border-radius:var(--rounded-sm);padding:1rem}.nbcontent .box.box1 span{position:absolute;top:0;left:1rem;font-size:1.2em;color:var(--foreground);background-color:var(--background);padding:0 .5em;transform:translateY(-50%)}.nbcontent .box.box2{position:relative;border-radius:var(--rounded-sm);padding:1rem;background-color:var(--secondary)}.nbcontent .box.box3{position:relative;border-radius:var(--rounded-sm);padding:1rem;background-color:var(--background);border:2px solid var(--warning-foreground)}.nbcontent .box.box3 .msg-container{position:absolute;top:0;left:1rem;background-color:var(--background);padding:0 .5rem;transform:translateY(-50%);display:flex;flex-direction:row;align-items:center;gap:.3rem;color:var(--warning-foreground);font-weight:bold}.nbcontent .box.box3 .icon{box-sizing:border-box;position:relative;width:20px;height:20px;border:2px solid var(--warning-foreground);background-color:var(--warning-foreground);border-radius:50%}.nbcontent .box.box3 .icon::before,.nbcontent .box.box3 .icon::after{content:"";position:absolute;border-radius:3px;width:2px;background:#fff;left:7px}.nbcontent .box.box3 .icon::before{top:2px;height:2px}.nbcontent .box.box3 .icon::after{height:8px;bottom:2px}.nbcontent .box.box4{position:relative;border-radius:var(--rounded-sm);padding:1rem;background-color:var(--background);border:2px solid var(--danger-foreground)}.nbcontent .box.box4 .msg-container{position:absolute;top:0;left:1rem;background-color:var(--background);padding:0 .5rem;transform:translateY(-50%);display:flex;flex-direction:row;align-items:center;gap:.3rem;color:var(--danger-foreground);font-weight:bold}.nbcontent .box.box4 .icon{box-sizing:border-box;position:relative;width:20px;height:20px;border:2px solid var(--danger-foreground);background-color:var(--danger-foreground);border-radius:50%}.nbcontent .box.box4 .icon::before,.nbcontent .box.box4 .icon::after{content:"";position:absolute;border-radius:3px;width:2px;background:#fff;left:7px}.nbcontent .box.box4 .icon::before{top:2px;height:2px}.nbcontent .box.box4 .icon::after{height:8px;bottom:2px}.nbcontent .box.box5{position:relative;border-radius:var(--rounded-sm);padding:1rem;background-color:var(--warning)}.dark .nbcontent .box.box5{color:var(--background)}.nbcontent .box.box5 .msg-container{display:flex;flex-direction:row;align-items:center;gap:.3rem;color:var(--warning-foreground);font-weight:bold}.nbcontent .box.box5 .icon{box-sizing:border-box;position:relative;width:20px;height:20px;border:2px solid var(--warning-foreground);background-color:var(--warning-foreground);border-radius:50%}.nbcontent .box.box5 .icon::before,.nbcontent .box.box5 .icon::after{content:"";position:absolute;border-radius:3px;width:2px;background:#fff;left:7px}.nbcontent .box.box5 .icon::before{top:2px;height:2px}.nbcontent .box.box5 .icon::after{height:8px;bottom:2px}.nbcontent .box.box6{position:relative;border-radius:var(--rounded-sm);padding:1rem;background-color:var(--danger)}.dark .nbcontent .box.box6{color:var(--background)}.nbcontent .box.box6 .msg-container{display:flex;flex-direction:row;align-items:center;gap:.3rem;color:var(--danger-foreground);font-weight:bold}.nbcontent .box.box6 .icon{box-sizing:border-box;position:relative;width:20px;height:20px;border:2px solid var(--danger-foreground);background-color:var(--danger-foreground);border-radius:50%}.nbcontent .box.box6 .icon::before,.nbcontent .box.box6 .icon::after{content:"";position:absolute;border-radius:3px;width:2px;background:#fff;left:7px}.nbcontent .box.box6 .icon::before{top:2px;height:2px}.nbcontent .box.box6 .icon::after{height:8px;bottom:2px}.nbcontent .external-link{display:inline-flex;align-items:center;gap:.3em;color:var(--link)}.nbcontent .external-link::after{content:"";display:inline-block;width:.9em;height:.9em;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'%3E%3C/path%3E%3Cpolyline points='15 3 21 3 21 9'%3E%3C/polyline%3E%3Cline x1='10' y1='14' x2='21' y2='3'%3E%3C/line%3E%3C/svg%3E") no-repeat center/contain;background-color:var(--link);vertical-align:-0.125em;position:relative;top:-0.05em}.nbcontent .highlight{background:linear-gradient(transparent 60%, #fef08a 40%);padding:0 2px;border-radius:2px}.dark .nbcontent .highlight{background:linear-gradient(transparent 60%, #ca8a04 40%)}.nbcontent .highlight.highlight-red{background:linear-gradient(transparent 60%, #fecaca 40%)}.dark .nbcontent .highlight.highlight-red{background:linear-gradient(transparent 60%, #dc2626 40%)}.nbcontent .highlight.highlight-green{background:linear-gradient(transparent 60%, #bbf7d0 40%)}.dark .nbcontent .highlight.highlight-green{background:linear-gradient(transparent 60%, #16a34a 40%)}.nbcontent .highlight.highlight-blue{background:linear-gradient(transparent 60%, #bfdbfe 40%)}.dark .nbcontent .highlight.highlight-blue{background:linear-gradient(transparent 60%, #2563eb 40%)}.dark .nbcontent{--background: oklch(14.1% 0.005 285.823deg);--foreground: oklch(98.5% 0 0deg);--primary: oklch(92% 0.004 286.32deg);--primary-foreground: oklch(21% 0.006 285.885deg);--secondary: oklch(27.4% 0.006 286.033deg);--secondary-foreground: oklch(98.5% 0 0deg);--muted: oklch(27.4% 0.006 286.033deg);--muted-foreground: oklch(70.5% 0.015 286.067deg);--accent: oklch(27.4% 0.006 286.033deg);--accent-foreground: oklch(98.5% 0 0deg);--destructive: oklch(70.4% 0.191 22.216deg);--border: oklch(100% 0 0deg / 0.1);--input: oklch(100% 0 0deg / 0.15);--ring: oklch(55.2% 0.016 285.938deg);--link: oklch(45.2% 0.313214 264.052deg);--warning: oklch(97.54% 0.025552 84.593deg);--warning-foreground: oklch(83.04% 0.1459 74.36deg);--danger: oklch(96.56% 0.0177 4.51deg);--danger-foreground: oklch(72.71% 0.1684 24.66deg);--rounded-xs: 4px;--rounded-sm: 7px;--rounded-md: 10px;--rounded-lg: 14px;--rounded-full: 99rem}
|