partkeepr

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

_toolbar.scss (4671B)

      1 /**
      2  * Creates base structure for Toolbar
      3  * @member Ext.toolbar.Toolbar
      4  */
      5 @mixin extjs-toolbar {
      6     .#{$prefix}toolbar {
      7         font-size: $toolbar-font-size;
      8 
      9         border: 1px solid;
     10 
     11         padding: $toolbar-vertical-spacing 0 $toolbar-vertical-spacing $toolbar-horizontal-spacing;
     12 
     13         .#{$prefix}form-item-label{
     14             font-size: $toolbar-font-size;
     15             line-height: 15px;
     16         }
     17 
     18         .#{$prefix}toolbar-item {
     19             margin: 0 $toolbar-horizontal-spacing 0 0;
     20         }
     21 
     22         .#{$prefix}toolbar-text {
     23             margin-left: 4px;
     24             margin-right: 6px;
     25             white-space: nowrap;
     26             color: $toolbar-text-color;
     27             line-height: $toolbar-text-line-height;
     28             font-family: $toolbar-text-font-family;
     29             font-size: $toolbar-text-font-size;
     30             font-weight: $toolbar-text-font-weight;
     31         }
     32 
     33         .#{$prefix}toolbar-separator {
     34             display: block;
     35             font-size: 1px;
     36             overflow: hidden;
     37             cursor: default;
     38             border: 0;
     39         }
     40 
     41         .#{$prefix}toolbar-separator-horizontal {
     42             margin: 0 3px 0 2px;
     43 
     44             height: 14px;
     45             width: 0px;
     46 
     47             border-left: 1px solid $toolbar-separator-color;
     48             border-right: 1px solid $toolbar-separator-highlight-color;
     49         }
     50     }
     51 
     52     @if $include-ie {
     53         .#{$prefix}quirks .#{$prefix}ie .#{$prefix}toolbar .#{$prefix}toolbar-separator-horizontal {
     54             width: 2px;
     55         }
     56     }
     57 
     58     .#{$prefix}toolbar-footer {
     59         background: transparent;
     60         border: 0px none;
     61         margin-top: 3px;
     62 
     63         padding: $toolbar-footer-vertical-spacing 0 $toolbar-footer-vertical-spacing $toolbar-footer-horizontal-spacing;
     64 
     65         .#{$prefix}box-inner {
     66             border-width: 0;
     67         }
     68 
     69         .#{$prefix}toolbar-item {
     70             margin: 0 $toolbar-footer-horizontal-spacing 0 0;
     71         }
     72     }
     73 
     74     .#{$prefix}toolbar-vertical {
     75         padding: $toolbar-vertical-spacing $toolbar-horizontal-spacing 0 $toolbar-horizontal-spacing;
     76 
     77         .#{$prefix}toolbar-item {
     78             margin: 0 0 $toolbar-horizontal-spacing 0;
     79         }
     80 
     81         .#{$prefix}toolbar-text {
     82             margin-top: 4px;
     83             margin-bottom: 6px;
     84         }
     85 
     86         .#{$prefix}toolbar-separator-vertical {
     87             margin: 2px 5px 3px 5px;
     88 
     89             height: 0px;
     90             width: 10px;
     91             line-height: 0px;
     92 
     93             border-top: 1px solid $toolbar-separator-color;
     94             border-bottom: 1px solid $toolbar-separator-highlight-color;
     95         }
     96     }
     97 
     98     .#{$prefix}toolbar-scroller {
     99         padding-left: 0;
    100     }
    101 
    102     .#{$prefix}toolbar-spacer {
    103         width: $toolbar-spacer-width;
    104     }
    105 
    106     // Background for overflow button inserted by the Menu box overflow handler within a toolbar
    107     .#{$prefix}toolbar-more-icon {
    108         background-image: theme-background-image($theme-name, 'toolbar/more.gif') !important;
    109         background-position: 2px center !important;
    110         background-repeat: no-repeat;
    111     }
    112 
    113     @include extjs-toolbar-ui(
    114         'default',
    115         $background-color: $toolbar-background-color,
    116         $background-gradient: $toolbar-background-gradient,
    117         $border-color: $toolbar-border-color
    118     );
    119 
    120     //plain toolbars have no border
    121     //by default they get no color, so they are transparent. IE6 doesnt support transparent borders
    122     //so we must set the width to 0.
    123     .#{$prefix}toolbar-plain {
    124         border: 0;
    125     }
    126 }
    127 
    128 /**
    129  * Creates a visual theme for an Toolbar.
    130  * @param {String} $ui The name of the UI
    131  * @param {Color} $background-color The background color of the toolbar (defaults to transparent)
    132  * @param {Gradient/color-stops} $background-gradient The background gradient of the toolbar (defaults to null)
    133  * @param {Color} $border-color The border color of the toolbar (defaults to null)
    134  * @member Ext.toolbar.Toolbar
    135  */
    136 @mixin extjs-toolbar-ui(
    137     $ui,
    138 
    139     $background-color: transparent,
    140     $background-gradient: null,
    141 
    142     $border-color: null
    143 ) {
    144     .#{$prefix}toolbar-#{$ui} {
    145         @if $border-color != null {
    146             border-color: $border-color;
    147         }
    148 
    149         @include background-gradient($background-color, $background-gradient);
    150     }
    151 
    152     @if not $supports-gradients or $compile-all {
    153         @if $background-gradient != null {
    154             .#{$prefix}nlg {
    155                 .#{$prefix}toolbar-#{$ui} {
    156                     background-image: theme-background-image($theme-name, 'toolbar/toolbar-#{$ui}-bg.gif') !important;
    157                     background-repeat: repeat-x;
    158                 }
    159             }
    160         }
    161     }
    162 }