Как добавить шрифт из локального источника?

Вопросы и проблемы
#1

Подскажите как заменить дефолтный шрифт в проекте на PT Sans и чтобы он загружался с локального источника?

#3

Добрый день!

Чтобы заменить стандартный шрифт в проекте, необходимо сделать следубщее:

  1. Скачать веб-версию шрифта (она содержит все неоходимые файлы и реализацию @font-fase)
  2. Создать расширение темы
  3. Скопировать в директорию темы папку с файлами шрифта (изменить расширение файла с описанием @font-fase с css на scss)
  4. В файле styles.scss подключить шрифт
@import "com.company.demo/fonts/ptsans/ptsans";
  1. В файле *-ext-defaults.scss установить дефолтный шрифт
$v-font-family: 'PT Sans';

Глеб

1 симпатия
#5

Спасибо, большое! А как теперь убрать жирность шрифта? А то все надписи, заголовки и т.д. отображаются bold шрифтом.
Расширял тему Hover.

#6

Есть переменная $v-font-weight, но она по дефолту 400, так что не должно быть все жирным. Может дело в самом шрифте?

#7

Вот например у кнопки:
image
А где можно посмотреть все переменные отвечающие за стили?

#8

В Studio есть встроенный редактор переменных темы:
image

Но некоторые компоненты, для определенных своих элементов переопределяют глобальные значения. В таком случае необходимо написать стиль, который перекроет дефолтный.

#9

У меня в Studio v.12.3 нет такой закладки в интерфейсе.

#10

Добрый день.

Извините за неудобство, я забыл отметить, что это премиальная функция и доступна только если есть лицензия на Studio.

Переменные доступные из Vaadin можно посмотреть здесь: https://vaadin.com/api/valo/
Кубинские переменные можно найти глобальным поиском: $c-* / $cuba-*

Глеб

#11

А в 30 дневной пробной версии тоже этой функции нет?
А можно как то полностью перенести встроенную тему в свой проект а не расширять ее?

#12

Можно создать новую тему и полностью скопировать код существующей.

#13

Спасибо, это то что нужно!

#14

В пробной версии нет ограничений. Убедитесь, что вы открываете *-ext-defaults.scss файл.

#15

А как этот файл должен появиться в проекте?

#16

Необходимо создать расширение существующей темы или новую.

#17

https://doc.cuba-platform.com/manual-7.1-ru/web_theme_extension.html#web_theme_extension_structure

В главном меню нажмите CUBA > Advanced > Manage themes > Create theme extension . В диалоговом окне выберите тему, которую вы хотите расширить. Другой способ - использовать команду theme в CUBA CLI.

#18

Очень крутая вкладка “Theme Variables” - сильно её не хватало!

#19

Создал theme extension, но вкладка “Theme Variables” на файле *-ext-defaults.scss в 30 дневной версии не появилась.

#20

Так она была еще в прошлой студии (имею в виду еще версию 6.x).

#21

Мы сразу начали работать в IJ. С 7 версии ) Не так давно знакомы с Кубой

#22

Не могли бы Вы приложить скриншот?