dijit/themes/nihilo/layout/TabContainer.css

Dijit provides a complete collection of user interface controls based on Dojo, giving you the power to create web applications that are highly optimized for usability, performance, internationalization, accessibility, but above all deliver an incredible u

/**
 * dijit.layout.TabContainer
 */
@import url("../Menu.css");

/* Classes for all types of tabs (top/bottom/left/right) */

.nihilo .dijitTabContainer .tabStripRBtn {
	margin-right: 21px;
}
.nihilo .dijitTabContainer .tabStripLBtn {
	margin-left: 21px;
}

.nihilo .dijitTabContainerBottom .nowrapTabStrip .dijitTab {
	top: 0;
}

/* Tabs, shared classes */
.nihilo .dijitTabPaneWrapper {
	background:#fff;
	border:1px solid #ccc;
	margin: 0;
	padding: 0;
}

.nihilo .dijitTab {
    padding:3px 6px 3px 4px;
    background: url("../images/tabContainerSprite.gif") repeat-x 0 -350px;
    position: relative;
	line-height:normal;
	margin: 0 1px;	/* space between one tab and the next in top/bottom mode */
	color: #6d6d6d;
    border: 1px #dedede solid;
	border-bottom: 1px #ccc solid;
}

/* hovered tab */
.nihilo .dijitTabHover {
	color: #243C5F;
	background: url("../images/tabContainerSprite.gif") repeat-x 0 -200px;
}

/* selected tab */
.nihilo .dijitTabChecked {
	background: url("../images/tabContainerSprite.gif") repeat-x 0 -50px;
	color: #243C5F !important;
}

/* Nested Tabs */
.nihilo .dijitTabContainerNested .dijitTabListWrapper {
	height: auto;
}

.nihilo .dijitTabContainerTabListNested {
	background: #FDFDFD;
	border: none;
	margin-bottom: 0;		/* override margin: -1px; */
}
.nihilo .dijitTabContainerTabListNested .dijitTab {
	background: none;
	border: none;
	top: 0;	/* override top:1px setting of top-level tabs */
}
.nihilo .dijitTabContainerTabListNested .dijitTabHover .tabLabel {
	text-decoration: underline;
}
.nihilo .dijitTabContainerTabListNested .dijitTabChecked .tabLabel {
	text-decoration: underline;
	font-weight: bold;
}
.nihilo .dijitTabContainerSpacerNested {
	/* thinner line between tab (labels) and content */
	height: 0;
	border-bottom: 0;
}
.nihilo .dijitTabPaneWrapperNested {
	border: none;	/* prevent double border */
}


/* Close button */
.nihilo .dijitTabCloseButton {
	background: url("../images/spriteRoundedIconsSmall.png") no-repeat -60px top;
	width: 15px;
	height: 15px;
	margin-top: -1px;
}

.dj_ie6 .nihilo .dijitTabCloseButton {
	background: url("../images/spriteRoundedIconsSmall.gif") no-repeat -60px top;
}
.nihilo .dijitTabCloseButtonHover {
	background: url("../images/spriteRoundedIconsSmall.png") no-repeat -60px -15px;
}
.dj_ie6 .nihilo .dijitTabCloseButtonHover {
	background: url("../images/spriteRoundedIconsSmall.gif") no-repeat -60px -15px;
}

/* ================================ */
/* top tabs */
.nihilo .dijitTabContainerTop-tabs {
	border-bottom: none;
	padding-bottom: 1px;
	background-position: bottom;
	padding-left: 3px;
}
.nihilo .dijitTabContainerTop-tabs .dijitTab {
    border-radius: 4px 4px 0 0;
    -moz-border-radius: 4px 4px 0 0;
}

.dj_ie6 .nihilo .dijitTabListContainer-top,
.dj_ie7 .nihilo .dijitTabListContainer-top {
	z-index: 3;
}

.dj_ie6 .nihilo .dijitTabContainerTop-tabs,
.dj_ie7 .nihilo .dijitTabContainerTop-tabs {
	border-bottom: 1px solid #ccc;
	padding-bottom: 0;
}

.nihilo .dijitTabContainerTopNoStrip {
	padding-top: 3px;
}

/* top container */
.nihilo .dijitTabContainerTop-container {
	border-top: none;
}

