Upgrade to ExtJS 4.0.0 - Released 04/26/2011

[extjs.git] / resources / themes / stylesheets / ext4 / default / widgets / _tabbar.scss

diff --git a/resources/themes/stylesheets/ext4/default/widgets/_tabbar.scss b/resources/themes/stylesheets/ext4/default/widgets/_tabbar.scss
new file mode 100644 (file)
index 0000000..5191714
--- /dev/null
+++ b/resources/themes/stylesheets/ext4/default/widgets/_tabbar.scss
@@ -0,0 +1,151 @@
+/**
+  * @class 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-image($theme-name, 'tab-bar/tab-bar-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;
+    }
+
+    @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;
+                }
+            }
+        }
+    }
+
+
+    /* 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;
+    }
+}
\ No newline at end of file