@fest-lib/veela 1.0.12 → 1.0.13

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/package.json +1 -1
  2. package/src/scss/ui/_code-highlight.scss +18 -7
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@fest-lib/veela",
3
3
  "description": "fest-lib Veela: CSS tokens, --c2 color functions, Agate.UX, SCSS + runtime loaders",
4
- "version": "1.0.12",
4
+ "version": "1.0.13",
5
5
  "license": "MIT",
6
6
  "type": "module",
7
7
  "sideEffects": true,
package/src/scss/ui/_code-highlight.scss CHANGED
@@ -14,7 +14,7 @@
14
14
  overflow: hidden;
15
15
  margin: 0;
16
16
  padding: 0;
17
- padding-inline-start: var(--code-gutter, 0px);
17
+ /* WHY: gutter lives on the host; JS copies that padding. A second gutter here wraps earlier. */
18
18
  box-sizing: border-box;
19
19
  color-scheme: inherit;
20
20
  color: light-dark(#1f2328, #e6edf3);
@@ -40,7 +40,7 @@
40
40
  font-feature-settings: "liga" 0, "clig" 0, "calt" 0, "dlig" 0;
41
41
  font-kerning: none;
42
42
  font-variation-settings: inherit;
43
- line-height: var(--code-line-height, inherit);
43
+ line-height: max(1.35em, var(--code-line-height, 1.45));
44
44
  letter-spacing: inherit;
45
45
  word-spacing: inherit;
46
46
  tab-size: inherit;
@@ -68,7 +68,9 @@
68
68
  min-inline-size: 0;
69
69
  margin: 0;
70
70
  padding: 0;
71
- white-space: pre;
71
+ white-space: inherit;
72
+ word-break: inherit;
73
+ overflow-wrap: inherit;
72
74
  overflow: visible;
73
75
  }
74
76
 
@@ -81,7 +83,10 @@
81
83
  .code-highlight-source:has(+ .code-highlight-overlay),
82
84
  .code-highlight-host > .code-highlight-source {
83
85
  display: block;
84
- line-height: var(--code-line-height, normal);
86
+ white-space: pre;
87
+ word-break: normal;
88
+ overflow-wrap: normal;
89
+ line-height: max(1.35em, var(--code-line-height, 1.45));
85
90
  padding-inline-start: var(--code-gutter, 0px);
86
91
  font-variant-ligatures: none;
87
92
  font-kerning: none;
@@ -97,8 +102,13 @@
97
102
  -webkit-text-fill-color: transparent;
98
103
  }
99
104
 
100
- pre:has(> .code-highlight-overlay) > code::selection,
101
- .code-highlight-source::selection {
105
+ .code-highlight-source.code-highlight-inplace {
106
+ color: light-dark(#1f2328, #e6edf3);
107
+ -webkit-text-fill-color: currentColor;
108
+ }
109
+
110
+ pre:has(> .code-highlight-overlay) > code:not(.code-highlight-inplace)::selection,
111
+ .code-highlight-source:not(.code-highlight-inplace)::selection {
102
112
  background-color: color-mix(in oklab, #79c0ff 32%, transparent);
103
113
  color: transparent;
104
114
  -webkit-text-fill-color: transparent;
@@ -126,7 +136,8 @@
126
136
  pointer-events: none;
127
137
  }
128
138
 
129
- .code-highlight-overlay {
139
+ .code-highlight-overlay,
140
+ .code-highlight-inplace {
130
141
  .hljs-comment,
131
142
  .hljs-quote {
132
143
  color: light-dark(#656d76, #8b949e);