Тема
Тут ви правите дизайн-систему проєкту — кольори, відступи, заокруглення, тіні й текстові стилі, з яких бере вигляд кожен екран, — і публікуєте її у ваші застосунки.
Відкрийте розділ «Дизайн»#
Натисніть Дизайн ліворуч. Розділ ділить місце з полотном, тож кожну зміну одразу видно на екрані.
Тема належить проєкту, а не документу: одна на всі його екрани.
Токени#
Токен — це значення з іменем. Віджети посилаються на ім'я, тож зміна значення тут міняє кожен екран, де його вжито.
| Група | Що в ній |
|---|---|
| Кольори | Кольори з прозорістю. |
| Ролі | Якими кольорами малюється варіант кнопки чи тон бейджа. |
| Градієнти | Напрямок і дві чи більше точок кольору. |
| Відступи | Шкала для проміжків і відступів. |
| Заокруглення | Заокруглення кутів. |
| Тіні | Тіні, складені з шарів. |
| Гарнітури | Гарнітури основного тексту й заголовків. |
| Шрифтові стилі | Кегль, вага, висота рядка, міжлітерний проміжок і гарнітура кожного текстового стилю. |
У кожній групі є обов'язкове ядро — імена, які має кожен проєкт, — і місце для власних токенів. Щоб додати власний, наберіть ім'я в полі Новий токен і натисніть Додати. Ім'я — латиницею в camelCase, як-от brandCoral. Власні токени можна перейменовувати й видаляти; токенам ядра можна міняти лише значення.
Перш ніж перейменувати чи видалити токен, редактор показує, які документи ним користуються й що зламається. Прочитайте цей перелік: документ, що посилається на токен, якого в темі вже немає, не публікується.
У групі Ролі з'являється попередження, коли колір тексту погано читається на своєму тлі.
Розділ Що змінено унизу перелічує кожне значення, що відрізняється від початкового.
Кілька тем#
У проєкті може бути кілька тем — зазвичай світла й темна.
- Список угорі розділу обирає тему, яку ви правите. Нею ж намальоване полотно.
- Створити копію робить копію, з якої зручно почати нову тему.
- Зробити тією, яку бере застосунок позначає тему, яку бере застосунок. Вибір теми у списку цього не міняє.
- Усі теми набору оголошують ті самі імена токенів, кожна — зі своїми значеннями.
Кнопка теми в панелі перегляду над полотном перемикає те саме: тема, яку ви бачите, — це тема, яку ви правите.
Опублікуйте тему#
Тема не має чернетки й сама не зберігається. Поки в ній є зміни, що існують лише у вашій вкладці браузера, про це каже смуга внизу редактора.
Щоб зберегти зміни, натисніть Опублікувати тему. Застосунки візьмуть тему з наступним запуском застосунку.
- Публікувати тему може той, хто має право публікації. Редактор бачить значення й може їх вивантажити, але опублікувати не може.
- Якщо документ уживає токен, який існує лише у вашій вкладці, документ не опублікується, доки не опубліковано тему. Спершу тема, потім документ.
- Якщо, поки ви правили, тему опублікував хтось інший, редактор не затирає чужу роботу мовчки: він пропонує відкрити їхню тему або опублікувати вашу поверх.
Вивантаження й імпорт#
Вивантажити файл зберігає весь набір тем файлом; Підвантажити файл завантажує набір із файла. Так тему передають дизайнерові або переносять між проєктами. Імпорт міняє лише те, що у вашій вкладці, — щоб зберегти, опублікуйте. Повернути типову відкидає зміни теми, яку ви правите, і повертає її типові значення.
Далі#
- Стиль — як уживати токени на віджеті.
- Збереження й публікація
