@refrakt-md/lumina 0.14.0 → 0.14.2

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 (36) hide show
  1. package/dist/presets/catppuccin.d.ts +21 -0
  2. package/dist/presets/catppuccin.d.ts.map +1 -0
  3. package/dist/presets/catppuccin.js +100 -0
  4. package/dist/presets/catppuccin.js.map +1 -0
  5. package/dist/presets/dracula.d.ts +28 -0
  6. package/dist/presets/dracula.d.ts.map +1 -0
  7. package/dist/presets/dracula.js +73 -0
  8. package/dist/presets/dracula.js.map +1 -0
  9. package/dist/presets/gruvbox.d.ts +21 -0
  10. package/dist/presets/gruvbox.d.ts.map +1 -0
  11. package/dist/presets/gruvbox.js +98 -0
  12. package/dist/presets/gruvbox.js.map +1 -0
  13. package/dist/presets/nord.d.ts +46 -0
  14. package/dist/presets/nord.d.ts.map +1 -0
  15. package/dist/presets/nord.js +127 -0
  16. package/dist/presets/nord.js.map +1 -0
  17. package/dist/presets/one-dark.d.ts +21 -0
  18. package/dist/presets/one-dark.d.ts.map +1 -0
  19. package/dist/presets/one-dark.js +62 -0
  20. package/dist/presets/one-dark.js.map +1 -0
  21. package/dist/presets/solarized.d.ts +39 -0
  22. package/dist/presets/solarized.d.ts.map +1 -0
  23. package/dist/presets/solarized.js +121 -0
  24. package/dist/presets/solarized.js.map +1 -0
  25. package/dist/presets/tokyo-night.d.ts +22 -0
  26. package/dist/presets/tokyo-night.d.ts.map +1 -0
  27. package/dist/presets/tokyo-night.js +99 -0
  28. package/dist/presets/tokyo-night.js.map +1 -0
  29. package/package.json +32 -4
  30. package/styles/elements/table.css +4 -0
  31. package/styles/global.css +9 -0
  32. package/styles/runes/compare.css +9 -0
  33. package/styles/runes/cta.css +14 -0
  34. package/styles/runes/diff.css +40 -31
  35. package/styles/runes/hero.css +24 -0
  36. package/styles/runes/nav.css +17 -3
