deepStateMirrors/tabi
1
0
Fork 1
mirror of https://github.com/welpo/tabi.git synced 2025-10-11 07:46:15 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

✨ feat: support disabling of the font-subset in header

Browse source
This commit is contained in:
Niels Gouman 2025-01-08 21:37:05 +01:00
parent 162a84b6d6
commit 9e8cf78df9
4 changed files with 12 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

1
config.toml
View file

@ -339,6 +339,7 @@ enable_csp = true
# This avoids a flashing text issue in Firefox.
# Please see https://welpo.github.io/tabi/blog/custom-font-subset/ to learn how to create this file.
custom_subset = true
subset_enabled = true
[extra.analytics]
# Specify which analytics service you want to use.

4
content/blog/mastering-tabi-settings/index.md
View file

@ -720,9 +720,9 @@ See the [Mermaid documentation](@/blog/shortcodes/index.md#mermaid-diagrams) for
|:----:|:-------:|:-------------:|:-----------------:|:-------------------:|
| ❌ | ❌ | ✅ | ❌ | ❌ |
Custom fonts cause flashing text in Firefox. To amend this, tabi loads a subset of glyphs for the header. Since this (slightly) increases the initial load time, it's a good idea to try and minimise the size of this subset.
Custom fonts cause flashing text in Firefox. To amend this, tabi loads a subset of glyphs for the header. Since this (slightly) increases the initial load time, it's a good idea to try and minimise the size of this subset, or disable it completely if you're not using a custom font in your skin.
You can create a custom subset tailored to your site, save it as `static/custom_subset.css`, and have it load with `custom_subset = true`.
You can create a custom subset tailored to your site, save it as `static/custom_subset.css`, and have it load with `custom_subset = true`. Disabling the subset can be done with `subset_enabled = false`.
For more information, including instructions on how to create a custom subset, see the [docs](@/blog/custom-font-subset/index.md).

14
templates/partials/header.html
View file

@ -36,12 +36,14 @@
{# CSS #}
{# Load subset of glyphs for header. Avoids flashing issue in Firefox #}
{% if config.extra.custom_subset and config.extra.custom_subset == true %}
<link rel="stylesheet" href="{{ get_url(path="custom_subset.css" , cachebust=true) }}">
{% elif lang == 'en' %}
<link rel="stylesheet" href="{{ get_url(path="inter_subset_en.css", cachebust=true ) }}">
{% elif lang == 'es' %}
<link rel="stylesheet" href="{{ get_url(path="inter_subset_es.css", cachebust=true ) }}">
{% if config.extra.subset_enabled %}
{% if config.extra.custom_subset == true %}
<link rel="stylesheet" href="{{ get_url(path="custom_subset.css" , cachebust=true) }}">
{% elif lang == 'en' %}
<link rel="stylesheet" href="{{ get_url(path="inter_subset_en.css", cachebust=true ) }}">
{% elif lang == 'es' %}
<link rel="stylesheet" href="{{ get_url(path="inter_subset_es.css", cachebust=true ) }}">
{% endif %}
{% endif %}
{# Define array of CSS files to load. main.css is always loaded. #}

1
theme.toml
View file

@ -296,6 +296,7 @@ enable_csp = true
# This avoids a flashing text issue in Firefox.
# Please see https://welpo.github.io/tabi/blog/custom-font-subset/ to learn how to create this file.
# custom_subset = true
subset_enabled = true
[extra.analytics]
# Specify which analytics service you want to use.