Skip to content

A collection of assets, guidelines and UI components for building consistent user experiences across OVHcloud products.

License

Notifications You must be signed in to change notification settings

jeremylatorre/design-system

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

A collection of assets and guidelines for building consistent user experiences across OVHcloud products.

NPM version CI status NPM downloads Licence

StencilJS TypeScript Sass Storybook Jest Puppeteer

Quick links

Requirements

  • Node.js with version ">= 14.15 && < 16"
  • Yarn with version ">= 2"

Installation

Clone and install ods by using yarn.

git clone https://github.com/ovh/design-system.git
cd design-system
yarn

Usage

Please read getting-started guide into packages/contributing/contributing-getting-started to start using ODS.

Development

After preparing this repository, you can launch the Storybook UI containing all built components with:

yarn build:prod && yarn doc && yarn start

Then choose the right component in the list if you want to edit it (if not, just choose whatever you want)

Contribute

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

Have a look in CONTRIBUTING.md 😃

Migration

Please read Migration pages to help you to manage the migration guides between each version of ODS.

Run the tests

Tests are individually created for each UI component, but every test can be launch globally.

Scripts

We created multiple test suites to test the different aspects of each UI component :

  • All testing : yarn test
  • Unit testing : yarn test:spec
  • E2E testing : yarn test:e2e
  • Screenshot testing : yarn test:e2e:screenshot

All testing scripts are also available with a ci alternative (i.e, yarn test:ci:screenshot).

Global testing

They are shortcuts that will test all components in the root directory. You can launch them with the previous described scripts.

Single component testing

You can also test a single component.

For instance, for the Button Stencil component, you can browse to it and launch what command you want:

cd packages/stencil/components/button
yarn test:e2e:screenshot

Related links

License

Copyright 2022 OVH SAS

Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at

http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.

About

A collection of assets, guidelines and UI components for building consistent user experiences across OVHcloud products.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • SCSS 62.3%
  • TypeScript 29.7%
  • MDX 4.7%
  • HTML 2.7%
  • JavaScript 0.3%
  • Vue 0.2%
  • CSS 0.1%