remark-dgmo 0.1.2 → 0.1.3

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.
Files changed (2) hide show
  1. package/dist/client.css +71 -1
  2. package/package.json +1 -1
package/dist/client.css CHANGED
@@ -1,4 +1,74 @@
1
- /* remark-dgmo color-mode visibility override the [data-theme="dark"] selector for .dark-style toggles. */
1
+ /* remark-dgmo visibility, sizing, and showcase chrome.
2
+ * Override the `[data-theme="dark"]` selector if your site uses
3
+ * `.dark` or another convention. */
4
+
5
+ /* === Color-mode visibility === */
2
6
  .dgmo-dark { display: none; }
3
7
  [data-theme="dark"] .dgmo-light { display: none; }
4
8
  [data-theme="dark"] .dgmo-dark { display: block; }
9
+
10
+ /* === Diagram sizing ===
11
+ * SVGs are emitted with viewBox only (no fixed width/height). Force them
12
+ * to fill their wrapper so light and dark variants render at identical
13
+ * sizes — without this, browsers fall back to the 300x150 UA default and
14
+ * the two themes can disagree depending on host CSS. */
15
+ .dgmo-light > svg,
16
+ .dgmo-dark > svg,
17
+ .dgmo-svg > svg {
18
+ display: block;
19
+ width: 100%;
20
+ height: auto;
21
+ max-width: 100%;
22
+ }
23
+
24
+ /* === Showcase mode: source block ===
25
+ * <pre> is browser-default `white-space: pre`, but Docusaurus and several
26
+ * other docs frameworks reset that. Force preservation here so the source
27
+ * keeps its newlines and renders as code. */
28
+ .dgmo-pre {
29
+ white-space: pre;
30
+ overflow-x: auto;
31
+ font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
32
+ font-size: 0.85em;
33
+ line-height: 1.5;
34
+ margin: 0;
35
+ padding: 1em;
36
+ }
37
+ .dgmo-code { display: block; }
38
+
39
+ /* === Showcase mode: card + toolbar === */
40
+ .dgmo-card {
41
+ border: 1px solid rgba(127, 127, 127, 0.2);
42
+ border-radius: 0.5em;
43
+ overflow: hidden;
44
+ }
45
+ .dgmo-source-wrap {
46
+ border-bottom: 1px solid rgba(127, 127, 127, 0.2);
47
+ }
48
+ .dgmo-toolbar {
49
+ display: flex;
50
+ align-items: center;
51
+ justify-content: space-between;
52
+ padding: 0.4em 0.75em;
53
+ background: rgba(127, 127, 127, 0.07);
54
+ font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
55
+ font-size: 0.75em;
56
+ color: rgba(127, 127, 127, 0.95);
57
+ }
58
+ .dgmo-toolbar-actions {
59
+ display: flex;
60
+ gap: 0.4em;
61
+ }
62
+ .dgmo-toolbar-btn {
63
+ background: none;
64
+ border: 0;
65
+ padding: 0.25em;
66
+ color: inherit;
67
+ cursor: pointer;
68
+ display: inline-flex;
69
+ align-items: center;
70
+ opacity: 0.7;
71
+ transition: opacity 0.15s ease;
72
+ }
73
+ .dgmo-toolbar-btn:hover { opacity: 1; }
74
+ .dgmo-copy--success { color: #5cba7a; opacity: 1; }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "remark-dgmo",
3
- "version": "0.1.2",
3
+ "version": "0.1.3",
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": {