/* selected tab */
.nihilo .dijitTabContainerTop-tabs .dijitTabChecked {
	border-bottom-color: #f8f8f8;
}

/* strip */
.nihilo .dijitTabContainer .dijitTabContainerTopStrip {
	border-bottom: none;
	padding-top: 1px;
	margin-top: 1px;
	background: #f2f2f2;
	border-top: 1px solid #CCC;
	border-right: 1px solid #CCC;
	border-left: 1px solid #CCC;
}


/* ================================ */
/* bottom tabs */
.nihilo .dijitTabContainerBottom-tabs {
	border-top: none;
	background-position: top;
	padding-left: 3px;
}
.nihilo .dijitTabContainerBottom-tabs .dijitTab {
    border-radius: 0 0 4px 4px;
    -moz-border-radius: 0 0 4px 4px;
    border-bottom: none;
    border-top: 1px solid #ccc;
    padding-top: 3px;
    padding-bottom: 3px;
    background: url("../images/tabBottomEnabledC.gif") repeat-x bottom left;
}


.nihilo .dijitTabContainerBottom-tabs .dijitTabHover {
	color: #243C5F;
	background: url("../images/tabBottomHoverC.gif") repeat-x bottom left;
}

.nihilo .dijitTabContainerBottom-tabs .dijitTabChecked {
	/* the selected tab (with or without hover) */
    border-top-color: #f8f8f8;
	background: url("../images/tabBottomActiveC.gif") repeat-x bottom left;
}


.dj_ie6 .nihilo .dijitTabListContainer-bottom,
.dj_ie7 .nihilo .dijitTabListContainer-bottom {
	z-index: 3;
}

.dj_ie6 .nihilo .dijitTabContainerBottom-tabs,
.dj_ie7 .nihilo .dijitTabContainerBottom-tabs {
	border-top: 1px solid #ccc;
	margin-top: -1px;
}

/* bottom container */
.nihilo .dijitTabContainerBottom-container {
	border-bottom: none;
}

/* strip */
.nihilo .dijitTabContainer .dijitTabContainerBottomStrip {
	border: 1px solid #ccc;
	background: #f2f2f2;
	border-top: none;
	padding-bottom: 2px;
}

/* top/bottom strip */
.nihilo .dijitTabContainerBottom-spacer,
.nihilo .dijitTabContainerTop-spacer {
	height: 2px;
	border: 1px solid #ccc;
}

.nihilo  .dijitTabContainerTop-spacer {
	margin-top: -1px;
    background: #f3f3f3;
}
.nihilo .dijitTabContainerBottom-spacer {
	margin-bottom: -1px;
    background: #f8f8f8;
}


/* ================================ */
/* right tabs */
.nihilo .dijitTabContainerRight-tabs {
	border-color: #ccc;
	padding-top: 3px;
}
.nihilo .dijitTabContainerRight-tabs .dijitTab {
    border-radius: 0 4px 4px 0;
    -moz-border-radius: 0 4px 4px 0;
    border-left: 1px solid #ccc;
    border-bottom: 1px solid #dedede !important;
}

.nihilo .dijitTabContainerRight .dijitTabListWrapper {
	padding-right: 3px;
}
.nihilo .dijitTabContainerRight-tabs .dijitTabChecked {
	border-left: 1px solid #f8f8f8;
}


/* right container */
.nihilo .dijitTabContainerRight-container {
	border-right: none;
}

/* some odd ie bug when borders disappear when setting a bottom margin, this sort of helps */
.dj_ie .nihilo .dijitTabContainerRight-tabs .dijitTab {
	border-bottom: solid #fff 1px;
}

/* selected tab */
.nihilo .dijitTabContainerRight-tabs .dijitTabChecked {
	border-left-color: #f8f8f8;
}

/* some odd ie bug when borders disappear when setting a bottom margin, this sort of helps */
.dj_ie .nihilo .dijitTabContainerRight-tabs .dijitTabChecked,
.dj_ie .nihilo .dijitTabContainerRight-tabs .dijitTabCheckedHover {
	border-bottom: solid #efefef 1px;
}

/* strip */
.nihilo .dijitTabContainerRightStrip {
	padding-right: 2px;
	border: 1px solid #ccc;
	border-left: none;
	background: #f2f2f2;
}

