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



  • 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



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



  • Thank you !



  • 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