Обзор стиля пользовательского интерфейса

Наша система проектирования — это постоянно развивающийся множество спецификаций, направленных на обеспечение визуальной согласованности продуктов Docker и соответствие стандарты доступности уровня AA. Мы открыли часть его для авторов расширений, документируя основные стили (цвет, типографика) и компоненты. См.: Руководство по стилю расширений Docker.

Мы требуем, чтобы расширения в определенной степени соответствовали более широкому пользовательскому интерфейсу Docker Desktop, и оставляем за собой право сделать это более строгим в будущем.

Чтобы начать работу с пользовательским интерфейсом, выполняет следующие действия.

1. Выбрать свой фреймворк

2. Следуйте приведенным далее рекомендациям.

Следуйте нашим передовым методам MUI (если применимо)

См. нашу статью Лучшие практики MUI.

Используйте только цвета из нашей палитры

За небольшими исключениями, например, при отображении вашего логотипа, вы должны использовать только цвета из нашей палитры. Их можно найти в нашем руководство по стилю, а также скоро они будут доступны в нашей теме MUI и через переменные CSS.

Используйте соответствующие цвета в светлом/темном режиме

Наши цвета были выбраны таким образом, чтобы соответствующие цвета в каждом варианте палитры имели одинаковые основные характеристики. Везде, где вы используете red-300 в светлом режиме, вы должны использовать red-300 и в темном режиме.

Что дальше?