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
2
votes
1 answer

Tailwind and DaisyUI in a Next.js app, I can't get the navbar to stretch across the entire webpage

I have a next.js app that uses DaisyUI which is a tailwind based css component library. The problem is that I can't get any DaisyUI navbar to stretch all the way across the webpage horizontally. The navbar components stack up vertically crowding to…
ChristianOConnor
  • 820
  • 7
  • 29
2
votes
2 answers

how to close navbar after going to another page in react.js and daisy ui

I create nav bar with react, tailwind and Daisy. UI and react_router_dom and when it goes to another page it's still open, and I want it to close after it goes to another page.
papar
  • 21
  • 3
2
votes
0 answers

Twin Macro can't get daisyui (tailwind's plugin) class on NX workspace project

I'm creating project with nx, and also use nx preset to setup the project,and I tried to add some ready-to-go UI lib, adding tailwind first, then adding 'daisyui' the tailwind components. But I got the issue that seems macro can't find daisyui…
DrNutsu
  • 475
  • 2
  • 10
  • 21
2
votes
1 answer

Daisy UI card border color

How do you change the color of a card border using Daisy UI? I can see that bordered adds a black border around my cards. But when I try various tailwind css classes, such as border-white the border does not change.
SeanPlusPlus
  • 8,663
  • 18
  • 59
  • 84
2
votes
2 answers

How to close DaisyUI drawer menu with just one click?

I'm using the DaisyUI drawer component to render a menu on mobile. See here for a working example: https://daisyui.com/components/drawer Now in the example there's a button which can be used to open and close the mobile menu. The button triggers a…
ninsky
  • 1,772
  • 23
  • 31
1
vote
1 answer

How to control DaisyUI Modal after update to v3 in ReactJS?

After the update to version 3 of DaisyUI, I no longer have control over how the responsive modal opens and closes. I am using ReactJS. Can someone please help me? // modal button
1
vote
1 answer

Padding, Margin, default color are not working tailwind + daisyui

I use a next.js 13 project with app directory and tailwind + daisy UI config. padding, margin and colors are not working. const ContactUs = () => { return ( <>
sarem eskandary
  • 504
  • 4
  • 16
1
vote
1 answer

Django : Tailwind styling not applied to template variables with widget attributes

I'm trying to apply daisyUI styling in my django web-app project, and I'm note sure to understand what's happening with the styling : in my case, I try to add some daisyUI styling to an input text field generated dynamically by a django form…
hadisql
  • 21
  • 6
1
vote
2 answers

How to remove steps from being over the drawer

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

Daisy UI checkbox button component appears as a normal checkbox instead of a button in react

I am using Daisy UI's checkbox button But instead of button as shown in documentation - it appears as a simple checkbox - Expecting - a togglable checkbox like button but instead got…
1
vote
0 answers

What could be causing my React and Vite project with Daisy UI to not load the page?

I am writing a project using vite/react and tailwind/daisyUI.I am a beginner and for now just want to have a working layout so don't bother with the main content usage in modal-box App.jsx import { Fragment, useState } from 'react' import…
ESKİ
  • 11
  • 1
1
vote
0 answers

Having issues with importing components in Javascript (./navbar)

Hello I am new to stack overflow and even JS so sorry in advance if i get something wrong. So i am having issues with trying to import a navbar from daisyUI, I made a file called navBar.js and i wrote this: const navbar = () => { return ( …
MacSe
  • 11
  • 2
1
vote
0 answers

How to prevent scrolling to top of the page on clicking a link in Next JS

I am trying to create my portfolio website. I am having a problem related to in Navbar and carousel of website. I have a navbar as the header of my website which has links to ids for lower sections such as know more, projects, etc. Now, when I…
1
vote
1 answer

i want to close the modal after i click add button

I want to close the modal after i click add button. the form in the modal is for uploading a data to database. the function for upload is working fine but i dont know how to close the modal after i click the add button. i am using…