Cozy UI

A clean Ui SDK designed to build Cozy apps.

If you plan to build a webapp to run on Cozy, you'll probably want to use a simple and elegant solution to build your interfaces without the mess of dealing with complex markup and CSS. Then Cozy UI is here for you!

It relies on Stylus as preprocessor. You can add it as a library in your project to use it out-of-the-box.

Use

Cozy UI is distributed as a Stylus plugin.

$ yarn add -D cozy-ui

Then simply add it to your plugins stack:

var stylus  = require('stylus')
  , cozyui = require('cozy-ui/stylus');


function compile(str, path) {
return stylus(str)
  .set('filename', path)
  .set('compress', true)
  .use(cozyui());
}

📌 NOTE: Cozy UI uses normalize.css by Nicolas Gallagher as a reset styles process. The CSS file is embedded directly by the Cozy UI Stylus plugin, using the stylus include css statement to inline the CSS in the output instead of using a native CSS @import.

Then, you just need to add a @import 'cozy-ui' statement at top of your main stylus file.

CSS Styleguide

You can see all vars, mixins, classes, utilities and their usage in the styleguide.

React components

You can see react components in storybook.

License

Cozy UI is developed by Cozy Cloud and distributed under the AGPL-3.0 license.

What is Cozy?

Cozy is a platform that brings all your web services in the same private space. With it, your web apps and your devices can share data easily, providing you with a new experience. You can install Cozy on your own hardware where no one profiles you.

Community

You can reach the Cozy Community by:

Chatting with us on IRC #cozycloud on irc.freenode.net
Posting on our Forum
Posting issues on the Github repos
Mentioning us on Twitter