11<div align =" center " >
2- <h1 >:construction: flowbite-angular (unreleased) :construction: </h1 >
2+ <h1 >flowbite-angular</h1 >
33 <p >
44 <a href="https://flowbite.com">
55 <img alt="Flowbite - Tailwind CSS components" width="350" src="https://flowbite.s3.amazonaws.com/github/logo-github.png">
@@ -41,46 +41,42 @@ classes from Tailwind CSS that you can use as a starting point for user interfac
4141
4242## Documentation
4343
44- Documentation for ` flowbite-angular ` is not yet finished.
45-
4644If you want to browse the components, visit [ flowbite-angular.com] ( https://flowbite-angular.com/ ) .
4745
4846If you want to learn more about Flowbite, visit
4947[ Flowbite docs] ( https://flowbite.com/docs/getting-started/introduction/ ) .
5048
5149## Getting started
5250
53- To use ` flowbite-angular ` , you just need to setup ` flowbite ` normally and install ` flowbite-angular `
54- from ` npm ` .
51+ ## Require via ` npm `
5552
56- ` flowbite ` can be included as a plugin into an existing Tailwind CSS project .
53+ Make sure that you have < a href = " https://nodejs.org/en/ " rel = " nofollow " >Node.js</ a > installed .
5754
58- ### Require via ` npm `
55+ 1 . Install ` tailwindcss ` as a dependency using ` npm ` by running the following command:
5956
60- Make sure that you have <a href =" https://nodejs.org/en/ " rel =" nofollow " >Node.js</a > and
61- <a href =" https://tailwindcss.com/ " rel =" nofollow " >Tailwind CSS</a > installed.
57+ ``` bash
58+ npm i tailwindcss
59+ ```
6260
63- 1 . Install ` flowbite ` as a dependency using ` npm ` by running the following command:
61+ 2 . Install ` flowbite-angular ` as a dependency using ` npm ` by running the following command:
6462
6563``` bash
66- npm i flowbite flowbite -angular
64+ npm i flowbite-angular
6765```
6866
69- 2 . Require ` flowbite ` as a plugin inside the ` tailwind.config.js ` file:
67+ 3 . Import ` flowbite-angular ` inside your ` style.css ` file:
7068
71- ``` javascript
72- module .exports = {
73- plugins: [require (' flowbite/plugin' )],
74- };
69+ ``` css
70+ @import ' node_modules/flowbite-angular/styles/flowbite-angular.css' ;
7571```
7672
77- ## Components
73+ # Components
7874
7975<table >
8076 <tr >
8177 <td width="33.3333%">Alerts</td>
8278 <td width="33.3333%">Badges</td>
83- <td width="33.3333%">:construction: Breadcrumbs</td>
79+ <td width="33.3333%">Breadcrumbs</td>
8480 </tr >
8581 <tr >
8682 <td width="33.3333%">
@@ -101,8 +97,8 @@ module.exports = {
10197 </tr >
10298 <tr >
10399 <td width="33.3333%">Buttons</td>
104- <td width="33.3333%">:construction: Button group</td>
105- <td width="33.3333%">:construction: Cards</td>
100+ <td width="33.3333%">Button group</td>
101+ <td width="33.3333%">Cards</td>
106102 </tr >
107103 <tr >
108104 <td width="33.3333%">
@@ -146,7 +142,7 @@ module.exports = {
146142 <tr >
147143 <td width="33.3333%">:construction: Typography</td>
148144 <td width="33.3333%">Modal</td>
149- <td width="33.3333%">:construction: Tabs</td>
145+ <td width="33.3333%">Tabs</td>
150146 </tr >
151147 <tr >
152148 <td width="33.3333%">
@@ -167,7 +163,7 @@ module.exports = {
167163 </tr >
168164 <tr >
169165 <td width="33.3333%">Navbar</td>
170- <td width="33.3333%">:construction: Pagination</td>
166+ <td width="33.3333%">Pagination</td>
171167 <td width="33.3333%">:construction: Timeline</td>
172168 </tr >
173169 <tr >
@@ -210,7 +206,7 @@ module.exports = {
210206 </td>
211207 </tr >
212208 <tr >
213- <td width="33.3333%">:construction: Tooltips</td>
209+ <td width="33.3333%">Tooltips</td>
214210 <td width="33.3333%">:construction: Datepicker</td>
215211 <td width="33.3333%">:construction: Spinner</td>
216212 </tr >
@@ -276,7 +272,7 @@ module.exports = {
276272 </td>
277273 </tr >
278274 <tr >
279- <td width="33.3333%">:construction: Input Field</td>
275+ <td width="33.3333%">Input Field</td>
280276 <td width="33.3333%">:construction: File Input</td>
281277 <td width="33.3333%">:construction: Search Input</td>
282278 </tr >
@@ -342,7 +338,7 @@ module.exports = {
342338 </td>
343339 </tr >
344340 <tr >
345- <td width="33.3333%">:construction: Floating Label</td>
341+ <td width="33.3333%">Floating Label</td>
346342 </tr >
347343 <tr >
348344 <td width="33.3333%">
@@ -366,8 +362,8 @@ For casual chatting with others using the library:
366362## Contributing
367363
368364Thank you for your interest in helping! Visit our
369- [ guide on contributing] ( https://github.com/themesberg/flowbite-angular/blob/main/CONTRIBUTING.md ) to
370- get started.
365+ [ guide on contributing] ( https://github.com/themesberg/flowbite-angular/blob/main/.github/CONTRIBUTING )
366+ to get started.
371367
372368## Figma
373369
@@ -379,4 +375,4 @@ If you need the Figma files for the components you can check out our website for
379375
380376The Flowbite name and logos are trademarks of Crafty Dwarf Inc.
381377
382- 📝 [ Read about the licensing terms] ( https://flowbite.com/docs/getting-started/license/ )
378+ 📝 [ Read about the licensing terms] ( https://flowbite-angular .com/docs/getting-started/license )
0 commit comments