spark-html-font 0.1.3 → 0.1.4
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/README.md +2 -1
- package/package.json +1 -1
- package/src/index.js +7 -2
package/README.md
CHANGED
|
@@ -79,7 +79,8 @@ Top-level: `fallback` — generic families appended to every var stack
|
|
|
79
79
|
## The Spark family
|
|
80
80
|
|
|
81
81
|
Small, single-purpose packages that share one philosophy: no compiler, no
|
|
82
|
-
virtual DOM, no build step required
|
|
82
|
+
virtual DOM, no build step required — built for humans who love hand-writing
|
|
83
|
+
their web apps. Add only what you use.
|
|
83
84
|
|
|
84
85
|
| Package | What it does |
|
|
85
86
|
|---|---|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "spark-html-font",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.4",
|
|
4
4
|
"description": "Font loading optimizer for spark-html sites — @font-face + preload + size-adjusted fallbacks in one config, no FOUT, no layout shift. Zero dependencies.",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./src/index.js",
|
package/src/index.js
CHANGED
|
@@ -25,8 +25,10 @@
|
|
|
25
25
|
* Zero dependencies; pure string generation plus a little DOM.
|
|
26
26
|
*/
|
|
27
27
|
|
|
28
|
-
// Approximate
|
|
28
|
+
// Approximate size-adjusted fallback metrics (fontaine-style) for popular
|
|
29
29
|
// families. Percentages; good enough to keep the swap from moving the page.
|
|
30
|
+
// Sans families adjust from Arial; mono families carry their own local basis
|
|
31
|
+
// (`from`) — Courier New is the metric-compatible mono every OS ships.
|
|
30
32
|
// Override per font with `metrics: { sizeAdjust, ascent, descent, lineGap }`.
|
|
31
33
|
const METRICS = {
|
|
32
34
|
'inter': { sizeAdjust: 107.4, ascent: 90.2, descent: 22.5, lineGap: 0 },
|
|
@@ -37,6 +39,9 @@ const METRICS = {
|
|
|
37
39
|
'poppins': { sizeAdjust: 112.2, ascent: 93.8, descent: 31.3, lineGap: 0 },
|
|
38
40
|
'nunito': { sizeAdjust: 101.9, ascent: 99.4, descent: 34.7, lineGap: 0 },
|
|
39
41
|
'source sans pro': { sizeAdjust: 94.1, ascent: 104.6, descent: 29.0, lineGap: 0 },
|
|
42
|
+
'jetbrains mono': { sizeAdjust: 100, ascent: 102, descent: 24.5, lineGap: 0, from: 'Courier New' },
|
|
43
|
+
'roboto mono': { sizeAdjust: 100, ascent: 104.8, descent: 27.1, lineGap: 0, from: 'Courier New' },
|
|
44
|
+
'source code pro': { sizeAdjust: 100, ascent: 98.4, descent: 27.3, lineGap: 0, from: 'Courier New' },
|
|
40
45
|
};
|
|
41
46
|
|
|
42
47
|
const slug = (family) => family.toLowerCase().replace(/[^a-z0-9]+/g, '-').replace(/^-|-$/g, '');
|
|
@@ -87,7 +92,7 @@ export function fontCss(config = {}) {
|
|
|
87
92
|
const m = font.metrics || METRICS[fam.toLowerCase()];
|
|
88
93
|
const stack = [`"${fam}"`];
|
|
89
94
|
if (m && font.adjust !== false) {
|
|
90
|
-
const local = font.adjustFrom || 'Arial';
|
|
95
|
+
const local = font.adjustFrom || m.from || 'Arial';
|
|
91
96
|
rules.push(
|
|
92
97
|
`@font-face { font-family: "${fam} Fallback"; src: local("${local}");` +
|
|
93
98
|
` size-adjust: ${m.sizeAdjust}%; ascent-override: ${m.ascent}%;` +
|