Как исправить смещение FOUT/Layout при использовании Google Fonts `@import` в Jekyll SCSS? ⇐ CSS

[Anonymous]

У меня возникает Вспышка нестилизованного текста (FOUT) при переходе по внутренним ссылкам на моем сайте Jekyll, размещенном на страницах GitHub, несмотря на использование параметра &display=swap в URL-адресе Google Fonts.

Настройка

• Платформа: Jekyll (GitHub) Pages).
• Тема: Тема TeXt.
• Загрузка шрифта: Я использую оператор @import в верхней части основного файла SCSS (

  Код: Выделить всё

  assets/css/main.scss

  ):

Код: Выделить всё

@import url('https://fonts.googleapis.com/css2?family=Fira+Sans:wght@300;400;500;600&display=swap');

Каково рекомендуемое решение для определения приоритета загрузки Google Fonts при настройке Jekyll/GitHub Pages? Ранее я удалил Turbo Hotwire, поскольку он нарушал работу других клиентских плагинов (MathJax, счетчик просмотров). Мне нужно решение, ориентированное на Jekyll/CSS.


Подробнее здесь: https://stackoverflow.com/questions/798 ... ekyll-scss