daisyUI components built with NixixJS, Typescript and TailwindCSS
Make sure you've installed TailwindCSS and daisyUI.
Install the package with npm or yarn:
npm install daisyui-nixixTo prevent TailwindCSS from purging your styles, add the following line to your tailwind.config.js:
module.exports = {
content: [
'node_modules/daisyui/dist/**/*.js',
'node_modules/daisyui-nixix/**/*.{js,ts,tsx,jsx}',
],
plugins: [require('daisyui')],
}Import daisyui-nixix components within your component files:
import { Button } from 'daisyui-nixix'
export default (props) => {
return <Button color="primary">Click me!</Button>
}To apply a theme (or multiple themes) to a page or components, import the Theme component and wrap your content:
import { Theme, Button } from 'daisyui-nixix'
export default (props) => {
return (
<>
<Theme dataTheme="dark">
<Button color="primary">Click me, dark!</Button>
</Theme>
<Theme dataTheme="light">
<Button color="primary">Click me, light!</Button>
</Theme>
</>
)
}Use tools like the official daisyUI Theme Generator or daisyUI Theme Builder to easily create your own themes.
We're looking for contributors to help write stories and unit tests for components.
This project is licensed under the MIT License - see the LICENSE.md file for details.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent