miniaxolotl/stagcss

a modern modular CSS framework thats mobile friendly and based on flexbox.

stag

a modern and minimalist CSS framework.

Getting Started

Dependencies

• nodejs >= 12.18.4
• yarn >= 1.22.10

Usage

CDN

<link rel="stylesheet" href="https://unpkg.com/stagcss"/>

npm

npm install --save stagcss

yarn

yarn add stagcss

---

Theming

1. Copy stag.scss and rename it

cp src/stag.scss src/stag-{theme}.scss

2. Edit the color variables at the top of the page

$color-primary:     config.$color-black !default;
$color-secondary:   config.$color-grey-light !default;
$color-tertiary:    config.$color-white !default;
$color-background:  config.$color-white !default;
$color-accent-1:    config.$color-gold-dark !default;
$color-accent-2:    config.$color-magenta !default;

3. Run yarn build to build the source

yarn build
# or
yarn build --theme {theme}
# or
yarn build --theme {theme} --minify

Building

Specify theme by using or ommiting --theme (default and dark). Minify using --minify.

Using gulp

yarn build
# or
gulp build

Testing

Using jest

yarn test
# or
jest

Documentation

Specifications & design documents can be found in the wiki.

See Also

• react-stag - https://github.com/theluckyegg/react-stag
• stag-docs - https://github.com/theluckyegg/stag-docs
• react-native-stag - soon™

Contributing

Please see CONTRIBUTING.md for a in depth view.

Credits

Please see CREDITS.md for a in depth view.

License

This project is licensed under the GPL-3.0 License - see the LICENSE file for details.