https://github.com/zcreativelabs/fiber-css

An atomic css framework focused on responsive design
https://github.com/zcreativelabs/fiber-css

atomic-css css design-systems design-tools postcss responsive-design

Last synced: about 1 month ago
JSON representation

An atomic css framework focused on responsive design

• Host: GitHub
• URL: https://github.com/zcreativelabs/fiber-css
• Owner: zcreativelabs
• License: mit
• Created: 2017-04-03T11:35:41.000Z (over 7 years ago)
• Default Branch: master
• Last Pushed: 2017-10-13T15:38:37.000Z (about 7 years ago)
• Last Synced: 2024-11-08T23:03:25.965Z (about 2 months ago)
• Topics: atomic-css, css, design-systems, design-tools, postcss, responsive-design
• Language: CSS
• Size: 102 KB
• Stars: 14
• Watchers: 3
• Forks: 4
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# fiber-css

An atomic css framework focused on responsive design

## Getting started

Fiber-css is available as an npm module:

`$ npm install fiber-css`

### Why use fiber-css?

+ prioritizes responsive design, particularly responsive typography

+ uses only rem values

+ uses intuitive naming conventions

+ is also available as separate pre-compiled modules

+ makes complex responsive patterns easy to reason about

+ leaves semantic abstractions to other frameworks (e.g. React) and only focuses on style properties

### Setup

#### Precompiled

Use either the complete fiber-css suite from `css/fiber.css` or the minified version `css/fiber.min.css`, or use one or more separate modules (e.g. `css/modules/typography.css`).

#### Custom build

To customize or extend fiber-css, clone this repo     

    

    $ git clone https://github.com/zcreativelabs/fiber-css.git

    $ cd fiber-css

    $ npm install

    

make your changes, and build your custom version of fiber-css:

    

    $ npm run css:prepare

To learn more about building a custom css pipeline check out [How to set up a postcss pipeline with variable sharing in gulp](https://medium.com/@zimrick/how-to-set-up-a-postcss-pipeline-with-variable-sharing-in-gulp-4e77624cc749).

## License

MIT licensed. Copyright (c) Richard Zimerman 2017. See [LICENSE.md](https://github.com/zcreativelabs/fiber-css/blob/master/LICENSE) for more details.