pale-blocks

Библиотека готовых визуальных компонентов (блоков) для построения интерфейсов. Сверстано по методологии БЭМ. Можно использовать для точечной нормализации стилей, а-ля normalize.css.

Блоки

• attach
• button
• checkbox
• clearfix
• container
• content
• embed
• fieldset
• grid
• hint
• icon
• image
• input
• label
• legend
• link
• media
• page
• print
• radio
• select
• spin
• table
• text
• textarea

Поддерживаемые браузеры

• Firefox (две последние стабильные версии)
• Chrome (две последние стабильные версии)
• Safari (две последние стабильные версии)
• Yandex (две последние стабильные версии)
• Opera 12.1+
• Internet Explorer 10+

Технологии

• DEPS
• PostCSS

Использование

npm i pale-blocks

В сборке подключить базовый уровень и, опционально, уровень с темой "pale":

const builder = bundleBuilder({
  levels: [
    'node_modules/pale-blocks/blocks',
    'node_modules/pale-blocks/design/blocks'
  ],
  techMap: {
    css: ['post.css', 'css']
  }
});

Dist-поставка

Можно подключить уже собранные файлы

• node_modules/pale-blocks/bundles/blocks/blocks.css — только блоки, без дизайна.
• node_modules/pale-blocks/bundles/blocks/blocks.min.css — только блоки, без дизайна (сжатые).
• node_modules/pale-blocks/bundles/pale-blocks/pale-blocks.css — блоки с дизайном pale.
• node_modules/pale-blocks/bundles/pale-blocks/pale-blocks.min.css — блоки с дизайном pale (сжатые).

Обязательные плагины PostCSS при сборке

• postcss-nested
• postcss-color-function (используется в design/blocks)
• autoprefixer