Questions tagged [daisyui]

For questions related to the Tailwind CSS component library. It can be combined with the tag [tailwind-css].

daisyUI is an open-source Tailwind CSS component library.

Features

  • Clean HTML with component classes
  • Highly customizable (via Tailwind CSS utility classes)
  • Theming

Useful Links

111 questions
0
votes
0 answers

How to make the default theme light in JavaScript code?

I have a day and night toggle button on my site that I created using Tailwind CSS and Daisyui. But when this html and js code runs, my site opens in night mode by default. How can I fix this? HTML Code of Theme Change Button:
0
votes
1 answer

Jasmine won' detect cancel event on dialog

I'm trying to implement a dialog component where user can click escape button to close the popup (I'm using DaisyUI). It works fine when I try it manually, but for some reason I'm not able to create the unit test for it. It fails. Unit Test: …
0
votes
1 answer

Getting PostCSS error when I add DaisyUI in the React Vite Project

I'm getting an issue when I try to add DaisyUI to my React Vite project. This is in the terminal: [vite] Internal server error: [postcss] Object.hasOwn is not a function This is in the browser: [plugin:vite:css] [postcss] Object.hasOwn is not a…
Shahriyar Ahmed
  • 510
  • 5
  • 9
0
votes
1 answer

daisyui click outside to close details summary dropdown

here I want to create a dropdown using details summary in daisyUI I want when the first dropdown is clicked the dropdown opens and when I click the second dropdown I want the second dropdown to open but the first dropdown closes automatically the…
Kyun
  • 692
  • 3
  • 11
0
votes
1 answer

Weird background color in daisyui modal

I've tried several things, but I couldn't remove that weird color in the Modal's background. for context, I'm using Tailwind, with Daisy UI, on Next.JS <>
lunix
  • 33
  • 7
0
votes
0 answers

Angular & daisyUI - Content pronection breaks styling

I am working in an project with Angular 16, tailwindcss and daisyUI 3.0 and I am implementing some shared UI components. When breaking some daisyUI components down into smaller components using content projection, it breaks the styling so they dont…
0
votes
0 answers

Menu-dropdown-show class is not taking effect with vue class binding

I have an a menu dropdown that will show if certain condition is met based on props received. here I'm using Laravel with Inertia, the condition is passed from controller then checked by class binding in vue. When the condition is met, it should…
cherno304
  • 27
  • 5
0
votes
0 answers

tailwind doesn't work in react typescript (solved)

I tried to setup tailwind and daisy ui using react and typescript. I add some configuration file like tailwind.config.ts and postcss.config.cjs. I don't know how to setup postcss config in typescript file. I think my configuration is complete but i…
Yustina Yasin
  • 147
  • 2
  • 12
0
votes
1 answer

How to add a gradient color in daisyui custom theme colors?

I have the following taiwlind.config.js file and I have added daisyui on top of tailwind, now I want to create a custom theme but I am not sure how can I add a gradient color instead of a normal color, import daisyui from "daisyui"; /** @type…
Muhammad
  • 33
  • 5
0
votes
1 answer

A collapse behind the drawer prevents me from interacting with the drawer

I'm using DaisyUI and TailwindCSS I'm using a drawer and collapse.
Valentin Vignal
  • 6,151
  • 2
  • 33
  • 73
0
votes
0 answers

Unable to use custom theme with daisyUI and TailwindCSS in a Typescript project

I am unable to use custom theme for daisyUI with TailwindCSS. I looked for examples but found only JS ones. I tried: import type { Config } from "tailwindcss"; export default { content: ["./app/**/*.{js,jsx,ts,tsx}"], theme: { extend: { daisyui:…
some_other_guy
  • 3,364
  • 4
  • 37
  • 55
0
votes
1 answer

DaisyUI Dropdown Exceeding screen

I am using DaisyUI to implement dropdown menus in my web application. However, on mobile, the dropdown exceeds the bounds of the screen. I've tried a number of solutions. It seems Daisy UI dropdowns are fixed to their parent buttons and can have…
0
votes
1 answer

DaisyUI - How to close the drawer?

I'm using SvelteKit with a drawer from DaisyUI.
Valentin Vignal
  • 6,151
  • 2
  • 33
  • 73
0
votes
1 answer

daisyui: change the color of navbar anchors when hover

I am trying to change the default color of anchor elements in the navbar. It works well, but when I try to do the same for the hover state of the element, it does not work: Here you can see the custom link: And here the link when hover: I want…
Auloma
  • 101
  • 1
  • 8
0
votes
0 answers

updating state using radio buttons not working nextjs/daisyui

I'm trying to update my state using radio buttons but the following isn't working, all it's doing is sending the default value to the getPrice function. I'm unsure why it's behaving like that, maybe I'm supposed to use onSelect instead? I'm using…
Mathew
  • 318
  • 11