3.6 KiB
Визуальные принципы WealthLedger
Интерфейс использует общую визуальную основу на Mantine: цветовые роли, типографику, интервалы, радиусы, тени и адаптивные размеры. Поддерживается светлая схема; тёмная тема не заявлена.
Семантические роли
| Роль | Цветовая основа | Применение |
|---|---|---|
| canvas | gray.2 | Фон приложения |
| surface | white | Поверхности и формы |
| subtle | gray.0 | Приглушённая поверхность |
| text | dark.7 | Основной текст |
| muted | gray.6 | Вторичный текст |
| border | gray.3 | Граница поверхности |
| primary | blue filled | Основное действие и активная навигация |
| info | blue.6 | Информация |
| positive | green.6 | Положительный результат с текстом или знаком |
| negative | red.6 | Ошибка или отрицательный результат с текстом или знаком |
| warning | yellow.6 | Предупреждение; не мелкий текст на белом |
Цвет не заменяет подпись или знак. Палитра не гарантирует доступный контраст произвольного сочетания текста и фона. Дополнительные grape/orange и отдельные оформления карточек сохраняют предметный смысл соответствующего экрана; они не образуют универсальную финансовую классификацию всей системы.
Состояния и действия
Основное, вторичное и вспомогательное действия различаются по визуальному приоритету. Выполнение действия и его недоступность — разные состояния. Пустой результат и ошибка содержат заголовок, пояснение и действие, когда оно предусмотрено сценарием. Ошибка объявляется вспомогательным технологиям, а кнопка имеет доступное название.
Первая загрузка показывает структуру ожидаемого содержимого, без вымышленных сумм; область обозначается как занятая, декоративные фигуры не получают фокус. Фоновое обновление сохраняет доступные данные с локальным индикатором. Подробные правила — в состояниях интерфейса.
Финансовые значения сохраняют валюту, знак и различие между нулём и неизвестной суммой. Предметные представления раскрыты в портфеле, операциях и банковских картах.
Согласованная общая основа описана в спецификации дизайн-системы.