icon icon indicating copy to clipboard operation
icon copied to clipboard

NuxtUI icons forced to width and height 1em!

Open CorrM opened this issue 8 months ago • 4 comments

Image Image

Normal button:

<UButton
            color="info"
            variant="soft"
            size="xl"
            icon="i-heroicons-question-mark-circle"
            class="rounded-full"
            aria-label="Show keyboard shortcuts"
          />

Im using Nuxt4 and NuxtUI 3

CorrM avatar Jul 22 '25 16:07 CorrM

Workaround add this to your app.config.ts:

icon: {
    mode: "css",
    cssLayer: "base",
},

CorrM avatar Jul 22 '25 16:07 CorrM

That's weird. :where() should make the priority lower than the regular class. Can you give a minimal reproduction?

antfu avatar Jul 24 '25 06:07 antfu

That's weird. :where() should make the priority lower than the regular class. Can you give a minimal reproduction?

Looks like it is caused by css layers.

hacknug avatar Jul 29 '25 16:07 hacknug

Sorry for being late, was busy last days. will try to make a minimal reproduction today.

CorrM avatar Jul 30 '25 02:07 CorrM