@komposit/ui-kit

❗️ BETA ❗️

The ui-kit is divided into 9 parts:

• normalize.css : makes browsers render all elements more consistently
• __root.css : variables definitions at :root level
• __base.css : CSS impacting global elements
• __fonts.css : font-face definitions
• __type.css : typography related CSS
• __layout.css : containers style definition
• __buttons.css : buttons style definition
• __forms.css : form elements style definition
• __utility.css : utility classes

What's included?

@komposit/
└── ui-kit/
    ├── __base.css
    ├── __base.css
    ├── __buttons.css
    ├── __fonts.css
    ├── __forms.css
    ├── __images.css
    ├── __layout.css
    ├── __root.css
    ├── __type.css
    ├── __utility.css
    ├── ui-kit.css
    └── dist/
        └── ui-kit.css

🚀 Consume

Full ui-kit

To install it via NPM:

npm install @komposit/ui-kit

You’ll then be able to use the bundled version of ui-kit:

import uiKit from ‘@komposit/ui-kit/dist/ui-kit.css’;

Partial ui-kit consuming (TODO)

import '@komposit/ui-kit/__buttons.css';

TECH

ui-kit uses a Suit methodology for CSS nomenclature. ComponentName - descendentName -- modifierName