@@ -0,0 +1,62 @@
1
+ /**
2
+ * One Dark — Atom's signature dark theme. Created by the GitHub / Atom team.
3
+ *
4
+ * Phase 1 of SPEC-057 ships dark-only — the official "One Light" sibling
5
+ * is a separate published theme rather than a `modes` overlay on the same
6
+ * hue family, and defers to Phase 2.
7
+ *
8
+ * Important historical: Atom was the first widely-adopted editor with
9
+ * custom theme APIs, and One Dark is the palette that defined the
10
+ * "blue-grey canvas + warm accent" aesthetic now common across modern
11
+ * editors (Tokyo Night and Catppuccin Mocha both trace lineage here).
12
+ *
13
+ * Derived from One Dark by GitHub / Atom contributors, MIT licensed.
14
+ * https://github.com/atom/atom/tree/master/packages/one-dark-syntax
15
+ *
16
+ * Source variables: `packages/one-dark-syntax/styles/colors.less`.
17
+ */
18
+ const oneDark = {
19
+ modes: {
20
+ dark: {
21
+ color: {
22
+ bg: '#282c34', // syntax-bg — canonical One Dark canvas
23
+ text: '#abb2bf', // mono-1 — default text
24
+ muted: '#828997', // mono-2 — secondary text
25
+ border: '#3e4451', // syntax-cursor-line / guide
26
+ primary: '#528bff', // syntax-accent — Atom's interactive blue
27
+ 'primary-hover': '#61afef', // hue-2 — function blue
28
+ surface: {
29
+ base: '#21252b', // background-2 — elevated card
30
+ hover: '#2c313a',
31
+ active: '#3a3f4b',
32
+ raised: '#21252b',
33
+ },
34
+ code: {
35
+ bg: '#282c34', // Same as canvas — Atom uses uniform dark surface
36
+ text: '#abb2bf',
37
+ 'inline-bg': '#3e4451', // syntax-cursor-line for inline elevation
38
+ },
39
+ },
40
+ syntax: {
41
+ keyword: '#c678dd', // hue-3 (purple) — control flow, declarations
42
+ function: '#61afef', // hue-2 (blue) — function names
43
+ type: '#e5c07b', // hue-6-2 (yellow) — class/type names
44
+ string: '#98c379', // hue-4 (green) — strings
45
+ constant: '#d19a66', // hue-6 (orange) — numbers, booleans, language constants
46
+ comment: '#5c6370', // mono-3 — comments
47
+ punctuation: '#abb2bf', // mono-1 — default text for punctuation
48
+ variable: '#e06c75', // hue-5 (red) — Atom uses red for variables / `this`
49
+ // Extended roles where One Dark has a distinct intent
50
+ number: '#d19a66', // hue-6 (orange) — same as constant; One Dark groups them
51
+ regex: '#56b6c2', // hue-1 (cyan) — distinct from string green
52
+ tag: '#e06c75', // hue-5 (red) — JSX/HTML tags
53
+ attribute: '#d19a66', // hue-6 (orange) — JSX/HTML attributes
54
+ operator: '#56b6c2', // hue-1 (cyan) — operators get their own hue
55
+ // `parameter`, `property`, `link`, `string-expression` left unset
56
+ // (cascade through fallback).
57
+ },
58
+ },
59
+ },
60
+ };
61
+ export default oneDark;
62
+ //# sourceMappingURL=one-dark.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"one-dark.js","sourceRoot":"","sources":["../../src/presets/one-dark.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,OAAO,GAAsB;IAClC,KAAK,EAAE;QACN,IAAI,EAAE;YACL,KAAK,EAAE;gBACN,EAAE,EAAE,SAAS,EAAY,wCAAwC;gBACjE,IAAI,EAAE,SAAS,EAAU,wBAAwB;gBACjD,KAAK,EAAE,SAAS,EAAS,0BAA0B;gBACnD,MAAM,EAAE,SAAS,EAAQ,6BAA6B;gBACtD,OAAO,EAAE,SAAS,EAAO,0CAA0C;gBACnE,eAAe,EAAE,SAAS,EAAE,wBAAwB;gBACpD,OAAO,EAAE;oBACR,IAAI,EAAE,SAAS,EAAM,+BAA+B;oBACpD,KAAK,EAAE,SAAS;oBAChB,MAAM,EAAE,SAAS;oBACjB,MAAM,EAAE,SAAS;iBACjB;gBACD,IAAI,EAAE;oBACL,EAAE,EAAE,SAAS,EAAU,kDAAkD;oBACzE,IAAI,EAAE,SAAS;oBACf,WAAW,EAAE,SAAS,EAAE,0CAA0C;iBAClE;aACD;YACD,MAAM,EAAE;gBACP,OAAO,EAAG,SAAS,EAAI,8CAA8C;gBACrE,QAAQ,EAAE,SAAS,EAAI,kCAAkC;gBACzD,IAAI,EAAM,SAAS,EAAI,sCAAsC;gBAC7D,MAAM,EAAI,SAAS,EAAI,2BAA2B;gBAClD,QAAQ,EAAE,SAAS,EAAI,yDAAyD;gBAChF,OAAO,EAAG,SAAS,EAAI,2BAA2B;gBAClD,WAAW,EAAE,SAAS,EAAE,8CAA8C;gBACtE,QAAQ,EAAE,SAAS,EAAI,uDAAuD;gBAE9E,sDAAsD;gBACtD,MAAM,EAAK,SAAS,EAAI,0DAA0D;gBAClF,KAAK,EAAM,SAAS,EAAI,8CAA8C;gBACtE,GAAG,EAAQ,SAAS,EAAI,iCAAiC;gBACzD,SAAS,EAAE,SAAS,EAAI,uCAAuC;gBAC/D,QAAQ,EAAG,SAAS,EAAI,+CAA+C;gBACvE,kEAAkE;gBAClE,8BAA8B;aAC9B;SACD;KACD;CACD,CAAC;AAEF,eAAe,OAAO,CAAC"}
@@ -0,0 +1,39 @@
1
+ import type { ThemeTokensConfig } from '@refrakt-md/types';
2
+ /**
3
+ * Solarized — Ethan Schoonover's iconic 2011 palette, designed for both
4
+ * light and dark canvases using the same 16 hues. The eight accent colours
5
+ * (yellow, orange, red, magenta, violet, blue, cyan, green) are identical
6
+ * across modes; only the canvas / text family flips (base3 → base03 for
7
+ * canvas, base00 → base0 for text).
8
+ *
9
+ * This is the lineup's deliberately mode-symmetric palette — the test case
10
+ * for SPEC-057's "one preset per palette identity, light + dark in
11
+ * modes.dark" decision. Most palettes shift hues between modes; Solarized
12
+ * is the exception that proves the contract handles it.
13
+ *
14
+ * The 16-colour palette:
15
+ *
16
+ * Base tones (mode-flipped):
17
+ * base03 #002b36 darkest base3 #fdf6e3 lightest
18
+ * base02 #073642 base2 #eee8d5
19
+ * base01 #586e75 comments / secondary content (both modes)
20
+ * base00 #657b83 light text / dark muted
21
+ * base0 #839496 dark text / light muted
22
+ * base1 #93a1a1 optional emphasised content
23
+ *
24
+ * Accents (identical across modes):
25
+ * yellow #b58900 type, class
26
+ * orange #cb4b16 number, identifier
27
+ * red #dc322f keyword, tag
28
+ * magenta #d33682 function (alt) — used here for string-expression
29
+ * violet #6c71c4 constant, operator
30
+ * blue #268bd2 function-call
31
+ * cyan #2aa198 string
32
+ * green #859900 comment-string, regex
33
+ *
34
+ * Derived from Solarized by Ethan Schoonover, MIT licensed.
35
+ * https://ethanschoonover.com/solarized/
36
+ */
37
+ declare const solarized: ThemeTokensConfig;
38
+ export default solarized;
39
+ //# sourceMappingURL=solarized.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"solarized.d.ts","sourceRoot":"","sources":["../../src/presets/solarized.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAE3D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AACH,QAAA,MAAM,SAAS,EAAE,iBAsFhB,CAAC;AAEF,eAAe,SAAS,CAAC"}
@@ -0,0 +1,121 @@
1
+ /**
2
+ * Solarized — Ethan Schoonover's iconic 2011 palette, designed for both
3
+ * light and dark canvases using the same 16 hues. The eight accent colours
4
+ * (yellow, orange, red, magenta, violet, blue, cyan, green) are identical
5
+ * across modes; only the canvas / text family flips (base3 → base03 for
6
+ * canvas, base00 → base0 for text).
7
+ *
8
+ * This is the lineup's deliberately mode-symmetric palette — the test case
9
+ * for SPEC-057's "one preset per palette identity, light + dark in
10
+ * modes.dark" decision. Most palettes shift hues between modes; Solarized
11
+ * is the exception that proves the contract handles it.
12
+ *
13
+ * The 16-colour palette:
14
+ *
15
+ * Base tones (mode-flipped):
16
+ * base03 #002b36 darkest base3 #fdf6e3 lightest
17
+ * base02 #073642 base2 #eee8d5
18
+ * base01 #586e75 comments / secondary content (both modes)
19
+ * base00 #657b83 light text / dark muted
20
+ * base0 #839496 dark text / light muted
21
+ * base1 #93a1a1 optional emphasised content
22
+ *
23
+ * Accents (identical across modes):
24
+ * yellow #b58900 type, class
25
+ * orange #cb4b16 number, identifier
26
+ * red #dc322f keyword, tag
27
+ * magenta #d33682 function (alt) — used here for string-expression
28
+ * violet #6c71c4 constant, operator
29
+ * blue #268bd2 function-call
30
+ * cyan #2aa198 string
31
+ * green #859900 comment-string, regex
32
+ *
33
+ * Derived from Solarized by Ethan Schoonover, MIT licensed.
34
+ * https://ethanschoonover.com/solarized/
35
+ */
36
+ const solarized = {
37
+ // Light mode — base3 canvas with base00 text. The eight accents are
38
+ // shared with the dark mode (see comment in modes.dark).
39
+ color: {
40
+ bg: '#fdf6e3', // base3 — canonical light canvas
41
+ text: '#657b83', // base00 — light text
42
+ muted: '#93a1a1', // base1 — light muted / optional emphasis
43
+ border: '#eee8d5', // base2 — light secondary surface as border
44
+ primary: '#268bd2', // blue — Solarized's interactive accent
45
+ 'primary-hover': '#2aa198', // cyan
46
+ surface: {
47
+ base: '#eee8d5', // base2 — light elevated card
48
+ hover: '#fdf6e3',
49
+ active: '#eee8d5',
50
+ raised: '#fdf6e3',
51
+ },
52
+ code: {
53
+ bg: '#fdf6e3', // base3 — uniform canvas in light mode
54
+ text: '#657b83', // base00
55
+ 'inline-bg': '#eee8d5', // base2 — slight elevation for inline code
56
+ },
57
+ },
58
+ syntax: {
59
+ keyword: '#dc322f', // red — control flow, declarations
60
+ function: '#268bd2', // blue — function names
61
+ type: '#b58900', // yellow — Solarized's "class/type" colour
62
+ string: '#2aa198', // cyan — strings
63
+ constant: '#6c71c4', // violet — language constants
64
+ comment: '#93a1a1', // base1 — comments (Solarized uses lighter base in light mode)
65
+ punctuation: '#657b83', // base00 — Solarized treats punctuation as default text
66
+ variable: '#657b83', // base00 — identifiers read as default text
67
+ // Extended roles — same accent palette as the core roles
68
+ number: '#cb4b16', // orange — Solarized splits numbers from boolean-constants
69
+ regex: '#859900', // green — Solarized's "string-special" colour
70
+ tag: '#dc322f', // red — HTML/JSX tags read like keywords in Solarized
71
+ attribute: '#268bd2', // blue — attribute names align with function-family
72
+ operator: '#6c71c4', // violet — Solarized's operator colour
73
+ 'string-expression': '#d33682', // magenta — interpolations get the magenta accent
74
+ // `parameter`, `property`, `link` left unset (cascade through fallback).
75
+ },
76
+ modes: {
77
+ dark: {
78
+ color: {
79
+ bg: '#002b36', // base03 — canonical dark canvas
80
+ text: '#839496', // base0 — dark text
81
+ muted: '#586e75', // base01 — dark muted
82
+ border: '#073642', // base02 — dark secondary surface as border
83
+ primary: '#268bd2', // blue — same as light (accents are mode-symmetric)
84
+ 'primary-hover': '#2aa198', // cyan
85
+ surface: {
86
+ base: '#073642', // base02 — dark elevated card
87
+ hover: '#586e75',
88
+ active: '#586e75',
89
+ raised: '#073642',
90
+ },
91
+ code: {
92
+ bg: '#002b36', // base03 — uniform canvas in dark mode
93
+ text: '#839496', // base0
94
+ 'inline-bg': '#073642', // base02 — slight elevation
95
+ },
96
+ },
97
+ // Solarized's design intent: accent hues are mode-symmetric. The
98
+ // values below are intentionally identical to the base block —
99
+ // restated rather than omitted, so a reader looking at just the
100
+ // dark block sees the full picture.
101
+ syntax: {
102
+ keyword: '#dc322f', // red
103
+ function: '#268bd2', // blue
104
+ type: '#b58900', // yellow
105
+ string: '#2aa198', // cyan
106
+ constant: '#6c71c4', // violet
107
+ comment: '#586e75', // base01 — comments use the darker base in dark mode
108
+ punctuation: '#839496', // base0
109
+ variable: '#839496', // base0
110
+ number: '#cb4b16', // orange
111
+ regex: '#859900', // green
112
+ tag: '#dc322f', // red
113
+ attribute: '#268bd2', // blue
114
+ operator: '#6c71c4', // violet
115
+ 'string-expression': '#d33682', // magenta
116
+ },
117
+ },
118
+ },
119
+ };
120
+ export default solarized;
121
+ //# sourceMappingURL=solarized.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"solarized.js","sourceRoot":"","sources":["../../src/presets/solarized.ts"],"names":[],"mappings":"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"}
@@ -0,0 +1,22 @@
1
+ import type { ThemeTokensConfig } from '@refrakt-md/types';
2
+ /**
3
+ * Tokyo Night — Enkia's blue-magenta-cyan palette inspired by the city's
4
+ * neon-on-night aesthetic.
5
+ *
6
+ * Tokyo Night ships in three variants: **Storm** (dark, the canonical default),
7
+ * **Moon** (lighter dark), and **Day** (light). Phase 1 of SPEC-057 ships
8
+ * the canonical pair — Storm for dark, Day for light. Moon defers to a
9
+ * future milestone.
10
+ *
11
+ * Tokyo Night is the lineup's most aggressive role-splitter. It deliberately
12
+ * uses distinct hues for `type`, `function`, `parameter`, `keyword`, and
13
+ * `number` — exercising SPEC-056's extended role contract more thoroughly
14
+ * than any other lineup member. If Tokyo Night maps cleanly onto our
15
+ * contract, the contract was sized correctly.
16
+ *
17
+ * Derived from Tokyo Night by Enkia, MIT licensed.
18
+ * https://github.com/enkia/tokyo-night-vscode-theme
19
+ */
20
+ declare const tokyoNight: ThemeTokensConfig;
21
+ export default tokyoNight;
22
+ //# sourceMappingURL=tokyo-night.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"tokyo-night.d.ts","sourceRoot":"","sources":["../../src/presets/tokyo-night.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAE3D;;;;;;;;;;;;;;;;;GAiBG;AACH,QAAA,MAAM,UAAU,EAAE,iBAiFjB,CAAC;AAEF,eAAe,UAAU,CAAC"}
@@ -0,0 +1,99 @@
1
+ /**
2
+ * Tokyo Night — Enkia's blue-magenta-cyan palette inspired by the city's
3
+ * neon-on-night aesthetic.
4
+ *
5
+ * Tokyo Night ships in three variants: **Storm** (dark, the canonical default),
6
+ * **Moon** (lighter dark), and **Day** (light). Phase 1 of SPEC-057 ships
7
+ * the canonical pair — Storm for dark, Day for light. Moon defers to a
8
+ * future milestone.
9
+ *
10
+ * Tokyo Night is the lineup's most aggressive role-splitter. It deliberately
11
+ * uses distinct hues for `type`, `function`, `parameter`, `keyword`, and
12
+ * `number` — exercising SPEC-056's extended role contract more thoroughly
13
+ * than any other lineup member. If Tokyo Night maps cleanly onto our
14
+ * contract, the contract was sized correctly.
15
+ *
16
+ * Derived from Tokyo Night by Enkia, MIT licensed.
17
+ * https://github.com/enkia/tokyo-night-vscode-theme
18
+ */
19
+ const tokyoNight = {
20
+ // Day (light) base.
21
+ color: {
22
+ bg: '#e1e2e7', // editor.background — canonical Day canvas
23
+ text: '#3760bf', // editor.foreground — Day's deep-blue text
24
+ muted: '#848cb5', // comment colour
25
+ border: '#cbcdd9', // slight separator
26
+ primary: '#2e7de9', // function blue — Day's interactive accent
27
+ 'primary-hover': '#007197', // class cyan
28
+ surface: {
29
+ base: '#d6d8de', // slightly elevated card surface
30
+ hover: '#cbcdd9',
31
+ active: '#bdc0c9',
32
+ raised: '#e9eaef',
33
+ },
34
+ code: {
35
+ bg: '#d6d8de', // elevated surface for code blocks
36
+ text: '#3760bf',
37
+ 'inline-bg': '#cbcdd9',
38
+ },
39
+ },
40
+ syntax: {
41
+ keyword: '#9854f1', // magenta — Tokyo Night Day's keyword colour
42
+ function: '#2e7de9', // blue — function names
43
+ type: '#007197', // cyan — class/type names (SPEC-056 split)
44
+ string: '#587539', // deep green — strings
45
+ constant: '#b15c00', // orange — language constants
46
+ comment: '#848cb5',
47
+ punctuation: '#3760bf', // foreground for default punctuation
48
+ variable: '#3760bf',
49
+ // Extended roles — Tokyo Night's main fidelity story
50
+ number: '#b15c00', // orange — same as constant in Day; split out for traceability
51
+ regex: '#387068', // teal — distinct from string green
52
+ tag: '#f52a65', // red — JSX/HTML tags get a punchy distinct hue
53
+ attribute: '#b15c00', // orange — attributes align with number/constant family
54
+ operator: '#006c86', // teal-cyan — Tokyo Night gives operators their own hue
55
+ parameter: '#b15c00', // orange — parameters in declaration position
56
+ // `property`, `link`, `string-expression` left unset (cascade through fallback).
57
+ },
58
+ modes: {
59
+ dark: {
60
+ color: {
61
+ bg: '#24283b', // editor.background — canonical Storm canvas
62
+ text: '#c0caf5', // editor.foreground — Storm's bright lavender-white
63
+ muted: '#565f89', // comment colour
64
+ border: '#3b4261',
65
+ primary: '#7aa2f7', // function blue
66
+ 'primary-hover': '#7dcfff', // cyan
67
+ surface: {
68
+ base: '#1f2335', // slightly recessed
69
+ hover: '#2b3047',
70
+ active: '#3b4261',
71
+ raised: '#1f2335',
72
+ },
73
+ code: {
74
+ bg: '#1f2335', // Storm's deeper code surface
75
+ text: '#c0caf5',
76
+ 'inline-bg': '#2b3047',
77
+ },
78
+ },
79
+ syntax: {
80
+ keyword: '#bb9af7', // magenta — Storm keyword
81
+ function: '#7aa2f7', // blue
82
+ type: '#7dcfff', // cyan — Storm's "class/type"
83
+ string: '#9ece6a', // green
84
+ constant: '#ff9e64', // orange
85
+ comment: '#565f89',
86
+ punctuation: '#c0caf5',
87
+ variable: '#c0caf5',
88
+ number: '#ff9e64', // orange — same as constant in Storm; split out for traceability
89
+ regex: '#b4f9f8', // light cyan
90
+ tag: '#f7768e', // red — Storm's tag colour
91
+ attribute: '#e0af68', // yellow — Storm attributes get a dedicated yellow
92
+ operator: '#89ddff', // cyan-blue
93
+ parameter: '#e0af68', // yellow — Storm parameters in declaration
94
+ },
95
+ },
96
+ },
97
+ };
98
+ export default tokyoNight;
99
+ //# sourceMappingURL=tokyo-night.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"tokyo-night.js","sourceRoot":"","sources":["../../src/presets/tokyo-night.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;GAiBG;AACH,MAAM,UAAU,GAAsB;IACrC,oBAAoB;IACpB,KAAK,EAAE;QACN,EAAE,EAAE,SAAS,EAAY,2CAA2C;QACpE,IAAI,EAAE,SAAS,EAAW,2CAA2C;QACrE,KAAK,EAAE,SAAS,EAAU,iBAAiB;QAC3C,MAAM,EAAE,SAAS,EAAS,mBAAmB;QAC7C,OAAO,EAAE,SAAS,EAAQ,2CAA2C;QACrE,eAAe,EAAE,SAAS,EAAE,aAAa;QACzC,OAAO,EAAE;YACR,IAAI,EAAE,SAAS,EAAM,iCAAiC;YACtD,KAAK,EAAE,SAAS;YAChB,MAAM,EAAE,SAAS;YACjB,MAAM,EAAE,SAAS;SACjB;QACD,IAAI,EAAE;YACL,EAAE,EAAE,SAAS,EAAU,mCAAmC;YAC1D,IAAI,EAAE,SAAS;YACf,WAAW,EAAE,SAAS;SACtB;KACD;IACD,MAAM,EAAE;QACP,OAAO,EAAG,SAAS,EAAI,6CAA6C;QACpE,QAAQ,EAAE,SAAS,EAAI,0BAA0B;QACjD,IAAI,EAAM,SAAS,EAAI,6CAA6C;QACpE,MAAM,EAAI,SAAS,EAAI,uBAAuB;QAC9C,QAAQ,EAAE,SAAS,EAAI,8BAA8B;QACrD,OAAO,EAAG,SAAS;QACnB,WAAW,EAAE,SAAS,EAAE,qCAAqC;QAC7D,QAAQ,EAAE,SAAS;QAEnB,qDAAqD;QACrD,MAAM,EAAK,SAAS,EAAI,+DAA+D;QACvF,KAAK,EAAM,SAAS,EAAI,oCAAoC;QAC5D,GAAG,EAAQ,SAAS,EAAI,gDAAgD;QACxE,SAAS,EAAE,SAAS,EAAI,wDAAwD;QAChF,QAAQ,EAAG,SAAS,EAAI,wDAAwD;QAChF,SAAS,EAAE,SAAS,EAAI,8CAA8C;QACtE,iFAAiF;KACjF;IAED,KAAK,EAAE;QACN,IAAI,EAAE;YACL,KAAK,EAAE;gBACN,EAAE,EAAE,SAAS,EAAY,6CAA6C;gBACtE,IAAI,EAAE,SAAS,EAAU,oDAAoD;gBAC7E,KAAK,EAAE,SAAS,EAAS,iBAAiB;gBAC1C,MAAM,EAAE,SAAS;gBACjB,OAAO,EAAE,SAAS,EAAO,gBAAgB;gBACzC,eAAe,EAAE,SAAS,EAAE,OAAO;gBACnC,OAAO,EAAE;oBACR,IAAI,EAAE,SAAS,EAAM,oBAAoB;oBACzC,KAAK,EAAE,SAAS;oBAChB,MAAM,EAAE,SAAS;oBACjB,MAAM,EAAE,SAAS;iBACjB;gBACD,IAAI,EAAE;oBACL,EAAE,EAAE,SAAS,EAAU,8BAA8B;oBACrD,IAAI,EAAE,SAAS;oBACf,WAAW,EAAE,SAAS;iBACtB;aACD;YACD,MAAM,EAAE;gBACP,OAAO,EAAG,SAAS,EAAI,0BAA0B;gBACjD,QAAQ,EAAE,SAAS,EAAI,OAAO;gBAC9B,IAAI,EAAM,SAAS,EAAI,8BAA8B;gBACrD,MAAM,EAAI,SAAS,EAAI,QAAQ;gBAC/B,QAAQ,EAAE,SAAS,EAAI,SAAS;gBAChC,OAAO,EAAG,SAAS;gBACnB,WAAW,EAAE,SAAS;gBACtB,QAAQ,EAAE,SAAS;gBAEnB,MAAM,EAAK,SAAS,EAAI,iEAAiE;gBACzF,KAAK,EAAM,SAAS,EAAI,aAAa;gBACrC,GAAG,EAAQ,SAAS,EAAI,2BAA2B;gBACnD,SAAS,EAAE,SAAS,EAAI,mDAAmD;gBAC3E,QAAQ,EAAG,SAAS,EAAI,YAAY;gBACpC,SAAS,EAAE,SAAS,EAAI,2CAA2C;aACnE;SACD;KACD;CACD,CAAC;AAEF,eAAe,UAAU,CAAC"}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@refrakt-md/lumina",
3
3
  "description": "Lumina theme for refrakt.md — design tokens, CSS, identity transform, and layout configs",
