deepStateMirrors/tabi
1
0
Fork 1
mirror of https://github.com/welpo/tabi.git synced 2025-12-14 19:58:44 +01: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 4ef893686e
3 changed files with 11 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. # 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. # Please see https://welpo.github.io/tabi/blog/custom-font-subset/ to learn how to create this file.
custom_subset = true custom_subset = true
subset_enabled = true
[extra.analytics] [extra.analytics]
# Specify which analytics service you want to use. # 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). 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 #} {# CSS #}
{# Load subset of glyphs for header. Avoids flashing issue in Firefox #} {# Load subset of glyphs for header. Avoids flashing issue in Firefox #}
{% if config.extra.custom_subset and config.extra.custom_subset == true %} {% if config.extra.subset_enabled %}
<link rel="stylesheet" href="{{ get_url(path="custom_subset.css" , cachebust=true) }}"> {% if config.extra.custom_subset == true %}
{% elif lang == 'en' %} <link rel="stylesheet" href="{{ get_url(path="custom_subset.css" , cachebust=true) }}">
<link rel="stylesheet" href="{{ get_url(path="inter_subset_en.css", cachebust=true ) }}"> {% elif lang == 'en' %}
{% elif lang == 'es' %} <link rel="stylesheet" href="{{ get_url(path="inter_subset_en.css", cachebust=true ) }}">
<link rel="stylesheet" href="{{ get_url(path="inter_subset_es.css", cachebust=true ) }}"> {% elif lang == 'es' %}
<link rel="stylesheet" href="{{ get_url(path="inter_subset_es.css", cachebust=true ) }}">
{% endif %}
{% endif %} {% endif %}
{# Define array of CSS files to load. main.css is always loaded. #} {# Define array of CSS files to load. main.css is always loaded. #}