Для префикса Android не устанавливается иконка FA

hacker

Местный
Сообщения
816
Реакции
592
Баллы
758
Стиль отображения выбираю другое: label label--green fa fa-android
не хочет отображаться.
А label label--green fa fa-robot - отображает.

Всякие классы пробовал. В чем проблема?
 
Решение
Решение сложное:

Less:
.label:before {
    font-size: 80%;
    font-family: 'Font Awesome 5 Pro';
    margin-right: 5px;
}
.fab.fa-android:before, .fa.fa-windows:before {
    font-size: 80%;
    font-family: 'Font Awesome 5 Brands';
    margin-right: 5px;
}

Для префикса CSS стиля Android label label--green fab fa-android

Для префикса CSS стиля Windows label label--royalBlue fa fa-windows

Обратить внимание на CSS стиль FAB & FA
А страницу можно посмотреть где такое проявляется ? (можно в ЛС кинуть)
Предположительно дело в пункте:
CSS:
font-family: "Font Awesome 5 Pro";
 
Последнее редактирование:
Исправил
Less:
font-family: 'Font Awesome 5 Pro';
В шаблоне extra.less выравнивание и оформление FA иконок:
Less:
.label {
    border-radius: 0px;
    display: inline-block;
    position: relative;
    font-size: 80%;
    cursor: pointer;
    font-family: 'Fira Sans Extra Condensed';
    min-width: 100px;
    text-align: center;
    vertical-align: middle;
    padding: 1px .35em;
    line-height: 17px;
}
.label.fa:before {
    font-size: 80%;
    font-family: 'Font Awesome 5 Pro';
    margin-right: 5px;
}

Ни фига не помогает, также не отображается FA Windows
 
Последнее редактирование:
Можно так прописать для конкретно этой ситуации и все должно отображаться корректно:
CSS:
.block[data-widget-definition="xfrm_new_resources"] .block-container .label.label--green.fa.fa-android:before {
    font-family: 'FontAwesome';
}
 
Можно так прописать для конкретно этой ситуации и все должно отображаться корректно:
CSS:
.block[data-widget-definition="xfrm_new_resources"] .block-container .label.label--green.fa.fa-android:before {
    font-family: 'FontAwesome';
}
Не помогло, а вот изменение .label.fa:before { на .label-fa:before { помогает, но другие FA иконки префиксов слетают.
 
Можно попробовать так еще:
CSS:
.block[data-widget-definition="xfrm_new_resources"] .block-container .block-body .contentRow-main .fa.fa-android:before {
    font-family: 'FontAwesome' !important;
}
 
@baltun, Ни так ни сяк не хочет
Код:
.label {
    border-radius: 0px;
    display: inline-block;
    position: relative;
    font-size: 80%;
    cursor: pointer;
    font-family: 'Fira Sans Extra Condensed';
    min-width: 100px;
    text-align: center;
    vertical-align: middle;
    padding: 1px .35em;
    line-height: 17px;
}
.label.fa:before {
    font-size: 80%;
    font-family: 'Font Awesome 5 Pro';
    margin-right: 5px;
}
.block[data-widget-definition="xfrm_new_resources"] .block-container .block-body .contentRow-main .fa.fa-android:before {
    font-family: 'FontAwesome' !important;
}

Добавил в стиле Blue
 
Последнее редактирование:
Вот так еще допиши я посмотрю что получится:
CSS:
.block[data-widget-definition="xfrm_new_resources"] .block-container .block-body .contentRow-main .label.fab:before {
    font-size: 80%;
    font-family: 'Font Awesome 5 Pro';
    margin-right: 5px;
}
Извини ошибся заменит это:
CSS:
 font-family: 'Font Awesome 5 Pro';
на это
CSS:
font-family: 'Font Awesome 5 Brands';
Можно попробовать так еще:
CSS:
.fab.fa-android:before {
    font-size: 80%;
    font-family: 'Font Awesome 5 Brands';
    margin-right: 5px;
}
 
Последнее редактирование:
Решение сложное:

Less:
.label:before {
    font-size: 80%;
    font-family: 'Font Awesome 5 Pro';
    margin-right: 5px;
}
.fab.fa-android:before, .fa.fa-windows:before {
    font-size: 80%;
    font-family: 'Font Awesome 5 Brands';
    margin-right: 5px;
}

Для префикса CSS стиля Android label label--green fab fa-android

Для префикса CSS стиля Windows label label--royalBlue fa fa-windows

Обратить внимание на CSS стиль FAB & FA
 
Последнее редактирование:
Решение
Назад
Верх Низ