Короткая запись шрифтов в LESS

Короткая запись шрифтов в LESS 2021-05-22

Нет прав для скачивания
Совместимость с XenForo
  1. 2.0
  2. 2.1
  3. 2.2
У вас есть шрифт для форума в двух форматах woff и woff2, для современных браузеров этого достаточно:
Код:
GothamPro-Black.woff
GothamPro-BlackItalic.woff
GothamPro-Bold.woff
GothamPro-BoldItalic.woff
GothamPro-Light.woff
GothamPro-LightItalic.woff
GothamPro-Medium.woff
GothamPro-MediumItalic.woff
GothamPro-Regular.woff
GothamPro-RegularItalic.woff

GothamPro-Black.woff2
GothamPro-BlackItalic.woff2
GothamPro-Bold.woff2
GothamPro-BoldItalic.woff2
GothamPro-Light.woff2
GothamPro-LightItalic.woff2
GothamPro-Medium.woff2
GothamPro-MediumItalic.woff2
GothamPro-Regular.woff2
GothamPro-RegularItalic.woff2

Заливаем их на сервер, к примеру в папку /styles/mystyle/fonts/ и делаем модификацию шаблона extra.less:
Код:
@fontFacePach: '/styles/mystyle/fonts/';

.fontFace(@fname, @fweight, @fstyle: normal) {
    font-family: 'GothamPro';
    src: url('@{fontFacePach}GothamPro-@{fname}.woff2') format('woff2'),
         url('@{fontFacePach}GothamPro-@{fname}.woff') format('woff');
    font-weight: @fweight;
    font-style: @fstyle;
    font-display: swap;
}

@font-face {.fontFace(Light, 300)};
@font-face {.fontFace(LightItalic, 300, italic)};
@font-face {.fontFace(Regular, 400)};
@font-face {.fontFace(RegularItalic, 400, italic)};
@font-face {.fontFace(Medium, 500)};
@font-face {.fontFace(MediumItalic, 500, italic)};
@font-face {.fontFace(Bold, 600)};
@font-face {.fontFace(BoldItalic, 600, italic)};
@font-face {.fontFace(Black, 800)};
@font-face {.fontFace(BlackItalic, 800, italic)};
  • Мне нравится
Реакции: MC_Mike и IlyaPep
Автор
Skaiman
Скачивания
8
Просмотры
571
Первый выпуск
Обновление
Оценка
0.00 звёзд 0 оценок

Другие ресурсы пользователя Skaiman

Поделиться ресурсом

Назад
Сверху Снизу