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

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

Сообщение 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

Вернуться в «CSS»