docs/resources/themes/stylesheets/ext4/default/widgets/_btn-group.scss

   1 @mixin extjs-btn-group {
   2     .#{$prefix}btn-group {
   3         position: relative;
   4         overflow: hidden;
   5     }
   6
   7     .#{$prefix}btn-group-body {
   8         position: relative;
   9         zoom: 1;
  10
  11         padding: $btn-group-padding;
  12     }
  13
  14     .#{$prefix}btn-group-header-text {
  15         white-space: nowrap;
  16     }
  17
  18     @include extjs-btn-group-ui('default');
  19 }
  20
  21 /**
  22  * @mixin extjs-btn-group-ui
  23  * @class Ext.ButtonGroup
  24  */
  25 @mixin extjs-btn-group-ui(
  26     $ui-label,
  27     $ui-base-color: null,
  28
  29     // background
  30     $ui-background-color: $btn-group-background-color,
  31
  32     // borders
  33     $ui-border-color: $btn-group-border-color,
  34     $ui-border-width: $btn-group-border-width,
  35     $ui-border-radius: $btn-group-border-radius,
  36     $ui-inner-border-color: $btn-group-inner-border-color,
  37
  38     //header
  39     $ui-header-background-color: $btn-group-header-background-color,
  40     $ui-header-font: $btn-group-header-font,
  41     $ui-header-color: $btn-group-header-color
  42 ){
  43     @include x-frame(
  44         'btn-group',
  45         $ui: '#{$ui-label}-framed',
  46
  47         /* Radius, width, padding and background-color */
  48         $border-radius: $ui-border-radius,
  49         $border-width: $ui-border-width,
  50         $padding: $btn-group-padding,
  51         $background-color: $ui-background-color
  52     );
  53
  54     .#{$prefix}btn-group-#{$ui-label}-framed {
  55         border-color: $ui-border-color;
  56         @include inner-border(
  57             $width: $btn-group-inner-border-width,
  58             $color: $ui-inner-border-color
  59         );
  60     }
  61
  62     .#{$prefix}btn-group-header-#{$ui-label}-framed {
  63         margin: $btn-group-header-margin;
  64     }
  65
  66     .#{$prefix}btn-group-header-body-#{$ui-label}-framed {
  67         padding: $btn-group-header-padding;
  68
  69         background: $ui-header-background-color;
  70
  71         @include border-top-radius($ui-border-radius);
  72     }
  73
  74     .#{$prefix}btn-group-header-text-#{$ui-label}-framed {
  75         font: $ui-header-font;
  76         color: $ui-header-color;
  77     }
  78 }