⚛️ Customizable Atomic CSS Framework for everyone.

• 💡Inspirited by Atomic CSS, Vì Một Thế Giới Hoà Bình
• 👀 Guided by Stacks
• ✨ Build with SCSS

We all might agree that Atomic CSS is a helpful tool for both FE and BE development. There's a lot of Atomic CSS frameworks out there (like tailwindcss), however, to elevate the advantage of Atomic CSS, while keeping it in as light-weight as possible, and even customizable for each project, we have this project on the go.

Install NPM package with basic config

npm i @viivue/atomic-css

Import

import "@viivue/atomic-css";

Or, you can download the default Atomic CSS files in the /dist folder.

To add custom classes for a specific project, you will have to:

1. Clone this repo to your local machine.
2. Edit the /scss/_config.scss, you will find some example templates there.
3. Generate the new Atomic CSS by npm run prod.

Install npm

npm install

Watch SCSS files, then compile to previewed CSS

npm run dev

Compile compressed CSS for distribution.

Check version at _defs.scss and package.json

npm run prod

Check version

npm publish