Change color of a dojo tab pane

Question

How do I change the color title of a dojo tab pane of a dojo tab container in a xpage under a given condition? Could anyone give me a roadmap on how to change the label's color?

Answer 1

You can do it like this, and hide the style panel based on your condition

<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core" xmlns:xe="http://www.ibm.com/xsp/coreex">

    <xp:panel tagName="style">
    div.dijitTab:nth-child(1){background-color:red !important}
    </xp:panel>

    <xp:panel style="padding:30px">
    <xe:djTabContainer id="djTabContainer1">
        <xe:djTabPane id="djTabPane1" title="Tab1">1</xe:djTabPane>
        <xe:djTabPane id="djTabPane2" title="Tab2">2</xe:djTabPane>
    </xe:djTabContainer>
    </xp:panel>
</xp:view>