Can't get q-tab color=" " to override the parent color like in the example

djaoui

Hi all,
1st thing: thanks for that amazing tool that gives amazing opportunity to non-pro dev like me.

I have a problem getting tabs with individual colors.
The parameter color="*****" in q-tab doesn’t override any parent color.

It doesn’t behave like in the example on https://quasar-framework.org/components/tabs.html:

  <q-tabs inverted align="justify">
    <q-tab color="secondary" slot="title" icon="mail" label="Mails" />
    <q-tab color="amber" slot="title" icon="alarm" label="Alarms" />
    <q-tab color="purple" slot="title" icon="movie" label="Movies" /></q-tabs>

Thanks for your help ! David

genyded

Try class=“text-secondary”, class=“text-amber”, and class=“text-purple”. The ‘color’ prop only exists on the q-tabs component , not q-tab.

djaoui

Thank you !

djaoui

Hi again,

I was wrong, it works perfectly well. I just didn’t get that the color pro of q-tab is only triggered when the tab is active (clicked or touched).

Thanks for your help.

Cheers