Cleaning up our font system

Внести вклад UX
26

Если вас устраивают относительные изменения размеров шрифта, вы можете просто задать другой размер шрифта для элемента :root, и значения в em автоматически подстроятся под него.

3 лайка
27

Неужели я что-то упускаю, или это просто случай нежелания предоставлять «подводные камни» для тем и плагинов? Объявление всех этих переменных с !default кажется простым способом разрешить их переопределение.

2 лайка
28

Я не верю, что раньше это работало, потому что основные стили компилировались до того, как тема могла их переопределить? По крайней мере, с цветами было именно так… Я знаю, что некоторые аспекты компиляции SCSS изменились, так что, возможно, это больше не проблема?

Мы также можем переключить их на пользовательские свойства CSS, как мы сделали с цветами, если !default недостаточно.

3 лайка
29

Вот это да, точно! Похоже, кастомные свойства всё-таки правильный путь! :muscle:

4 лайка
30

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

Хорошо, я немного лучше разобрался в этом. В настоящее время все переменные, определённые здесь, можно читать из тем/плагинов, но нельзя записывать новые значения, так как каждый стиль компилируется отдельно. Добавление пользовательских свойств CSS позволяет темам/плагинам переопределять переменные динамически, и все зависимые стили получают новые значения. :slight_smile:

3 лайка
31

Привет @bekircem, теперь, когда вышеупомянутое объединено, вы можете добавить тему, которая переопределяет базовые переменные шрифта путём повторного определения (клиентских) свойств CSS:

// вероятно, не стоит использовать эти значения, но идея понятна:
:root {
    --font-down-1: 0.8em;
    --font-0: 2em;
    --font-up-1: 3em;
    --font-up-2: 4em;
}
3 лайка