Хочемо зазначити що ми поважаємо розробників дизайн-системи Дії. Вони зробили велику роботу, яка допомагає багатьом командам розробників створювати продукти швидше та з меншими витратами. Ми використовуємо їхню дизайн-систему в наших проектах та вважаємо її дуже корисною.
Проте ми впевнені, що деякі оригінальні системи, можуть бути переглянуті, що ми і зробили для деякіх компонентів.
Ба більше, в оригінальної дизайн-системи був один офіційний реліз, і якщо подивитись на інтерфейси побудовані на її основі, деякі положення вже були переглянути, просто це не потрапило в публічний простір.
На цій сторінці ви знайдете список змін і відмінностей нашої реалізації від оригіналу.
Розмір шрифту на мобільних пристроях.
Оригінал: розмір тексту, кнопок, посилань має бути зменшений для мобільних пристроїв.
Як ми зробили: ми вирішили лишити його на рівні 1rem
, що в більшості браузерів дорівнює 16px
.
Причина: більшість доступних нам рекомендацій радять використовувати саме 16px
як базовий розмір шрифту для всіх мобільних пристроїв.
Для зменшення розміру тексту згідно з оригіналом, ми створили додаткові CSS класи. Зазвичай вони мають суфікс -sm
, наприклад di-text-sm
, di-btn-sm
, di-link-sm
тощо.
Колір для посилань, які було вже відвідано
Оригінал: немає відмінності щодо відвіданих посилань, колір посилань завжди такого ж самого кольору як і текст.
Як ми зробили: для посилань, які вже були відкрити змінили колір на dodger-blue(#5b5aff)
з палітри кольорів.
Причина: для більшості користувачів це зручніше, оскільки вони можуть відрізняти відвідані посилання від невідвіданих.
Розмір шрифту для:
Оригінал: розмір шрифту оригінальній дизайн-системі Дії менше ніж 16px
.
Як ми зробили: ми вирішили збільшити його до 16px
.
Причина: більшість доступних нам рекомендацій радять використовувати саме 16px
як базовий розмір шрифту для всіх мобільних пристроїв.
Аватар іконкою користувача
Оригінал: іконка аватару користувача в неофійній Figma
є обʼємною і розташована внизу а не по центру.
Як ми зробили: Іконка є плоскою і розташована всередині.
Причина: Так було зробити простішу, і не було зрозуміло, наскільки це затребуваний функціонал.