partkeepr

fork of partkeepr
git clone https://git.e1e0.net/partkeepr.git
Log | Files | Refs | Submodules | README | LICENSE

_tabbar.scss (4462B)

      1 
      2 @mixin tab-bar-top($toolbarCls, $bodyCls, $stripCls, $body-padding, $body-border-width, $strip-border-width, $strip-height) {
      3     .#{$prefix}#{$toolbarCls} {
      4         .#{$prefix}#{$bodyCls} {
      5             height: $tab-height;
      6             border-width: $body-border-width;
      7             padding: $body-padding;
      8         }
      9 
     10         .#{$prefix}#{$stripCls} {
     11             /*position strip from top rather than bottom to avoid off-by-one error in IE6*/
     12             top: $tab-height + top($body-border-width) + top($body-padding);
     13             border-width: $strip-border-width;
     14             height: $strip-height - vertical($strip-border-width);
     15         }
     16     }
     17     .#{$prefix}border-box {
     18         .#{$prefix}#{$toolbarCls} {
     19             .#{$prefix}#{$bodyCls} {
     20                 height: $tab-height + vertical($body-border-width) + vertical($body-padding);
     21             }
     22 
     23             .#{$prefix}#{$stripCls} {
     24                 height: $strip-height;
     25             }
     26         }
     27     }
     28 }
     29 
     30 @mixin tab-bar-bottom($toolbarCls, $bodyCls, $stripCls, $body-padding, $body-border-width, $strip-border-width, $strip-height) {
     31     .#{$prefix}#{$toolbarCls} {
     32         .#{$prefix}#{$bodyCls} {
     33             height: $tab-height;
     34             border-width: $body-border-width;
     35             padding: $body-padding;
     36 
     37             .#{$prefix}box-inner {
     38                 position: relative;
     39                 top: 0 - bottom($strip-border-width);
     40             }
     41 
     42             .#{$prefix}box-scroller,
     43             .#{$prefix}box-scroller-left,
     44             .#{$prefix}box-scroller-right {
     45                 height: $tab-height + bottom($body-padding) + bottom($strip-border-width);
     46             }
     47         }
     48 
     49         .#{$prefix}#{$stripCls} {
     50             top: top($body-border-width);
     51             border-width: $strip-border-width;
     52             height: $strip-height - vertical($strip-border-width);
     53         }
     54     }
     55     .#{$prefix}border-box {
     56         .#{$prefix}#{$toolbarCls} {
     57             .#{$prefix}#{$bodyCls} {
     58                 height: $tab-height + vertical($body-border-width) + vertical($body-padding);
     59             }
     60 
     61             .#{$prefix}#{$stripCls} {
     62                 height: $strip-height;
     63             }
     64         }
     65     }
     66 }
     67 
     68 /**
     69  * Creates a visual theme for TabBar
     70  * @member Ext.tab.Bar
     71  */
     72 @mixin extjs-tabbar {
     73     .#{$prefix}tab-bar {
     74         position: relative;
     75         background-color: transparent;
     76         @include background-gradient($tabbar-base-color, $tabbar-background-gradient);
     77         font-size: $tab-font-size;
     78     }
     79 
     80     .#{$prefix}nlg .#{$prefix}tab-bar {
     81         background-image: theme-background-image($theme-name, 'tab-bar/tab-bar-default-bg.gif');
     82     }
     83 
     84     .#{$prefix}tab-bar-default-plain,
     85     .#{$prefix}nlg .#{$prefix}tab-bar-default-plain {
     86         background: transparent none;
     87     }
     88 
     89 
     90     .#{$prefix}tab-bar-body {
     91         border-style: solid;
     92         border-color: $tabbar-border-color;
     93 
     94         position: relative;
     95         z-index: 2;
     96         zoom: 1;
     97     }
     98 
     99     /* Top Tabs */
    100     @include tab-bar-top(
    101         "tab-bar-top",
    102         "tab-bar-body",
    103         "tab-bar-strip",
    104         $tabbar-top-body-padding,
    105         $tabbar-top-body-border-width,
    106         $tabbar-top-strip-border-width,
    107         $tabbar-strip-height
    108     );
    109     @include tab-bar-top(
    110         "tab-bar-top",
    111         "tab-bar-body-default-plain",
    112         "tab-bar-strip-default-plain",
    113         $tabbar-top-plain-body-padding,
    114         $tabbar-top-plain-body-border-width,
    115         $tabbar-top-strip-border-width,
    116         $tabbar-strip-height
    117     );
    118 
    119     /* Bottom Tabs */
    120     @include tab-bar-bottom(
    121         "tab-bar-bottom",
    122         "tab-bar-body",
    123         "tab-bar-strip",
    124         $tabbar-bottom-body-padding,
    125         $tabbar-bottom-body-border-width,
    126         $tabbar-bottom-strip-border-width,
    127         $tabbar-strip-height
    128     );
    129 
    130     @include tab-bar-bottom(
    131         "tab-bar-bottom",
    132         "tab-bar-body-default-plain",
    133         "tab-bar-strip-default-plain",
    134         $tabbar-bottom-plain-body-padding,
    135         $tabbar-bottom-plain-body-border-width,
    136         $tabbar-bottom-strip-border-width,
    137         $tabbar-strip-height
    138     );
    139 
    140     .#{$prefix}tab-bar-strip-default,
    141     .#{$prefix}tab-bar-strip-default-plain {
    142         font-size: 0;
    143         line-height: 0;
    144         position: absolute;
    145         z-index: 1;
    146         border-style: solid;
    147         overflow: hidden;
    148         border-color: $tabbar-strip-border-color;
    149         background-color: $tabbar-strip-background-color;
    150         zoom: 1;
    151     }
    152 }