TabView

[Allysonlc]

Hello!

I bought Ultima, and I need the tabView to be indigo, and the selected tab is pink?
Please, I really need your help!

[mert.sincan]

Please try;

Code: Select all

<style type="text/css">
    body .ui-tabs .ui-tabs-nav li {
        margin-top: 2px;
    } 
    body .ui-tabs.ui-tabs-top > .ui-tabs-nav > li {
        border-width: 0;
    }
    body .ui-tabs .ui-tabs-nav {
        background-color: #3F51B5;
    }
    body .ui-tabs .ui-tabs-nav > li.ui-state-default a,
    body .ui-tabs .ui-tabs-nav > li.ui-state-active a,
    body .ui-tabs .ui-tabs-nav > li > .ui-icon-close,
    body .ui-tabs .ui-tabs-nav > li.ui-state-active > .ui-icon-close{
        color: #ffffff;
    }
    body .ui-tabs .ui-tabs-nav > li.ui-state-hover {
        background-color: #283593;
    }
    body .ui-tabs .ui-tabs-nav > li.ui-state-active {
        background-color: #E91E63;
    }

    body.layout-compact .ui-tabs .ui-tabs-nav > li > .ui-icon-close {
        margin: 7px 0.2em 0 0;
    }
</style>

[Allysonlc]

Thank you very much!

[mert.sincan]

You're welcome!

[Allysonlc]

Hello!

You have already helped me a lot with tabView, but I am facing another problem, as you can see in the attached image below I have one inside the other, and I need the inside to be of another color, to differentiate them and not cause problems of deception . If it is possible I choose the better color, if it could not be in the Amber color with the Cyan tabs.

Thank you very much in advance!


http://server.cubosis.com.br:8080/files ... p_3568.jpg

[mert.sincan]

I think you can do it with a class;

Code: Select all

<style type="text/css">
    body .innerTabView.ui-tabs .ui-tabs-nav {
        background-color: ...
    }
    body .innerTabView.ui-tabs .ui-tabs-nav > li.ui-state-hover {
        background-color: ...
    }
    body .innerTabView.ui-tabs .ui-tabs-nav > li.ui-state-active {
        background-color: ...
    }
</style>

//xhtml
...
    <p:tabview styleClass="innerTabView" ...>
...