design-system
design-system copied to clipboard
A collection of assets, guidelines and UI components for building consistent user experiences across OVHcloud products.
A collection of assets and guidelines for building consistent user experiences across OVHcloud products.
Quick links
Requirements (only for contributing)
Installation
All the OVHcloud Design System packages are available on NPM.
yarn add @ovhcloud/ods-components @ovhcloud/ods-theme-blue-jeans
or
npm install --save @ovhcloud/ods-components @ovhcloud/ods-theme-blue-jeans
Usage
To start using ODS, you'll need to import the components.
Add a dependency to either:
-
@ovhcloud/ods-components
to import all components -
@ovhcloud/ods-components-<component>
to import a specific component
Components can be imported using one of:
import { Osds<Component> } from '@ovhcloud/ods-component-<component>'
import { Osds<Component> } from '@ovhcloud/ods-component-<component>/react'
import { Osds<Component> } from '@ovhcloud/ods-component-<component>/vue'
You can import enums directly from the component:
import { ODS_%COMPONENT%_SIZE, ODS_%COMPONENT%_SIZES } from '@ovhcloud/ods-component-<component>'
Same goes for interfaces:
import type { Ods<Component>Attribute } from '@ovhcloud/ods-component-<component>'
Then, in your view, you can start using ODS components. For instance:
<osds-button>
My Button
</osds-button>
For more detail, see our global Get Started guide
Contribute
You've developed a new cool feature ? Fixed an annoying bug ? We'd be happy to hear from you !
Please read Get Started guide for contributing and CONTRIBUTING.md 😃
Migration
Please read Migration pages to help you to manage the migration guides between each version of ODS.
Related links
- Contribute: https://github.com/ovh/design-system/blob/master/CONTRIBUTING.md
- Migrate from one version to another: https://github.com/ovh/design-system/blob/master/MIGRATION.md
- Troubleshoot dev issues: https://github.com/ovh/design-system/blob/master/TROUBLESHOOTING.md
- Report bugs: https://github.com/ovh/design-system/issues
- Get latest version: https://github.com/ovh/ods
License
Copyright 2023 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.