N
Nuxt•4mo ago
Angh0r

Hover state only for table body rows

Hi. I know that rows are highlighted in selectable mode. But in my case I just want highlight rows on hover to help users scan trough data. I know I can add "hover:bg-somecolor-50" to ui: { tr: { base { } } } but it also affects table header. Is there a way to target only rows in table body?
2 Replies
Flo
Flo•4mo ago
yes. Add a class-property to the row elements 
    return props.storeRef.map((item) => {
      return {
        ...item,
        class: "hover:bg-somecolor-50"
        }
      }
    return props.storeRef.map((item) => {
      return {
        ...item,
        class: "hover:bg-somecolor-50"
        }
      }
Flo
Flo•4mo ago
It's well hidden in the docs: https://ui.nuxt.com/components/table#:~:text=You%20can%20apply,to%20rows.
Nuxt UI
Table - Nuxt UI
Display data in a table.
Want results from more Discord servers?
Add your server
More Posts
"Cannot write file '...' because it would overwrite input file" error in tsconfig.jsonHello. I created a Nuxt app with `bunx nuxi@latest init www-nuxt`. I added `t3-env/nuxt` and then IMocking Pinia Store in Vitest Component TestI would like to test my Nuxt3 component with *vitest* and *nuxt/test-utils*. This component uses a *Event is triggered twiceI have a eventBus.js class which looks like this: ```js import emitter from 'tiny-emitter/instance'Docus color overrideAnyone happen to know how to override the colors in the Docus theme for Nuxt content? I see they areSave image in Nuxt 3I'm trying to save an image directly to a form upload, on other frameworks I temporarily store the iIs there any way to build custom js files?Basically I want to build `src/sdk.ts` to `{output}/sdk.js`. Sort of like library mode in vite. Curdev mode not working in a discord activitythere are no errors in the console so im unsure whats going wrong. on first page load, the first renTrying to dynamically provide an API services composableHey ninjas, I came through creating an API service that loads firebase or restful API. I made it as