META-INF.resources.primefaces.tabview.tabview.css Maven / Gradle / Ivy

Show more of this group Show more artifacts with this name
Show all versions of primefaces Show documentation

PrimeFaces is one of the most popular UI libraries in Java EE Ecosystem and widely used by software companies, world renowned brands, banks, financial institutions, insurance companies, universities and more.

There is a newer version: 14.0.5

Show newest version

.ui-tabs {
    position: relative;
    padding: .2em;
    zoom: 1;
} /* position: relative prevents IE scroll bug (element with position: relative inside container with overflow: auto appear as "fixed") */

.ui-tabs .ui-tabs-nav {
    margin: 0;
}

.ui-tabs .ui-tabs-nav li {
    list-style: none;
    position: relative;
    margin: 0 .2em 1px 0;
    padding: 0;
    white-space: nowrap;
    display: inline-block;
    vertical-align: top;
    float: none;
}

.ui-tabs .ui-tabs-nav li a {
    float: left;
    padding: .5em 1em;
    text-decoration: none;
    outline: none;
}

.ui-tabs .ui-tabs-nav li.ui-tabs-selected a,
.ui-tabs .ui-tabs-nav li.ui-state-disabled a,
.ui-tabs .ui-tabs-nav li.ui-state-processing a {
    cursor: text;
}

.ui-tabs .ui-tabs-nav li a,
.ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a {
    cursor: pointer;
} /* first selector in group seems obsolete, but required to overcome bug in Opera applying cursor: text overall if defined elsewhere... */

.ui-tabs .ui-tabs-panel {
    border-width: 0;
    padding: 1em 1.4em;
    background: none;
}

.ui-tabs .ui-tabs-nav li > .ui-icon {
    float: left;
    margin: 0.4em 0.2em 0 0;
    cursor: pointer;
}

/* per orientation settings */
/* top and bottom */
.ui-tabs.ui-tabs-top > .ui-tabs-nav li {
    border-bottom: 0;
    top: 1px;
}

.ui-tabs.ui-tabs-top > .ui-tabs-nav {
    padding: .2em .2em 0;
}

.ui-tabs.ui-tabs-bottom > .ui-tabs-nav {
    padding: 0 .2em .2em;
}

.ui-tabs.ui-tabs-bottom > .ui-tabs-nav li {
    border-top: 0;
}

/* left and right*/
.ui-tabs-left:after,
.ui-tabs-right:after {
    clear:both;
    content: ".";
    display: block;
    height: 0;
    visibility: hidden;
}

.ui-tabs-left > .ui-tabs-nav {
    float:left;
    width:23%;
    height:300px;
    background-image: none;
    padding-top:1px;
}

.ui-tabs-left > .ui-tabs-panels {
    float:right;
    width:75%;
}

.ui-tabs.ui-tabs-left > .ui-tabs-nav li,
.ui-tabs.ui-tabs-right > .ui-tabs-nav li{
    display: block;
    white-space: normal;
    width: 98%;
}

.ui-tabs.ui-tabs-left > .ui-tabs-nav li a,
.ui-tabs.ui-tabs-right > .ui-tabs-nav li a {
    width: 90%;
}

.ui-tabs.ui-tabs-left > .ui-tabs-nav li {
    float: right;
}

.ui-tabs.ui-tabs-right > .ui-tabs-nav li {
    float: left;
}

.ui-tabs.ui-tabs-left > .ui-tabs-nav li {
    margin:0 0 1px 0.2em;
    border-right:0 none;
}

.ui-tabs.ui-tabs-right > .ui-tabs-nav {
    float:right;
    width:23%;
    height:300px;
    background-image: none;
    padding-top:1px;
}

.ui-tabs.ui-tabs-right > .ui-tabs-panels {
    float:left;
    width:75%;
}

.ui-tabs.ui-tabs-right > .ui-tabs-nav li {
    margin:0 0.2em 1px 0;
    border-left:0 none;
}

.ui-tabs.ui-tabs-left .ui-tabs-actions, .ui-tabs.ui-tabs-right .ui-tabs-actions {
    position: absolute;
    bottom: 0;
    padding: .2em; /** .ui-tabs padding **/
}

/** RTL **/
.ui-tabs-rtl {
    direction: rtl;
}

/** Scroll **/
.ui-tabs-scrollable .ui-tabs-nav {
    width:5000px;
}

.ui-tabs .ui-tabs-navscroller {
    overflow: hidden;
    padding-left: 18px;
}

.ui-tabs .ui-tabs-navscroller.ui-tabs-navscroller-btn-hidden {
    padding-left: 0;
}

.ui-tabs-scrollable .ui-tabs-nav li {
    margin: 0 .2em -1px 0;
}

.ui-tabs .ui-tabs-navscroller-btn {
    position: absolute;
    height: 28px;
    z-index: 100;
    cursor: pointer;
}

.ui-tabs .ui-tabs-navscroller.ui-tabs-navscroller-btn-hidden .ui-tabs-navscroller-btn {
    display: none;
}

.ui-tabs .ui-tabs-navscroller-btn-left {
    left: 0.2em;
}

.ui-tabs .ui-tabs-navscroller-btn-right {
    right: 0.2em;
}

.ui-tabs .ui-tabs-navscroller-btn-left .ui-icon,
.ui-tabs .ui-tabs-navscroller-btn-right .ui-icon {
    margin-top: 5px;
}

.ui-tabs-outline {
    outline: dotted thin;
    z-index: 1;
}

.ui-tabs li.ui-tabs-actions {
    float: right;
}

.ui-tabs.ui-tabs-rtl li.ui-tabs-actions {
    float: left;
}

.ui-tabs li.ui-tabs-actions[aria-hidden='true'] {
    display: none;
}