4
- "version": "0.14.0",
4
+ "version": "0.14.2",
5
5
  "type": "module",
6
6
  "license": "MIT",
7
7
  "repository": {
@@ -35,6 +35,34 @@
35
35
  "types": "./dist/presets/niwaki.d.ts",
36
36
  "default": "./dist/presets/niwaki.js"
37
37
  },
38
+ "./presets/nord": {
39
+ "types": "./dist/presets/nord.d.ts",
40
+ "default": "./dist/presets/nord.js"
41
+ },
42
+ "./presets/dracula": {
43
+ "types": "./dist/presets/dracula.d.ts",
44
+ "default": "./dist/presets/dracula.js"
45
+ },
46
+ "./presets/solarized": {
47
+ "types": "./dist/presets/solarized.d.ts",
48
+ "default": "./dist/presets/solarized.js"
49
+ },
50
+ "./presets/catppuccin": {
51
+ "types": "./dist/presets/catppuccin.d.ts",
52
+ "default": "./dist/presets/catppuccin.js"
53
+ },
54
+ "./presets/tokyo-night": {
55
+ "types": "./dist/presets/tokyo-night.d.ts",
56
+ "default": "./dist/presets/tokyo-night.js"
57
+ },
58
+ "./presets/one-dark": {
59
+ "types": "./dist/presets/one-dark.d.ts",
60
+ "default": "./dist/presets/one-dark.js"
61
+ },
62
+ "./presets/gruvbox": {
63
+ "types": "./dist/presets/gruvbox.d.ts",
64
+ "default": "./dist/presets/gruvbox.js"
65
+ },
38
66
  "./styles/runes/*.css": "./styles/runes/*.css",
