https://github.com/extrawest/extra-clarity

https://github.com/extrawest/extra-clarity

Last synced: 9 months ago
JSON representation

• Host: GitHub
• URL: https://github.com/extrawest/extra-clarity
• Owner: extrawest
• License: mit
• Created: 2022-11-14T23:42:42.000Z (over 3 years ago)
• Default Branch: main
• Last Pushed: 2025-04-25T17:47:21.000Z (about 1 year ago)
• Last Synced: 2025-08-08T16:28:56.535Z (10 months ago)
• Language: TypeScript
• Size: 10.4 MB
• Stars: 3
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • License: LICENSE

Awesome Lists containing this project

README

          
[![Maintaner](https://img.shields.io/badge/maintainer-extrawest.com-blue)](https://extrawest.com)

[![GitHub license](https://img.shields.io/github/license/Naereen/StrapDown.js.svg)](LICENSE)

[![GitHub release](https://img.shields.io/github/package-json/v/extrawest/extra-clarity?filename=projects%2Fextra-clarity%2Fpackage.json)](https://www.npmjs.com/package/@extrawest/extra-clarity)

# Extra Clarity

A library containing Angular components built on the top of the [Clarity Design System](https://clarity.design/),

which we use in our internal projects in [extrawest.com](https://extrawest.com).

The library is under development. Any suggestions would be highly appreciated.

## Installation

The library is available as an [npm-package](https://www.npmjs.com/package/@extrawest/extra-clarity):

```shell

npm install @extrawest/extra-clarity

```

To work with the library, you also need to add the Clarity packages:

```shell

npm i @cds/core @clr/angular @clr/ui

```

And then add the global Clarity styles to your `angular.json` config:

```json

"styles": [

  "node_modules/@cds/core/global.min.css",

  "node_modules/@cds/core/styles/theme.dark.min.css",

  "node_modules/@clr/ui/clr-ui.min.css"

  ... any other styles

]

```

and add the `cds-theme="light"` attribute to the body element in your main HTML file:

```html