Whitedark-daisyui NPM

whitedark-daisyui

DaisyUI + Tailwindcss Components for nextjs 14 App Router

npm i whitedark-daisyui daisyui next-themes clsx

Add to your css file

@tailwind base;
@tailwind components;
@tailwind utilities;

/* For DaisyUi Component Customizing*/
.btn {
  @apply h-10 min-h-10 min-w-10 rounded-full;
}
.btn-circle {
  @apply w-10;
}
.btn-wide {
  @apply w-auto min-w-32 lg:min-w-36;
}
/* For Navbar Links */
.menu > li > a {
  @apply rounded-full;
}
.card-compact {
  @apply rounded-lg;
}
.join-border-0 > .join-item {
  @apply !border-0;
}
.join-bordered {
  @apply border;
}
.join-vertical > .join-item {
  @apply border-0 border-b border-inherit;
}
.join-vertical :last-child {
  @apply border-b-0;
}
.join-horizontal > .join-item {
  @apply border-0 border-r border-inherit;
}
.join-horizontal :last-child {
  @apply border-r-0;
}
/**For Bug Fix - Nested Join-items**/
.join :not(:first-child):not(:last-child) {
  @apply !rounded-none;
}

daisyui nextjs-components react-components daisyui-components whitedark

9 months ago

9 months ago

9 months ago

9 months ago

9 months ago