<p align="center">
  <br><br>
  <strong>SEVN:ui</strong>
  <br>
  A Bootstrap theme for Dashboards, Intranets, and whatnot.
</p>

# Installation & Usage

Simply add it to `package.json` dependencies:

```json
+ "@sevn/ui": "git@github.com:sevn/ui.git"
```

And then import it into your SASS or JavaScript file:

```scss
@import "../../node_modules/@sevn/ui/css/ui.css";
```

```js
import "@sevn/ui/css/ui.css";
```

From now own you can refer to the [Bootstrap 5 docs](https://getbootstrap.com/docs/5.3/getting-started/introduction/). Any component there is supported by SEVN:ui.

# Contributing

Simply edit the file `src/scss/custom.scss` to make changes to the Bootstrap build.

You can run `npm run dev` to check some components on `localhost:3000`.

Alternatively, in order to check SEVN:ui agains all Bootstrap components, you can:

1. Open [Bootstrap 5 docs](https://getbootstrap.com/docs/5.3/getting-started/introduction/) in a browser;
2. Block the Bootstrap Docs CSS network request in Chrome DevTools;
3. Run `npm run dev`;
4. Copy this script and paste it on DevTools console:

```js
(() => {
  const linkEl = document.createElement("link");
  linkEl.rel = `stylesheet`;
  linkEl.href = "http://localhost:3000/css/ui.css";
  document.body.append(linkEl);
})();
```

Now you have your own SEVN:ui docs. :)