Об этом проекте

Spruce CSS — это open-source дизайн-система и CSS-фреймворк, построенный на Sass. Он распространяется через npm под лицензией MIT и позиционируется как низкоуровневый фундамент, который можно добавить в проект, а не как полноценный набор компонентов. Характеристики, описанные в README и документации: - Инструментарий на базе Sass: фреймворк построен вокруг переменных, миксинов и функций Sass, а также использует систему модулей Sass, применяя @use с пространствами имен для импорта. - Минимальный набор утилит: он намеренно опирается лишь на несколько классических утилит-классов и, согласно README, не включает классическую систему сеток. В проекте указано, что фреймворк относительно невелик (около 7 КБ в сжатом виде), имеет компактную кодовую базу и низкий порог вхождения. - Ориентация на авторов CSS: авторы представляют Spruce как хороший выбор для тех, кто предпочитает писать CSS, а не составлять разметку из тяжелых утилит-классов, описывая его как код, который они сами переносили из проекта в проект. - Темизация: темы создаются с помощью CSS custom properties; включена поддержка темного режима, аналогичным образом можно создавать и другие цветовые темы. - Разделение инструментов и вывода: сгенерированный CSS отделен от фреймворка, поэтому переменные, миксины и функции можно использовать, не подключая сгенерированные стили. - Темы документации: документация охватывает вопросы доступности и инклюзивности, интернационализацию и печать, а также настройку, основы Sass и страницы элементов для типографики, таблиц, кнопок, форм и медиа. - Компоненты вынесены отдельно: готовые UI-компоненты поддерживаются в отдельном проекте Spruce UI, а не внутри основного фреймворка. Начало работы: README ссылается на документацию sprucecss.com, в частности на страницу установки, и отмечает, что основным изменением для существующих пользователей Sass является новая система модулей. Сопутствующий стартовый шаблон Eleventy (sprucecss-eleventy-starter) предоставляет заготовку с базовой настройкой компиляции. Перечислены еще два шаблона: Spruce Docs — шаблон документации на Eleventy, и Root — административный шаблон со стандартными представлениями и множеством компонентов. Документация и вклад: полная документация размещена на sprucecss.com и поддерживается в отдельном репозитории, в документации также содержится руководство по внесению вклада. В README также приведены ссылки на релизы GitHub, пакет npm и тестовый workflow, а также упоминается светлый/темный логотип, используемый в собственных ресурсах проекта.