Fix colors in tekst component
This commit is contained in:
parent
1b7df6ee1e
commit
f6ad9d5909
8
package-lock.json
generated
8
package-lock.json
generated
@ -17,7 +17,7 @@
|
|||||||
"@sealcode/file-manager": "^1.0.2",
|
"@sealcode/file-manager": "^1.0.2",
|
||||||
"@sealcode/jdd": "^0.6.6",
|
"@sealcode/jdd": "^0.6.6",
|
||||||
"@sealcode/jdd-editor": "^0.1.14",
|
"@sealcode/jdd-editor": "^0.1.14",
|
||||||
"@sealcode/sealgen": "^0.17.23",
|
"@sealcode/sealgen": "^0.17.24",
|
||||||
"@sealcode/simplemde": "^1.12.1",
|
"@sealcode/simplemde": "^1.12.1",
|
||||||
"@sealcode/ts-predicates": "^0.6.2",
|
"@sealcode/ts-predicates": "^0.6.2",
|
||||||
"@types/kill-port": "^2.0.0",
|
"@types/kill-port": "^2.0.0",
|
||||||
@ -1003,9 +1003,9 @@
|
|||||||
"integrity": "sha512-pDsGlk2KokQkwzsJDBUWJFDRpEoxxth6TMQGDJyCTmWnd1Vn+cQb5moXDKaf7cXnWb9Y6QtdNX/fPzM/3RH2Cg=="
|
"integrity": "sha512-pDsGlk2KokQkwzsJDBUWJFDRpEoxxth6TMQGDJyCTmWnd1Vn+cQb5moXDKaf7cXnWb9Y6QtdNX/fPzM/3RH2Cg=="
|
||||||
},
|
},
|
||||||
"node_modules/@sealcode/sealgen": {
|
"node_modules/@sealcode/sealgen": {
|
||||||
"version": "0.17.23",
|
"version": "0.17.24",
|
||||||
"resolved": "https://registry.npmjs.org/@sealcode/sealgen/-/sealgen-0.17.23.tgz",
|
"resolved": "https://registry.npmjs.org/@sealcode/sealgen/-/sealgen-0.17.24.tgz",
|
||||||
"integrity": "sha512-zdJuITE/8t13X1TwwFKeV3AW7rwaCSkEW52KP4Hcoa73RYgsJ7tCstIM5v5X2YCVflb7udsE9Nd7wE7JEMU8rg==",
|
"integrity": "sha512-xj3BTX2b3uFaO0Fj71inNY282Y96JiiCDFJF4dCmgWQu+yOLlzaVKF7p4bSi1CoNN9eHsvwXUEYKoRfvz8Q9GQ==",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@koa/router": "^12.0.1",
|
"@koa/router": "^12.0.1",
|
||||||
"@sealcode/file-manager": "^1.0.2",
|
"@sealcode/file-manager": "^1.0.2",
|
||||||
|
@ -82,7 +82,7 @@
|
|||||||
"@sealcode/file-manager": "^1.0.2",
|
"@sealcode/file-manager": "^1.0.2",
|
||||||
"@sealcode/jdd": "^0.6.6",
|
"@sealcode/jdd": "^0.6.6",
|
||||||
"@sealcode/jdd-editor": "^0.1.14",
|
"@sealcode/jdd-editor": "^0.1.14",
|
||||||
"@sealcode/sealgen": "^0.17.23",
|
"@sealcode/sealgen": "^0.17.24",
|
||||||
"@sealcode/simplemde": "^1.12.1",
|
"@sealcode/simplemde": "^1.12.1",
|
||||||
"@sealcode/ts-predicates": "^0.6.2",
|
"@sealcode/ts-predicates": "^0.6.2",
|
||||||
"@types/kill-port": "^2.0.0",
|
"@types/kill-port": "^2.0.0",
|
||||||
|
@ -2,5 +2,19 @@
|
|||||||
font-family: var(--font-long-text);
|
font-family: var(--font-long-text);
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
line-height: 24px;
|
line-height: 24px;
|
||||||
color: #0d4d69;
|
|
||||||
|
&.tekst--color-normal {
|
||||||
|
background-color: var(--color-brand-text-bg);
|
||||||
|
color: var(--color-brand-text-fg);
|
||||||
|
}
|
||||||
|
|
||||||
|
&.tekst--color-accent {
|
||||||
|
background-color: var(--color-brand-text-bg);
|
||||||
|
color: var(--color-brand-text-accent);
|
||||||
|
}
|
||||||
|
|
||||||
|
&.tekst--color-accent2 {
|
||||||
|
background-color: var(--color-brand-text-bg);
|
||||||
|
color: var(--color-brand-text-accent2);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
@ -8,6 +8,7 @@ import type {
|
|||||||
import { Component, ComponentArguments } from "@sealcode/jdd";
|
import { Component, ComponentArguments } from "@sealcode/jdd";
|
||||||
|
|
||||||
const component_arguments = {
|
const component_arguments = {
|
||||||
|
color: new ComponentArguments.Enum(["normal", "accent", "accent2"]),
|
||||||
content: new ComponentArguments.Markdown(),
|
content: new ComponentArguments.Markdown(),
|
||||||
} as const;
|
} as const;
|
||||||
|
|
||||||
@ -24,13 +25,16 @@ export class Tekst extends Component<typeof component_arguments> {
|
|||||||
}
|
}
|
||||||
|
|
||||||
toHTML({
|
toHTML({
|
||||||
args: { content },
|
args: { color, content },
|
||||||
classes,
|
classes,
|
||||||
jdd_context: { render_markdown, language },
|
jdd_context: { render_markdown, language },
|
||||||
index,
|
index,
|
||||||
}: ComponentToHTMLArgs<typeof component_arguments>): FlatTemplatable {
|
}: ComponentToHTMLArgs<typeof component_arguments>): FlatTemplatable {
|
||||||
return (
|
return (
|
||||||
<div class={["tekst markdown", ...classes]} style={`--jdd-index: ${index}`}>
|
<div
|
||||||
|
class={["tekst markdown", ...classes, `tekst--color-${color}`]}
|
||||||
|
style={`--jdd-index: ${index}`}
|
||||||
|
>
|
||||||
{render_markdown(language, content)}
|
{render_markdown(language, content)}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
Loading…
x
Reference in New Issue
Block a user