@ovh-ux/ui-kit

A component framework for the OVHcloud brand.

Usage no npm install needed!

<script type="module">
  import ovhUxUiKit from 'https://cdn.skypack.dev/@ovh-ux/ui-kit';
</script>

README

OVHcloud UI Kit

A component framework for the OVHcloud brand.

npm version

Installation

Prerequisites

This library has been tested with AngularJS 1.6+.

You need to load these dependencies in your project:

See package.json for more informations.

Dependencies Dev Dependencies Peer Dependencies

Install with npm

npm install @ovh-ux/ui-kit

Install with yarn

yarn add @ovh-ux/ui-kit

Usage

  1. In your index.html, you need to load oui.css and oui.js:
<link rel="stylesheet" href="path/to/@ovh-ux/ui-kit/dist/css/oui.css">

<script src="path/to/@ovh-ux/ui-kit/dist/js/oui.js" type="text/javascript"></script>
  1. You need to add oui in your angular module dependencies like that:
angular.module('myAwesomeApp', ['oui']);

Webpack

In your index.js, you need to import the library, with its CSS file separately.

import '@ovh-ux/ui-kit/dist/css/oui.css';
import oui from '@ovh-ux/ui-kit';

angular.module('myAwesomeApp', [oui]);

LESS variables

If you want to use the variables for your style, you can access it through _variables.less.

@import 'path/to/@ovh-ux/ui-kit/dist/less/_variables';

Note: Importing _variables.less will import _constants.less and _icons.less too.

Develop

Run in development mode

  1. Clone and install ovh-ui-kit
git clone https://github.com/ovh/ovh-ui-kit.git
cd ovh-ui-kit
yarn install
  1. Run ovh-ui-kit in the Workshop
yarn start

This will open Storybook in your default browser

Hot reload

Once you have yarn start-ed the project, you can edit anything with an automatic browser refresh as a result.

Contributing

You've developed a new cool feature? Fixed an annoying bug? We'd be happy to hear from you!

see CONTRIBUTING

Related links

Documentation

Documentation is available from the packages/ folder, every package is self-documented throught a README.md file.

License

See https://github.com/ovh/ovh-ui-kit/blob/master/LICENSE