You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
4. Add the `@tailwind` directives for each of Tailwind's layers to your `./inertia/css/app.css` file:
62
+
63
+
```css
64
+
@tailwind base;
65
+
@tailwind components;
66
+
@tailwind utilities;
67
+
```
68
+
69
+
## Install Flowbite React
70
+
71
+
1. Run the following command to install `flowbite-react`:
72
+
73
+
```bash
74
+
npm i flowbite-react
75
+
```
76
+
77
+
2. Add the Flowbite React `content` path and `plugin` to `tailwind.config.js`:
78
+
79
+
```js {1,7,11}
80
+
importflowbitefrom"flowbite-react/tailwind";
81
+
82
+
/**@type{import('tailwindcss').Config}*/
83
+
exportdefault {
84
+
content: [
85
+
// ...
86
+
flowbite.content(),
87
+
],
88
+
plugins: [
89
+
// ...
90
+
flowbite.plugin(),
91
+
],
92
+
};
93
+
```
94
+
95
+
## Dark mode
96
+
97
+
In server side rendered applications, such as AdonisJS, to avoid page flicker (if `dark` mode is set) before AdonisJS hydrates the content, `ThemeModeScript` component must be rendered (see implementation below).
98
+
99
+
`ThemeModeScript` renders a script tag that sets `dark` or removes `dark` from `<html>` element before hydration occurs.
0 commit comments