/* ================================ */
/* left tabs */
.nihilo .dijitTabContainerLeft-tabs {
	border-color: #ccc;
	padding-top: 3px;
}
.nihilo .dijitTabContainerLeft-tabs .dijitTab {
    border-radius: 4px 0 0 4px;
    -moz-border-radius: 4px 0 0 4px;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #dedede;
}

/* selected tab */
.nihilo .dijitTabContainerLeft-tabs .dijitTabChecked {
	border-right: 1px solid #f8f8f8;
}

/* left container */
.nihilo .dijitTabContainerLeft-container {
	border-left: none;
}


.dj_ie .nihilo .dijitTabContainerLeft-tabs .dijitTabChecked,
.dj_ie .nihilo .dijitTabContainerLeft-tabs .dijitTabCheckedHover {
	border-bottom: solid #efefef 1px;
}

.dj_ie .nihilo .dijitTabContainerLeft-tabs .dijitTabInnerDiv {
	border-bottom: solid #fff 1px;
}

/* strip */
.nihilo .dijitTabContainerLeftStrip {
	padding-left: 2px;
	border: 1px solid #ccc;
	border-right: none;
}

.nihilo .dijitTabContainerLeftStrip {
	background: #f2f2f2;
}

/* ================================ */
/* left/right tabs */
.nihilo .dijitTabContainerLeft-tabs .dijitTab,
.nihilo .dijitTabContainerRight-tabs .dijitTab {
	margin: 1px 0;	/* space between one tab and the next in left/right mode */
}

/* left/right tabstrip */
.nihilo .dijitTabContainerLeft-spacer,
.nihilo .dijitTabContainerRight-spacer {
	width: 2px;
	border: 1px solid #ccc;
	background: #f8f8f8;
}

.nihilo .dijitTabContainerRight-spacer {
	border-right: none;
}

.nihilo .dijitTabContainerRight-tabs {
	padding-top: 3px;
	height: 100%;
}
.nihilo .dijitTabContainerLeft-tabs {
	height: 100%;
}

.nihilo .dijitTabContainerLeft-spacer {
	border-left: none;
}

/* ================================ */

/* this resets the tabcontainer strip when within a contentpane */
.nihilo .dijitTabContainerTop-dijitContentPane .dijitTabContainerTop-tabs {
	border-left: 0 solid #ccc;
	border-top: 0 solid #ccc;
	border-right: 0 solid #ccc;
	padding-top: 0;
	padding-left: 0;
}

/* ================================ */

/* Menu and slider control styles */
.nihilo .dijitTabContainer .tabStripButton {
	margin-right: 0;
	padding: 5px 3px 6px 0px;
}

.dj_ie6 .nihilo .tabStripButton .dijitTabInnerDiv .dijitTabContent,
.dj_ie7 .nihilo .tabStripButton .dijitTabInnerDiv .dijitTabContent,
.dj_opera .nihilo .tabStripButton .dijitTabInnerDiv .dijitTabContent {
	padding-bottom: 7px;
}

.dj_ie6 .nihilo .tabStrip-disabled .tabStripButton .dijitTabInnerDiv .dijitTabContent,
.dj_ie7 .nihilo .tabStrip-disabled .tabStripButton .dijitTabInnerDiv .dijitTabContent,
.dj_opera .nihilo .tabStrip-disabled .tabStripButton .dijitTabInnerDiv .dijitTabContent {
	padding-top: 4px;
}

.nihilo .dijitTabStripIcon {
	height: 14px;
	width: 14px;
	background: url(../images/spriteRoundedIconsSmall.png) no-repeat left top;
}

.dj_ie6 .nihilo .dijitTabStripIcon {
	background-image: url(../images/spriteRoundedIconsSmall.gif);
}

.nihilo .dijitTabStripSlideRightIcon {
	background-position: -30px top;
}

.nihilo .dijitTabStripMenuIcon {
	background-position: -15px top;
}

.nihilo .dijitTabContainerTopNone {
	padding-top: 0;
}

.nihilo .dijitTabContainer .tabStripButton-top {
	margin-top: 1px;
}

.nihilo .dijitTabContainer .tabStripButton-bottom {
	border-bottom: medium none;
	border-top: 1px solid #CCCCCC;
}