# @domoinc/da-styles

> Base styles for Custom Apps. Extension for Material Web Components

Latest version **0.0.3** (published 2017-10-04) · MIT license · 0 weekly downloads

## Install

```sh
npm install @domoinc/da-styles
pnpm add @domoinc/da-styles
yarn add @domoinc/da-styles
bun add @domoinc/da-styles
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.3 |
| Published | 2017-10-04 |
| First published | 2017-08-28 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Appteam6 |
| Maintainers | walex, jpumford, whitney.rosenberg, freakaziod210, bmbarker-domo, bkingery, excrispy, clm, scott.davidson.domo, k4paul, andrewjensen, jgalb, dallasnorton, jonathan-law, morganjohn12, nicksrandall, jmstewart |

## Links

- npm: https://www.npmjs.com/package/@domoinc/da-styles
- npm.io page: https://npm.io/package/@domoinc/da-styles

## Recent versions

- 0.0.3 (latest) — 2017-10-04
- 0.0.2 — 2017-08-29
- 0.0.1 — 2017-08-28

## README

# Custom App Styles

Extending [Material Components](https://material.io/components/web/) to look & feel more like native Domo.

## Getting Started

### Step 1. Install

```
npm install --save @domoinc/da-styles material-components-web
```

### Step 2. Include Styles

Let Webpack bundle the SASS files with your app-specific style sheets. This import order is important!

```scss
@import '~@domoinc/da-styles/scss/overrides'; // sets mdc variables
@import '~material-components-web/material-components-web';
@import '~@domoinc/da-styles/scss/components'; // domofies mdc
```

### Step 3. Include Open Sans font

Rather than bundling the fonts into the base, we opted for you to load it via CDN which allows your app to take advantage of performance gains from caching.

```html
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700">
```

or in your SASS file

```scss
@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700');
```

### Step 4. Init and use MDC as [documented](https://material.io/components/web/)

## Demos

To see working examples of the components clone the repo locally and start the `webpack-dev-server`:

```
git clone https://git.empdev.domo.com/CustomApps/da-styles
cd da-styles && yarn install && npm start
```

## Contributing

There is definite room to grow and customize these styles. Contributions are highly encouraged. MDC-Web has been included for development purposes and the demo files are where you can test your changes.

### Install dependencies and start developing

```
yarn install && npm start
```

Make your changes in `./scss` and see the dev server refresh with the latest.

---
_Source: https://npm.io/package/@domoinc/da-styles · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._