remark-dgmo 0.3.4 → 0.3.5
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/dist/theme-nord.css +96 -0
- package/package.json +5 -4
|
@@ -0,0 +1,96 @@
|
|
|
1
|
+
/* remark-dgmo — optional Nord page theme.
|
|
2
|
+
*
|
|
3
|
+
* A drop-in stylesheet that paints the whole page in the Nord palette
|
|
4
|
+
* (nordtheme.com) so the page chrome matches dgmo's default `nord` diagram
|
|
5
|
+
* palette. Framework-AGNOSTIC: it only
|
|
6
|
+
* defines the palette, a set of generic `--dgmo-*` semantic variables, and
|
|
7
|
+
* base body/diagram styling. To theme a framework's own chrome (Docusaurus
|
|
8
|
+
* Infima, Fumadocs UI, …), alias that framework's variables to the `--dgmo-*`
|
|
9
|
+
* ones in your own CSS, e.g.:
|
|
10
|
+
*
|
|
11
|
+
* :root { --ifm-background-color: var(--dgmo-bg); }
|
|
12
|
+
*
|
|
13
|
+
* Dark mode is keyed on BOTH `[data-theme="dark"]` (Docusaurus, Astro, …) and
|
|
14
|
+
* `.dark` (Fumadocs / next-themes), so it follows whichever convention your
|
|
15
|
+
* host uses — the same toggle that flips dgmo's dual-rendered diagrams.
|
|
16
|
+
*/
|
|
17
|
+
|
|
18
|
+
:root {
|
|
19
|
+
/* Nord palette */
|
|
20
|
+
--nord0: #2e3440;
|
|
21
|
+
--nord1: #3b4252;
|
|
22
|
+
--nord2: #434c5e;
|
|
23
|
+
--nord3: #4c566a;
|
|
24
|
+
--nord4: #d8dee9;
|
|
25
|
+
--nord5: #e5e9f0;
|
|
26
|
+
--nord6: #eceff4;
|
|
27
|
+
--nord7: #8fbcbb;
|
|
28
|
+
--nord8: #88c0d0;
|
|
29
|
+
--nord9: #81a1c1;
|
|
30
|
+
--nord10: #5e81ac;
|
|
31
|
+
--nord11: #bf616a;
|
|
32
|
+
--nord12: #d08770;
|
|
33
|
+
--nord13: #ebcb8b;
|
|
34
|
+
--nord14: #a3be8c;
|
|
35
|
+
--nord15: #b48ead;
|
|
36
|
+
|
|
37
|
+
/* Generic semantic tokens (light) — alias these to your framework's vars */
|
|
38
|
+
--dgmo-bg: var(--nord6);
|
|
39
|
+
--dgmo-surface: #ffffff;
|
|
40
|
+
--dgmo-elevated: var(--nord5);
|
|
41
|
+
--dgmo-fg: var(--nord0);
|
|
42
|
+
--dgmo-muted: var(--nord3);
|
|
43
|
+
--dgmo-border: var(--nord4);
|
|
44
|
+
--dgmo-accent: var(--nord10);
|
|
45
|
+
--dgmo-accent-hover: var(--nord9);
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
[data-theme="dark"],
|
|
49
|
+
.dark {
|
|
50
|
+
--dgmo-bg: var(--nord0);
|
|
51
|
+
--dgmo-surface: var(--nord1);
|
|
52
|
+
--dgmo-elevated: var(--nord2);
|
|
53
|
+
--dgmo-fg: var(--nord6);
|
|
54
|
+
--dgmo-muted: var(--nord4);
|
|
55
|
+
--dgmo-border: var(--nord3);
|
|
56
|
+
--dgmo-accent: var(--nord8);
|
|
57
|
+
--dgmo-accent-hover: var(--nord7);
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
/* === Base page === */
|
|
61
|
+
body {
|
|
62
|
+
background: var(--dgmo-bg);
|
|
63
|
+
color: var(--dgmo-fg);
|
|
64
|
+
}
|
|
65
|
+
|
|
66
|
+
a {
|
|
67
|
+
color: var(--dgmo-accent);
|
|
68
|
+
}
|
|
69
|
+
a:hover {
|
|
70
|
+
color: var(--dgmo-accent-hover);
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
/* === Diagram cards ===
|
|
74
|
+
* Frame each diagram so it reads as a discrete card against the page. The
|
|
75
|
+
* SVG carries its own palette background, so the card adds only a border,
|
|
76
|
+
* radius, and a touch of surface padding. Targets the wrapper `<figure>`
|
|
77
|
+
* (`dgmo dgmo--diagram`); showcase cards already have `.dgmo-card`. */
|
|
78
|
+
.dgmo--diagram,
|
|
79
|
+
.dgmo-card {
|
|
80
|
+
background: var(--dgmo-surface);
|
|
81
|
+
border: 1px solid var(--dgmo-border);
|
|
82
|
+
border-radius: 0.6rem;
|
|
83
|
+
padding: 1rem;
|
|
84
|
+
margin: 1.25rem 0;
|
|
85
|
+
}
|
|
86
|
+
.dgmo-card {
|
|
87
|
+
padding: 0; /* its inner .dgmo-svg / toolbar handle spacing */
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
/* Caption under a diagram, when present */
|
|
91
|
+
.dgmo-caption {
|
|
92
|
+
color: var(--dgmo-muted);
|
|
93
|
+
font-size: 0.85em;
|
|
94
|
+
margin-top: 0.5rem;
|
|
95
|
+
text-align: center;
|
|
96
|
+
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "remark-dgmo",
|
|
3
|
-
"version": "0.3.
|
|
3
|
+
"version": "0.3.5",
|
|
4
4
|
"description": "Remark plugin to render DGMO diagrams from fenced code blocks at build time. Framework-agnostic core shared by astro-dgmo, docusaurus-plugin-dgmo, and any unified pipeline.",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"repository": {
|
|
@@ -43,7 +43,8 @@
|
|
|
43
43
|
"default": "./dist/remark-plugin.js"
|
|
44
44
|
},
|
|
45
45
|
"./client.js": "./dist/client.js",
|
|
46
|
-
"./client.css": "./dist/client.css"
|
|
46
|
+
"./client.css": "./dist/client.css",
|
|
47
|
+
"./theme-nord.css": "./dist/theme-nord.css"
|
|
47
48
|
},
|
|
48
49
|
"files": [
|
|
49
50
|
"dist",
|
|
@@ -55,8 +56,8 @@
|
|
|
55
56
|
"node": ">=20.6"
|
|
56
57
|
},
|
|
57
58
|
"scripts": {
|
|
58
|
-
"build": "tsup && cp styles/client.css dist/client.css",
|
|
59
|
-
"postbuild": "test -f dist/client.css && test -f dist/client.js",
|
|
59
|
+
"build": "tsup && cp styles/client.css dist/client.css && cp styles/theme-nord.css dist/theme-nord.css",
|
|
60
|
+
"postbuild": "test -f dist/client.css && test -f dist/client.js && test -f dist/theme-nord.css",
|
|
60
61
|
"dev": "tsup --watch",
|
|
61
62
|
"typecheck": "tsc --noEmit",
|
|
62
63
|
"test": "vitest run --coverage",
|