https://github.com/auth0/styleguide

🖌 Conjunction of design patterns, components and resources used across our products.
https://github.com/auth0/styleguide

css javascript lerna react styleguide

Last synced: about 2 months ago
JSON representation

🖌 Conjunction of design patterns, components and resources used across our products.

• Host: GitHub
• URL: https://github.com/auth0/styleguide
• Owner: auth0
• Archived: true
• Created: 2014-12-17T16:18:09.000Z (almost 10 years ago)
• Default Branch: master
• Last Pushed: 2023-05-17T16:58:08.000Z (over 1 year ago)
• Last Synced: 2024-09-24T21:04:29.014Z (about 2 months ago)
• Topics: css, javascript, lerna, react, styleguide
• Language: Stylus
• Homepage: https://styleguide.auth0.com
• Size: 22.8 MB
• Stars: 159
• Watchers: 113
• Forks: 63
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        

**This repository is no longer maintained. Consider using [Quantum Design System](https://www.npmjs.com/package/@auth0/quantum-product) as an alternative.**

Auth0 Styleguide

================

This repository contains a collection of the most common elements in the Auth0's products UI.

**This is for internal use by Auth0 only.**



## Packages

The Auth0 Styleguide is managed as a [monorepo](https://github.com/babel/babel/blob/master/doc/design/monorepo.md) and it's composed of different packages:

| Package | Version | Description | Dependencies |

|---------|---------|-------------|--------------|

| [`core`](https://github.com/auth0/styleguide/tree/master/packages/core)    | [![npm](https://img.shields.io/npm/v/@auth0/styleguide-core.svg?maxAge=86400)](https://www.npmjs.com/package/@auth0/styleguide-core)   | Global styles (variables, mixins, colors, css reset, typography) | |

| [`components`](https://github.com/auth0/styleguide/tree/master/packages/components) | [![npm](https://img.shields.io/npm/v/@auth0/styleguide-components.svg?maxAge=86400)](https://www.npmjs.com/package/@auth0/styleguide-components) | CSS components like buttons, tables (based on Bootstrap) | [`core`](https://github.com/auth0/styleguide/tree/master/packages/core) |

| [`react-components`](https://github.com/auth0/styleguide/tree/master/packages/react-components) | [![npm](https://img.shields.io/npm/v/@auth0/styleguide-react-components.svg?maxAge=86400)](https://www.npmjs.com/package/@auth0/styleguide-react-components)| React components library |  [`core`](https://github.com/auth0/styleguide/tree/master/packages/core) [`components`](https://github.com/auth0/styleguide/tree/master/packages/components) |

| [`website`](https://github.com/auth0/styleguide/tree/master/packages/website) | - | Styleguide website

## Development

**Node version: 6.9.x NPM version: 3.10.x**

We use [Lerna](https://lernajs.io/) to manage the different packages. You will need to [install it](https://lernajs.io/#getting-started) to run the following commands.

Before start working on any packages run:

```

npm install

lerna bootstrap

```

This command will install all the dependencies of each package, symlink the packages that are dependencies of each other and `npm prepublish` all the bootstrapped packages. For more information check the [Lerna repo](https://github.com/lerna/lerna#bootstrap).

For more information on how to run each package check the specific README.

## License

All the logos and branding are copyright Auth0 and may not be used or reproduced without explicit permission from Auth0 Inc.

The icons are licensed from [Budi Harto Tanrim](http://budicon.buditanrim.co/). All other third-party components are subject to their own licenses.