@mixin tab-bar-top($toolbarCls, $bodyCls, $stripCls, $body-padding, $body-border-width, $strip-border-width, $strip-height) {
.#{$prefix}#{$toolbarCls} {
.#{$prefix}#{$bodyCls} {
height: $tab-height;
border-width: $body-border-width;
padding: $body-padding;
}
.#{$prefix}#{$stripCls} {
/*position strip from top rather than bottom to avoid off-by-one error in IE6*/
top: $tab-height + top($body-border-width) + top($body-padding);
border-width: $strip-border-width;
height: $strip-height - vertical($strip-border-width);
}
}
.#{$prefix}border-box {
.#{$prefix}#{$toolbarCls} {
.#{$prefix}#{$bodyCls} {
height: $tab-height + vertical($body-border-width) + vertical($body-padding);
}
.#{$prefix}#{$stripCls} {
height: $strip-height;
}
}
}
}
@mixin tab-bar-bottom($toolbarCls, $bodyCls, $stripCls, $body-padding, $body-border-width, $strip-border-width, $strip-height) {
.#{$prefix}#{$toolbarCls} {
.#{$prefix}#{$bodyCls} {
height: $tab-height;
border-width: $body-border-width;
padding: $body-padding;
.#{$prefix}box-inner {
position: relative;
top: 0 - bottom($strip-border-width);
}
.#{$prefix}box-scroller,
.#{$prefix}box-scroller-left,
.#{$prefix}box-scroller-right {
height: $tab-height + bottom($body-padding) + bottom($strip-border-width);
}
}
.#{$prefix}#{$stripCls} {
top: top($body-border-width);
border-width: $strip-border-width;
height: $strip-height - vertical($strip-border-width);
}
}
.#{$prefix}border-box {
.#{$prefix}#{$toolbarCls} {
.#{$prefix}#{$bodyCls} {
height: $tab-height + vertical($body-border-width) + vertical($body-padding);
}
.#{$prefix}#{$stripCls} {
height: $strip-height;
}
}
}
}
/**
* Creates a visual theme for TabBar
* @member Ext.tab.Bar
*/
@mixin extjs-tabbar {
.#{$prefix}tab-bar {
position: relative;
background-color: transparent;
@include background-gradient($tabbar-base-color, $tabbar-background-gradient);
font-size: $tab-font-size;
}
.#{$prefix}nlg .#{$prefix}tab-bar {
background-image: theme-background-image($theme-name, 'tab-bar/tab-bar-default-bg.gif');
}
.#{$prefix}tab-bar-default-plain,
.#{$prefix}nlg .#{$prefix}tab-bar-default-plain {
background: transparent none;
}
.#{$prefix}tab-bar-body {
border-style: solid;
border-color: $tabbar-border-color;
position: relative;
z-index: 2;
zoom: 1;
}
/* Top Tabs */
@include tab-bar-top(
"tab-bar-top",
"tab-bar-body",
"tab-bar-strip",
$tabbar-top-body-padding,
$tabbar-top-body-border-width,
$tabbar-top-strip-border-width,
$tabbar-strip-height
);
@include tab-bar-top(
"tab-bar-top",
"tab-bar-body-default-plain",
"tab-bar-strip-default-plain",
$tabbar-top-plain-body-padding,
$tabbar-top-plain-body-border-width,
$tabbar-top-strip-border-width,
$tabbar-strip-height
);
/* Bottom Tabs */
@include tab-bar-bottom(
"tab-bar-bottom",
"tab-bar-body",
"tab-bar-strip",
$tabbar-bottom-body-padding,
$tabbar-bottom-body-border-width,
$tabbar-bottom-strip-border-width,
$tabbar-strip-height
);
@include tab-bar-bottom(
"tab-bar-bottom",
"tab-bar-body-default-plain",
"tab-bar-strip-default-plain",
$tabbar-bottom-plain-body-padding,
$tabbar-bottom-plain-body-border-width,
$tabbar-bottom-strip-border-width,
$tabbar-strip-height
);
.#{$prefix}tab-bar-strip-default,
.#{$prefix}tab-bar-strip-default-plain {
font-size: 0;
line-height: 0;
position: absolute;
z-index: 1;
border-style: solid;
overflow: hidden;
border-color: $tabbar-strip-border-color;
background-color: $tabbar-strip-background-color;
zoom: 1;
}
}
|