bug: `base: false` not working properly

[HipyCas]

What version of daisyUI are you using?

v3.7.3

Describe your issue

I have just installed DaisyUI to use it with an existing project. As I went to use it, I noticed that the colors of my page changed without me touching anything from this:

to this:

I used the documentation to set base: false, which did not work (and neither styled: false, but I believe that is for a different thing). I am using a custom theme, so my full config is:

{
  plugins: [require('daisyui')],
  daisyui: {
    base: false,
    styled: false,
    themes: [
      {
        'ceebi-dark': {
          primary: '#34b6ed',
          secondary: '#56aba0',
          accent: '#ffb86b',
          neutral: '#414558',
          'base-100': '#24272a',
          info: '#8be8fd',
          success: '#52fa7c',
          warning: '#ffe066',
          error: '#e8451e',
        },
      },
    ],
  },

What browsers are you seeing the problem on?

Chrome, Firefox

Reproduction URL

No response

[saadeghi]

Can you share the HTML code of the form in the screenshot? (I don't need the uncompiled source code. The compiled HTML from devtools would be okay)

[HipyCas]

The source code is this:

<nav class="border-b bg-white">
    <div
      class="flex flex-col md:flex-row items-center justify-between w-full px-4 mx-auto"
    >
      <div class="flex-1 items-center flex-grow">
        <div class="w-fit max-w-[200px] mx-5 pt-2 pb-2">
          <img
            :src="logoHorizontal"
            alt="CEEBI"
            class="min-w-[200px] max-h-fit"
          />
        </div>
      </div>
      <div class="flex-2 items-center justify-center flex-grow my-2">
        <h1 class="text-2xl font-bold text-center">{{ title }}</h1>
      </div>
      <div class="flex-1 items-center flex-grow">
        <div class="flex justify-end">
          <NuxtLink
            to="/consulta"
            class="mx-2 my-2 text-lg font-bold focus:outline-none hover:text-cblue-500 focus:text-cblue-500"
            :class="{ 'text-cblue-500': $route.path === '/consulta' }"
            >Consulta</NuxtLink
          >
          <NuxtLink
            to="/certificado"
            class="mx-2 my-2 text-lg font-bold focus:outline-none hover:text-cblue-500 focus:text-cblue-500"
            :class="{ 'text-cblue-500': $route.path === '/certificado' }"
            >Certificado</NuxtLink
          >
        </div>
      </div>
    </div>
  </nav>

And the compiled:

<nav
  class="border-b bg-white"
  data-v-inspector="components/client/TopNav.vue:2:3"
>
  <div
    class="flex flex-col md:flex-row items-center justify-between w-full px-4 mx-auto"
    data-v-inspector="components/client/TopNav.vue:3:5"
  >
    <div
      class="flex-1 items-center flex-grow"
      data-v-inspector="components/client/TopNav.vue:6:7"
    >
      <div
        class="w-fit max-w-[200px] mx-5 pt-2 pb-2"
        data-v-inspector="components/client/TopNav.vue:7:9"
      >
        <img
          src="/_nuxt/assets/img/logo-ceebi-horizontal.png"
          alt="CEEBI"
          class="min-w-[200px] max-h-fit"
          data-v-inspector="components/client/TopNav.vue:8:11"
        />
      </div>
    </div>
    <div
      class="flex-2 items-center justify-center flex-grow my-2"
      data-v-inspector="components/client/TopNav.vue:15:7"
    >
      <h1
        class="text-2xl font-bold text-center"
        data-v-inspector="components/client/TopNav.vue:16:9"
      >
        Consulta de talleres y microcharlas
      </h1>
    </div>
    <div
      class="flex-1 items-center flex-grow"
      data-v-inspector="components/client/TopNav.vue:18:7"
    >
      <div
        class="flex justify-end"
        data-v-inspector="components/client/TopNav.vue:19:9"
      >
        <a
          href="/consulta"
          class="mx-2 my-2 text-lg font-bold focus:outline-none hover:text-cblue-500 focus:text-cblue-500"
          >Consulta</a
        ><a
          aria-current="page"
          href="/certificado"
          class="router-link-active router-link-exact-active mx-2 my-2 text-lg font-bold focus:outline-none hover:text-cblue-500 focus:text-cblue-500 text-cblue-500"
          >Certificado</a
        >
      </div>
    </div>
  </div>
</nav>

[saadeghi]

This is not the HTML of the form. But anyway,
As you can see here: https://play.tailwindcss.com/FPiJ1D1zGR?file=config the base config works as expected. And the reason you're seeing that Consulta text as white is because your site that your custom theme is a dark theme (base-100 is dark) so the content text would be light automatically (unless base is disabled) and meanwhile you have bg-white to force the bg color to be white again. So that would end up white text on white background. You might want to change base-100 to white if you want to have a light theme.

Let me know if you have any questions.

https://github.com/saadeghi/daisyui/assets/7342023/a045da01-313f-4674-af69-ed1f4ef49833