Почему мои потрясающие шрифты иконки сначала отображаются большими, а затем обновляются до нужного размера? - PullRequest
0 голосов
/ 28 мая 2019

Каждый раз, когда я обновляю страницу, большие шрифтовые иконки отображаются большими. Похоже, что CSS загружается до применения правильного размера, потому что сразу после обновления он показывает большой, а затем идет к нужному размеру.

Я попробовал некоторые решения, которые нашел в Интернете, но ни одно из них не сработало.

Прямо сейчас я вернулся на круги своя, где у меня есть эти:

import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { faFacebook } from '@fortawesome/free-brands-svg-icons'
import { faTwitter } from '@fortawesome/free-brands-svg-icons'
import { faLinkedin } from '@fortawesome/free-brands-svg-icons'
import { faEnvelope } from '@fortawesome/free-solid-svg-icons'
import { faMapMarkerAlt } from '@fortawesome/free-solid-svg-icons'

и затем используйте их так:

<FontAwesomeIcon icon={faFacebook} color="white" size="2x"/>

Мне не нужно было импортировать CSS, но я установил по этой ссылке:

https://www.npmjs.com/package/@fortawesome/react-fontawesome

В основном я установил такие:

$ npm i --save @fortawesome/fontawesome-svg-core
$ npm i --save @fortawesome/free-solid-svg-icons
$ npm i --save @fortawesome/react-fontawesome

Если бы кто-то мог дать мне указание о том, что искать, было бы замечательно.

Мой проект размещен на Github (https://github.com/palomaschkrab/keto-ui) И вы можете запустить его с помощью «npm run dev» и перейти к localhost: 3000 / about_us, если хотите, чтобы это произошло.

1 Ответ

0 голосов
/ 01 июня 2019

Я видел это раньше при просмотре некоторых страниц, в частности www.getbootstrap.com Произошло только с Firefox, и я обнаружил, что Ctrl + F5 решит проблему. Как только я открыл другой URL на том же сайте, этот эффект вернулся. Никогда не узнал, что это вызвало, так как я решил перейти на Chrome.

...