dijit
Version:
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
403 lines (333 loc) • 9.62 kB
CSS
/**
* dijit.layout.TabContainer
*/
/* Classes for all types of tabs (top/bottom/left/right) */
.soria .dijitTabContainer .tabStripRBtn {
margin-right: 21px;
}
.soria .dijitTabContainer .tabStripLBtn {
margin-left: 21px;
}
.soria .nowrapTabStrip .dijitTab {
top: 2px;
}
.soria .dijitTabContainerBottom-tabs .dijitTab {
top: -1px;
bottom: 2px;
}
/* Tabs, shared classes */
.soria .dijitTabPaneWrapper {
background:#fff;
border:1px solid #B1BADF;
margin: 0;
padding-left: 0;
}
.soria .dijitTab {
padding:4px 6px 2px 4px;
background: url("../images/tabContainerSprite.gif") repeat-x 0 -351px;
position: relative;
line-height:normal;
margin:0 2px 0 0; /* space between one tab and the next in top/bottom mode */
color: #243C5F;
border: 1px #8BA0BD solid;
border-bottom: 1px #B1BADF solid;
}
/* hovered tab */
.soria .dijitTabHover {
color: #243C5F;
background: url("../images/tabContainerSprite.gif") repeat-x 0 -201px;
}
/* selected tab*/
.soria .dijitTabChecked
{
background: url("../images/tabContainerSprite.gif") repeat-x 0 -51px;
color: #243C5F ;
}
.soria .dijitTabListWrapper {
z-index: 10;
}
/* Nested Tabs */
.soria .dijitTabContainerTabListNested {
background: #D9E9F9;
border: none;
}
.soria .dijitTabContainerTabListNested .dijitTab {
background: none;
border: none;
top: 0; /* override top:1px setting of top-level tabs */
}
.soria .dijitTabContainerTabListNested .dijitTabHover .tabLabel {
text-decoration: underline;
}
.soria .dijitTabContainerTabListNested .dijitTabChecked .tabLabel {
text-decoration: underline;
font-weight: bold;
}
.soria .dijitTabContainerSpacerNested .dijitTabSpacer {
/* thinner line between tab (labels) and content */
height: 0;
}
.soria .dijitTabPaneWrapperNested {
border: none; /* prevent double border */
}
/* Close Button */
.soria .dijitTabCloseButton {
width: 15px;
height: 15px;
background: url("../images/spriteRoundedIconsSmall.png") no-repeat -60px top;
margin-top: -1px;
}
.dj_ie6 .soria .dijitTabCloseButton {
background: url("../images/spriteRoundedIconsSmall.gif") no-repeat -60px top;
}
.soria .dijitTabCloseButtonHover {
background: url("../images/spriteRoundedIconsSmall.png") no-repeat -60px -15px;
}
.dj_ie6 .soria .dijitTabCloseButtonHover {
background: url("../images/spriteRoundedIconsSmall.gif") no-repeat -60px -15px;
}
/* ================================ */
/* top tabs */
.soria .dijitTabContainerTop-tabs {
border-color: #B1BADF;
padding-left: 3px;
}
.soria .dijitTabContainerTop-tabs .dijitTab {
border-radius: 4px 4px 0 0;
-moz-border-radius: 4px 4px 0 0;
}
.soria .dijitTabContainerTopNoStrip {
padding-top: 3px;
}
/* top container */
.soria .dijitTabContainerTop-container {
border-top: none;
}
.soria .dijitTabContainerTop .dijitTabListWrapper {
border-bottom: none;
}
/*unselected tabs */
.soria .dijitTabContainerTop-tabs .dijitTab {
top: 1px;
}
/* selected tabs */
.soria .dijitTabContainerTop-tabs .dijitTabChecked {
border-bottom-color: #94b4e6;
}
/* strip */
.soria .dijitTabContainerTopStrip {
border: 1px solid #B1BADF;
margin-top: 1px;
padding-top: 1px;
background: #F0F4FC;
}
.soria .dijitTabContainerTopStrip .dijitTabContainerTop-tabs {
padding-left: 3px;
}
.soria .dijitTabContainerNested .dijitTabListWrapper {
height: auto;
}
/* ================================ */
/* bottom tabs */
.soria .dijitTabContainerBottom-tabs {
margin-top: -1px;
padding-left: 3px;
border-top: 1px solid #B1BADF;
}
.soria .dijitTabContainerBottom .dijitTabListWrapper {
border-top: none;
padding-top: 1px;
padding-bottom: 1px;
float: left;
}
.soria .dijitTabContainerBottom-tabs .dijitTab {
border-bottom: none;
border-top: 1px solid #B1BADF;
border-radius: 0 0 4px 4px;
-moz-border-radius: 0 0 4px 4px;
padding-top: 3px;
padding-bottom: 3px;
background: url("../images/tabBottomEnabledC.gif") repeat-x bottom left;
}
.soria .dijitTabContainerBottom-tabs .dijitTabHover {
background: url("../images/tabBottomHoverC.gif") repeat-x bottom left;
}
.soria .dijitTabContainerBottom-tabs .dijitTabChecked {
border-top-color:#94b4e6;
background: url("../images/tabBottomActiveC.gif") repeat-x bottom left;
}
/* bottom container */
.soria .dijitTabContainerBottom-container {
border-bottom: none;
}
/* strip */
.soria .dijitTabContainerBottomStrip {
padding-bottom: 2px;
border: 1px solid #B1BADF;
}
.soria .dijitTabContainerBottomStrip {
background: #F0F4FC;
}
/* top/bottom strip */
.soria .dijitTabContainerBottom-spacer,
.soria .dijitTabContainerTop-spacer {
height: 2px;
border: 1px solid #8ba0bd;
background: #94b4e6;
}
.soria .dijitTabContainerTop-spacer {
border-top: none;
}
.soria .dijitTabContainerBottom-spacer {
border-bottom: none;
}
/* ================================ */
/* right tabs */
.soria .dijitTabContainerRight-tabs {
height: 100%;
border-color: #ccc;
padding-top: 3px;
}
.soria .dijitTabContainerRight-tabs .dijitTab {
border-radius: 0 4px 4px 0;
-moz-border-radius: 0 4px 4px 0;
border-bottom: none;
border-left: 1px solid #B1BADF;
border-bottom: 1px solid #B1BADF ;
padding: 4px 6px 2px 8px;
}
.soria .dijitTabContainerRight-tabs .dijitTabChecked {
border-left-color: #94b4e6;
background: url("../images/tabRightChecked.gif") no-repeat left top ;
}
/* right container */
.soria .dijitTabContainerRight-container {
border-right: none;
}
/* some odd ie bug when borders disappear when setting a bottom margin, this sort of helps */
.dj_ie6 .soria .dijitTabContainerRight-tabs .dijitTab,
.dj_ie7 .soria .dijitTabContainerRight-tabs .dijitTab {
border-bottom: solid #B1BADF 1px;
margin-bottom: -1px;
}
/* some odd ie bug when borders disappear when setting a bottom margin, this sort of helps */
.dj_ie6 .soria .dijitTabContainerRight-tabs .dijitTabChecked,
.dj_ie7 .soria .dijitTabContainerRight-tabs .dijitTabChecked,
.dj_ie6 .soria .dijitTabContainerRight-tabs .dijitTabCheckedHover,
.dj_ie7 .soria .dijitTabContainerRight-tabs .dijitTabCheckedHover {
border-bottom: solid #94b4e6 1px;
margin-bottom: -1px;
}
/* strip */
.soria .dijitTabContainerRightStrip {
padding-right: 2px;
border: 1px solid #B1BADF;
background: #F0F4FC;
border-left: none;
}
/* ================================ */
/* left tabs */
.soria .dijitTabContainerLeft-tabs {
border-color: #ccc;
padding-top: 3px;
height: 100%;
}
.soria .dijitTabContainerLeft-tabs .dijitTab {
border-radius: 4px 0 0 4px;
-moz-border-radius: 4px 0 0 4px;
border-right: 1px solid #B1BADF;
border-bottom: 1px solid #B1BADF;
}
.soria .dijitTabContainerLeft-tabs .dijitTabChecked {
border-right: 1px solid #94b4e6;
background: url("../images/tabLeftChecked.gif") no-repeat right top;
}
/* left container */
.soria .dijitTabContainerLeft-container {
border-left: none;
}
.dj_ie6 .soria .dijitTabContainerLeft-tabs .dijitTab,
.dj_ie7 .soria .dijitTabContainerLeft-tabs .dijitTab {
border-bottom: solid #B1BADF 1px;
margin-bottom: -1px;
}
.dj_ie6 .soria .dijitTabContainerLeft-tabs .dijitTabChecked .dijitTab,
.dj_ie7 .soria .dijitTabContainerLeft-tabs .dijitTabChecked .dijitTab,
.dj_ie6 .soria .dijitTabContainerLeft-tabs .dijitTabCheckedHover .dijitTab,
.dj_ie7 .soria .dijitTabContainerLeft-tabs .dijitTabCheckedHover .dijitTab {
border-bottom: solid #94b4e6 1px;
margin-bottom: -1px;
}
/* strip */
.soria .dijitTabContainerLeftStrip {
padding-left: 2px;
border: 1px solid #B1BADF;
background: #F0F4FC;
border-right: none;
}
/* ================================ */
/* left/right tabs */
.soria .dijitTabContainerLeft-tabs .dijitTab,
.soria .dijitTabContainerRight-tabs .dijitTab {
margin: 1px 0; /* space between one tab and the next in left/right mode */
}
/* left/right tabstrip */
.soria .dijitTabContainerLeft-spacer,
.soria .dijitTabContainerRight-spacer {
width: 2px;
border: 1px solid #8ba0bd;
background: #94b4e6;
}
.soria .dijitTabContainerLeft-spacer {
border-left: none;
}
.soria .dijitTabContainerRight-spacer {
border-right: none;
}
/* ================================ */
/* this resets the tabcontainer strip when within a contentpane */
.soria .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 */
.soria .dijitTabContainer .tabStripButton {
margin-right: 0;
}
.soria .dijitTabContainer .tabStripButton-top {
margin-top: 1px;
}
.dj_ie6 .soria .tabStripButton .dijitTabContent,
.dj_ie7 .soria .tabStripButton .dijitTabContent {
padding-top: 7px;
}
.dj_ie6 .soria .tabStrip-disabled .tabStripButton .dijitTabContent,
.dj_ie7 .soria .tabStrip-disabled .tabStripButton .dijitTabContent {
padding-top: 6px;
}
.soria .dijitTabContainer .tabStripButton-bottom {
background: transparent url(../images/tabBottomEnabledSpriteLR.gif) no-repeat scroll left bottom;
border-bottom: medium none;
border-top: 1px solid #B1BADF;
}
.soria .dijitTabContainer .tabStripButton-bottom .dijitTab {
background: transparent url(../images/tabBottomEnabledSpriteLR.gif) no-repeat scroll right bottom;
}
.soria .dijitTabStripIcon {
height: 14px;
width: 14px;
background: url(../images/spriteRoundedIconsSmall.png) no-repeat left top ;
}
.dj_ie6 .soria .dijitTabStripIcon {
background-image: url(../images/spriteRoundedIconsSmall.gif);
}
.soria .dijitTabStripSlideRightIcon {
background-position: -30px top;
}
.soria .dijitTabStripMenuIcon {
background-position: -15px top;
}