wix-style-react is a collection of React components that conform to Wix Style created by Wix UX guild.

Demo | Source | Playground

Setup

• Install with npm or yarn:

npm i wix-style-react
# OR
yarn add wix-style-react

• Use in your project:

import React from 'react';
import Button from 'wix-style-react/Button';

const MyComponent = () =>
  <Button onClick={() => console.log('thanks for clicking :)')}>
    Click me!
  </Button>;

Requirements

• Load Wix fonts from CDN

  <link rel="stylesheet" href="//static.parastorage.com/services/third-party/fonts/Helvetica/fontFace.css">

Tips

• Use Yoshi as build tool to avoid configuration. Otherwise follow webpack setup instructions here
• Enable font smoothing with browser specific css properties, for example:

  html {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }

• Use demo pages to find all available components with examples.

Contributing

Please refer to the Contribution page

Tests

Please refer to the Testing page

License

This project is offered under MIT License.