optimise fonts

fonts are now loaded in a hierarchy:
- title: smallest, loads first, "riki's fluffy little house" characters only
- crit: loads next, contains ASCII + some other stuff, in weights 400-900 (for body text and headings)
- full: loads last, contains everything (italics & monospace too)
This commit is contained in:
りき萌 2025-10-06 20:08:30 +02:00
parent 6b707587ef
commit 2de872e664
15 changed files with 122 additions and 21 deletions

View file

@ -5,7 +5,16 @@
<head>
{{> components/_head.hbs }}
<link rel="stylesheet" href="{{ asset 'css/doc.css' }}">
<style>{{{ include_static 'css/doc.css' }}}</style>
</head>
<body>
{{> components/_sidebar.hbs }}
{{~> components/_doc.hbs }}
{{~> components/_pink_space.hbs }}
<th-overlays></th-overlays>
<th-command-line></th-command-line>
{{#each page.styles}}
<link rel="stylesheet" href="{{ asset (cat 'css/' this) }}">
@ -17,15 +26,6 @@
import "{{ this }}";
{{/each}}
</script>
</head>
<body>
{{> components/_sidebar.hbs }}
{{~> components/_doc.hbs }}
{{~> components/_pink_space.hbs }}
<th-overlays></th-overlays>
<th-command-line></th-command-line>
</body>
</html>

View file

@ -4,10 +4,43 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- -->
<link rel="preload" href="{{ asset 'font/recursive-title.woff2' }}" as="font" type="font/woff2" crossorigin fetchpriority="high">
<link rel="preload" href="{{ asset 'font/recursive-crit.woff2' }}" as="font" type="font/woff2" crossorigin>
<!-- -->
<style>
@font-face {
font-family: "RecVar";
font-family: "RecVar-Full";
src: url("{{{ asset 'font/recursive-casl0.woff2' }}}");
font-display: swap;
unicode-range: U+0-10FFFF;
}
@font-face {
font-family: "RecVar-Crit";
src: url("{{{ asset 'font/recursive-crit.woff2' }}}");
font-display: block;
font-weight: 400 900;
font-style: normal;
unicode-range: U+20-7E, U+2000-206F;
}
@font-face {
font-family: "RecVar-Crit";
src: url("{{{ asset 'font/recursive-casl0.woff2' }}}");
font-display: block;
font-style: normal;
unicode-range: U+80-1FFF, U+2070-10FFFF;
}
@font-face {
font-family: "RecVar-Title";
src: url("{{{ asset 'font/recursive-title.woff2' }}}");
font-display: block;
font-weight: 800 900;
font-style: normal;
unicode-range: U+20, U+27, U+65, U+66, U+68, U+69, U+6B, U+6C, U+6F, U+72, U+73, U+74, U+75, U+79;
}
</style>
<style>{{{ include_static 'css/base.css' }}}</style>