Introduction.mdx

import { Meta } from '@storybook/addon-docs';

import { Alert } from '../../components'; import { Header } from '../shared' import EvaluationForm from '../../stories/shared/EvaluationForm'

CSS in JS based reusable components, are the core of Quantum design-system: a library for developing consistent UI/UX at Catho.

Starting from scratch

Quantum can be easily included in applications or one-off projects. We recommend pulling the latest version of Style Guide's CSS from our CDN. You may also clone this repository and pull in the component SCSS files if you wish to only include a portion of Style Guide in your project.

React based

We have chosen React as our preferred front-end framework. Due to that, we maintain the sibling project UI Components, which implements the Style Guide as React Components. If you are building a feature in React, prefer this library because the components encapsulate logic, markup, and (in the future) styles. Repository Storybook On NPM.

---

Installing and using Quantum

Add Quantum as a dependency:

yarn add @catho/quantum

Quantum is compatible with react@16.14.0 or higher

import Button from '@catho/quantum/Button';

export default () => <Button>Click here!</Buttom>;