@bloodhoundenterprise/doodleui 1.0.0-alpha.6 → 1.0.0-alpha.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -1,5 +1,5 @@
1
1
  <p align="center">
2
- <img src="https://img.shields.io/badge/version-1.0.0--alpha.6-teal" alt="version 1.0.0-alpha.6"/>
2
+ <img src="https://img.shields.io/badge/version-1.0.0--alpha.9-teal" alt="version 1.0.0-alpha.9"/>
3
3
  <a href="https://ghst.ly/BHSlack">
4
4
  <img src="https://img.shields.io/badge/BloodHound Slack-4A154B?logo=slack&logoColor=EEF0F2"
5
5
  alt="BloodHound Slack"></a>
@@ -11,6 +11,49 @@ A component library for use with [BloodHound Community Edition](https://github.c
11
11
 
12
12
  This library is written in TypeScript and leverages [Radix](https://www.radix-ui.com/) components as its foundation via [shadcn](https://ui.shadcn.com/). [Tailwind CSS](https://tailwindcss.com/) is used for styling along with [Class Variance Authority](https://cva.style/docs) for creating opinionated variants as defined by our design system.
13
13
 
14
+ # Installation
15
+
16
+ ## Using TailwindCSS
17
+
18
+ 1. Install [TailwindCSS](https://tailwindcss.com/docs/installation)
19
+ 2. Install DoodleUI (example using `yarn` shown below)
20
+
21
+ ```
22
+ $ yarn add @bloodhoundenterprise/DoodleUI
23
+ ```
24
+
25
+ 3. Update your Tailwind configuration to include the DoodleUI plugin, preset and content
26
+
27
+ ```
28
+ import { DoodleUIPlugin, DoodleUIPreset } from '@bloodhoundenterprise/doodleui';
29
+
30
+ module.exports = {
31
+ content: [
32
+ "./src/**/*.{html,js}" // your application source code
33
+ "node_modules/@bloodhoundenterprise/doodleui/dist/index.js" // DoodleUI components
34
+ ],
35
+ plugins: [DoodleUIPlugin],
36
+ presets: [DoodleUIPreset],
37
+ ...
38
+ }
39
+ ```
40
+
41
+ These configuration options provide the base theme customizations and additional utility classes required to render DoodleUI components in alignment with the design system used by BloodHound Community Edition and BloodHound Enterprise.
42
+
43
+ ## Manual Installation
44
+
45
+ 1. Install DoodleUI (example using `yarn` shown below)
46
+
47
+ ```
48
+ $ yarn add @bloodhoundenterprise/DoodleUI
49
+ ```
50
+
51
+ 2. Add the DoodleUI stylesheet to your application
52
+
53
+ ```
54
+ <link rel="stylesheet" href="node_modules/@bloodhoundenterprise/doodleui/dist/styles.css">
55
+ ```
56
+
14
57
  ## Developer Notes
15
58
 
16
59
  ### Dependencies