39
67
  "./assets/logo/prism.svg": "./assets/logo/prism.svg",
40
68
  "./assets/*": "./assets/*"
@@ -55,9 +83,9 @@
55
83
  "build": "tsc"
56
84
  },
57
85
  "dependencies": {
58
- "@refrakt-md/runes": "0.14.0",
59
- "@refrakt-md/transform": "0.14.0",
60
- "@refrakt-md/types": "0.14.0"
86
+ "@refrakt-md/runes": "0.14.2",
87
+ "@refrakt-md/transform": "0.14.2",
88
+ "@refrakt-md/types": "0.14.2"
61
89
  },
62
90
  "devDependencies": {
63
91
  "postcss": "^8.4.0"
@@ -30,3 +30,7 @@
30
30
  .rf-table-wrapper tr:last-child td {
31
31
  border-bottom: none;
32
32
  }
33
+ .rf-table-wrapper th code,
34
+ .rf-table-wrapper td code {
35
+ font-size: 1em;
36
+ }
package/styles/global.css CHANGED
@@ -12,7 +12,16 @@ html {
12
12
  line-height: 1.7;
13
13
  -webkit-font-smoothing: antialiased;
14
14
  -moz-osx-font-smoothing: grayscale;
15
+ -webkit-text-size-adjust: 100%;
16
+ text-size-adjust: 100%;
15
17
  transition: background-color 200ms ease, color 200ms ease;
18
+ /* Opt out of mobile Safari's "text inflation" — it auto-scales text
19
+ * inside elements wider than the viewport (e.g. the diff's
20
+ * `min-width: 40rem` split panels and any horizontally-scrolling
21
+ * code block) and makes their fonts read several pixels larger
22
+ * than designed. */
23
+ -webkit-text-size-adjust: 100%;
24
+ text-size-adjust: 100%;
16
25
  }
17
26
 
18
27
  body {
@@ -4,6 +4,15 @@
4
4
  border-radius: var(--rf-radius-md);
5
5
  overflow: hidden;
6
6
  }
7
+ .rf-compare__header {
8
+ padding: 0.5rem 1rem;
9
+ font-family: var(--rf-font-sans);
10
+ font-size: 0.75rem;
11
+ font-weight: 600;
12
+ color: var(--rf-color-muted);
13
+ background: var(--rf-color-surface);
14
+ border-bottom: 1px solid var(--rf-color-border);
15
+ }
7
16
  .rf-compare--side-by-side .rf-compare__panels {
8
17
  display: grid;
9
18
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
@@ -142,3 +142,17 @@
142
142
  margin: 0 0 1rem;
143
143
  max-width: none;
144
144
  }
145
+
146
+ /* Mobile: stack action buttons full-width so multi-button CTAs line up */
147
+ @media (max-width: 640px) {
148
+ .rf-cta ul {
149
+ flex-direction: column;
150
+ align-items: stretch;
151
+ }
152
+ .rf-cta li a,
153
+ .rf-cta nav a {
154
+ justify-content: center;
155
+ width: 100%;
156
+ box-sizing: border-box;
157
+ }
158
+ }
@@ -2,31 +2,27 @@
2
2
  .rf-diff {
3
3
  border: 1px solid var(--rf-color-border);
4
4
  border-radius: var(--rf-radius-lg);
5
- overflow-x: auto;
5
+ overflow: hidden;
6
6
  font-size: 0.875rem;
7
+ background: var(--rf-color-code-bg);
7
8
  }
8
- .rf-diff__split-container {
9
- display: grid;
10
- grid-template-columns: 1fr 1fr;
11
- min-width: 40rem;
12
- }
13
- .rf-diff__split-container .rf-diff__panel:first-child {
14
- border-right: 1px solid var(--rf-color-border);
15
- }
16
- .rf-diff__header,
17
- .rf-diff__header-after {
9
+ .rf-diff__header {
18
10
  padding: 0.5rem 1rem;
19
11
  font-family: var(--rf-font-sans);
20
12
  font-size: 0.75rem;
21
13
  font-weight: 600;
14
+ color: var(--rf-color-muted);
22
15
  background: var(--rf-color-surface);
23
16
  border-bottom: 1px solid var(--rf-color-border);
24
17
  }
25
- .rf-diff__header {
26
- color: var(--rf-color-danger);
18
+ .rf-diff__split-container {
19
+ display: grid;
20
+ grid-template-columns: 1fr 1fr;
21
+ min-width: 40rem;
22
+ overflow-x: auto;
27
23
  }
28
- .rf-diff__header-after {
29
- color: var(--rf-color-success);
24
+ .rf-diff__split-container .rf-diff__panel:first-child {
25
+ border-right: 1px solid var(--rf-color-border);
30
26
  }
31
27
  .rf-diff__code {
32
28
  margin: 0;
@@ -42,31 +38,39 @@
42
38
  .rf-diff__line {
43
39
  display: flex;
44
40
  min-height: 1.6em;
41
+ border-left: 3px solid transparent;
45
42
  }
46
43
  .rf-diff__line[data-type="equal"] { background: transparent; }
47
- .rf-diff__line[data-type="remove"] { background: rgba(248, 81, 73, 0.15); }
48
- .rf-diff__line[data-type="add"] { background: rgba(63, 185, 80, 0.15); }
49
- .rf-diff__line[data-type="empty"] { background: rgba(128, 128, 128, 0.05); }
50
- .rf-diff__gutter,
51
- .rf-diff__gutter-num,
52
- .rf-diff__gutter-prefix {
53
- flex-shrink: 0;
54
- padding: 0 0.5rem;
55
- user-select: none;
56
- color: var(--rf-color-muted);
44
+ .rf-diff__line[data-type="remove"] {
45
+ background: color-mix(in srgb, var(--rf-color-danger) 18%, transparent);
46
+ border-left-color: var(--rf-color-danger);
47
+ }
48
+ .rf-diff__line[data-type="add"] {
49
+ background: color-mix(in srgb, var(--rf-color-success) 18%, transparent);
50
+ border-left-color: var(--rf-color-success);
57
51
  }
52
+ .rf-diff__line[data-type="empty"] { background: transparent; }
58
53
  .rf-diff__gutter-num {
54
+ flex-shrink: 0;
55
+ padding: 0 0.5rem;
59
56
  width: 2.5em;
57
+ min-height: 1.6em;
60
58
  text-align: right;
61
59
  font-size: 0.75rem;
60
+ font-variant-numeric: tabular-nums;
61
+ user-select: none;
62
+ color: var(--rf-color-muted);
62
63
  }
63
- .rf-diff__gutter-prefix {
64
- width: 1.5em;
65
- text-align: center;
66
- font-weight: bold;
64
+ /* Change-type colour drives the directional cue — no more +/- prefix.
65
+ * Remove lines colour the before-number; add lines colour the after-number.
66
+ * The opposite side renders empty (no number) which itself signals "nothing
67
+ * here on this side". */
68
+ .rf-diff__line[data-type="remove"] .rf-diff__gutter-num[data-side="before"] {
69
+ color: var(--rf-color-danger);
70
+ }
71
+ .rf-diff__line[data-type="add"] .rf-diff__gutter-num[data-side="after"] {
72
+ color: var(--rf-color-success);
67
73
  }
68
- .rf-diff__line[data-type="remove"] .rf-diff__gutter-prefix { color: var(--rf-color-danger); }
69
- .rf-diff__line[data-type="add"] .rf-diff__gutter-prefix { color: var(--rf-color-success); }
70
74
  .rf-diff .rf-codeblock {
71
75
  margin: 0;
72
76
  }
@@ -74,4 +78,9 @@
74
78
  flex: 1;
75
79
  white-space: pre;
76
80
  padding-right: 1rem;
81
+ /* Pin the row to 1.6em even when the text is empty — the highlighted
82
+ * span for an empty input has no inline content to establish a line
83
+ * box, so without this the flex item collapses below the parent's
84
+ * min-height and rows visually drift in the split-mode grid. */
85
+ min-height: 1.6em;
77
86
  }
@@ -189,3 +189,27 @@
189
189
  .rf-hero__media pre {
190
190
  margin: 0;
191
191
  }
192
+
193
+ /* Mobile: stack actions full-width so the code block and button line up */
194
+ @media (max-width: 640px) {
195
+ .rf-hero__actions {
196
+ flex-direction: column;
197
+ align-items: stretch;
198
+ max-width: none;
199
+ }
200
+ .rf-hero__actions pre {
201
+ width: 100%;
202
+ box-sizing: border-box;
203
+ }
204
+ .rf-hero ul,
205
+ .rf-hero nav {
206
+ flex-direction: column;
207
+ align-items: stretch;
208
+ }
209
+ .rf-hero li a,
210
+ .rf-hero nav a {
211
+ justify-content: center;
212
+ width: 100%;
213
+ box-sizing: border-box;
214
+ }
215
+ }