3.1.2 (Brainy Betty) 27d941520f8f563c766c96598b364f75903e8273 o:Sass::Tree::RootNode :@has_childrenT:@children[o:Sass::Tree::ImportNode ;[: @options{:@imported_filename"../global: @linei:@template0o:Sass::Tree::CommentNode ;[: @loud0; @ : @silent0: @value""/** * @class Ext.Toolbar */; i: @lines[o; ;[;0; @ ;0;"~/** * @var {color} $toolbar-base-color * The primary color variable from which toolbars derive their light and dark UIs. */; i ;[o:Sass::Tree::VariableNode ;[; @ : @guarded" !default: @name"toolbar-base-color: @expro:Sass::Script::Variable ; {;"base-color:@underscored_name"base_color; i; io; ;[;0; @ ;0;"q/** * @var {measurement} $toolbar-spacing * Space between items in a toolbar (like buttons and fields) */; i;[o; ;[; @ ;" !default;"toolbar-spacing;o:Sass::Script::Number :@denominator_units[; {:@numerator_units["em:@original" 0.2em;f0.20000000000000001™š; i; io; ;[;0; @ ;0;"Z/** * @var {string} $toolbar-gradient * Background gradient style for toolbars. */; i;[o; ;[; @ ;" !default;"toolbar-gradient;o; ; {;"base-gradient;"base_gradient; i; io; ;[;0; @ ;0;"p/** * @var {boolean} $include-toolbar-uis * Optionally disable separate toolbar UIs (light and dark). */; i;[o; ;[; @ ;" !default;"include-toolbar-uis;o; ; {;"include-default-uis;"include_default_uis; i"; i"o; ;[;0; @ ;0;"0/** * Includes default toolbar styles. */; i$;[o:Sass::Tree::MixinDefNode ;T;[ o:Sass::Tree::RuleNode ;T;[o:Sass::Tree::PropNode ;[: @tabsi; @ :@prop_syntax:new;[" padding;o:Sass::Script::List ; {:@separator: space;[o; ;[; @O;[;"0;i; i*o; ; @O;"toolbar-spacing;"toolbar_spacing; i*; i*; i*o; ;[;i; @ ; ;!;[" overflow;o:Sass::Script::String;" hidden: @type:identifier; i+o; ;[;i; @ ; ;!;[" position;o;%;" relative;&;'; i,o; ;[;i; @ ; ;!;[" height;o; ; {;"global-row-height;"global_row_height; i-; i-o; ;T;[o; ;[;i; @ ; ;!;[" z-index;o;%;"1;&;'; i0;i; @ : @rule[" & > *:@parsed_ruleso:"Sass::Selector::CommaSequence: @members[o:Sass::Selector::Sequence;+[o:#Sass::Selector::SimpleSequence;+[o:Sass::Selector::Parent:@filename"; i/;/@}; i/">o;-;+[o:Sass::Selector::Universal:@namespace0;/@}; i/;/@}; i/;/@}; i/; i/o; ;T;[o; ;[;i; @ ; ;!;["border-bottom;o;%;".1em solid;&;'; i4;i; @ ;(["&.x-docked-top;)o;*;+[o;,;+[o;-;+[o;.;/"; i3o:Sass::Selector::Class;["x-docked-top;/@Ž; i3;/@Ž; i3;/@Ž; i3; i3o; ;T;[o; ;[;i; @ ; ;!;["border-top;o;%;".1em solid;&;'; i8;i; @ ;(["&.x-docked-bottom;)o;*;+[o;,;+[o;-;+[o;.;/"; i7o;2;["x-docked-bottom;/@£; i7;/@£; i7;/@£; i7; i7o; ;T;[ o; ;[;i; @ ; ;!;[" width;o;%;"7em;&;'; i; i>o; ;[;i; @ ; ;!;["border-right;o;%;".1em solid;&;'; i?;i; @ ;(["&.x-docked-left;)o;*;+[o;,;+[o;-;+[o;.;/"; i;o;2;["x-docked-left;/@Ì; i;;/@Ì; i;;/@Ì; i;; i;o; ;T;[ o; ;[;i; @ ; ;!;[" width;o;%;"7em;&;'; iCo; ;[;i; @ ; ;!;[" height;o;%;" auto;&;'; iDo; ;[;i; @ ; ;!;[" padding;o; ; {;"toolbar-spacing;"toolbar_spacing; iE; iEo; ;[;i; @ ; ;!;["border-left;o;%;".1em solid;&;'; iF;i; @ ;(["&.x-docked-right;)o;*;+[o;,;+[o;-;+[o;.;/"; iBo;2;["x-docked-right;/@õ; iB;/@õ; iB;/@õ; iB; iB;i; @ ;([".x-toolbar;)o;*;+[o;,;+[o;-;+[o;2;["x-toolbar;/"; i);/@; i);/@; i); i)o; ;T;[o; ;[;i; @ ; ;!;["line-height;o:Sass::Script::Operation :@operand1o; ; {;"global-row-height;"global_row_height; iK; @ :@operator: minus:@operand2o; ;[; @ ;["em;" 0.5em;f0.5; iK; iK; iKo; ;[;i; @ ; ;!;["font-size;o;%;" 1.2em;&;'; iLo; ;[;i; @ ; ;!;["text-align;o;%;" center;&;'; iMo; ;[;i; @ ; ;!;["font-weight;o;%;" bold;&;'; iNo; ;[;i; @ ; ;!;["white-space;o;%;" nowrap;&;'; iOo; ;[;i; @ ; ;!;[" overflow;o;%;" hidden;&;'; iPo; ;[;i; @ ; ;!;["text-overflow;o;%;" ellipsis;&;'; iQo; ;[;i; @ ; ;!;[" margin;o;%;" 0 0.3em;&;'; iRo; ;[;i; @ ; ;!;["max-width;o;%;" 100%;&;'; iSo; ;T;[ o; ;[;i; @ ; ;!;["white-space;o;%;" nowrap;&;'; iVo; ;[;i; @ ; ;!;[" overflow;o;%;" hidden;&;'; iWo; ;[;i; @ ; ;!;["text-overflow;o;%;" ellipsis;&;'; iXo; ;[;i; @ ; ;!;[" padding;o;%;" 0 .3em;&;'; iY;i; @ ;([".x-innerhtml;)o;*;+[o;,;+[o;-;+[o;2;["x-innerhtml;/"; iU;/@k; iU;/@k; iU; iU;i; @ ;([" .x-title;)o;*;+[o;,;+[o;-;+[o;2;[" x-title;/"; iJ;/@w; iJ;/@w; iJ; iJu:Sass::Tree::IfNodem[o:Sass::Script::Variable : @options{: @name"include-toolbar-uis:@underscored_name"include_toolbar_uis: @linei]0[ o:Sass::Tree::MixinNode :@children[;{: @args[o:Sass::Script::String ;{: @value" dark; i^: @type: stringo:Sass::Script::Funcall ;@; [o; ;@;"toolbar-base-color;"toolbar_base_color; i^o:Sass::Script::Number :@denominator_units[;@:@numerator_units["%:@original"10%;i; i^;" darken; i^:@keywords{;"sencha-toolbar-ui; i^;{o; ; [;@ ; [o; ;{;" light; i_;;o; ;@$;"toolbar-base-color;"toolbar_base_color; i_;"sencha-toolbar-ui; i_;{o; ; [;@ ; [o; ;{;" neutral; i`;;o; ;@/;"neutral-color;"neutral_color; i`;"sencha-toolbar-ui; i`;{o:Sass::Tree::RuleNode :@has_childrenT; [o:Sass::Tree::VariableNode ; [;@ : @guarded0;"mask-radial-glow: @expro; ;{; [o; ;@<;"base-color;"base_color; ico; ;[;@<;[;"25;i; ic;" lighten; ic;{; ico; ; [;@ ; [o; ;{; [o; ;@K; [o; ;@K;"mask-radial-glow;"mask_radial_glow; ido; ;@B;@K;[;"0.3;f0.2999999999999999933; id;" fade-out; id;{o:Sass::Script::List ;@K:@separator: space;[o; ;@K; [o; ;@K;"mask-radial-glow;"mask_radial_glow; ido; ;@B;@K;[;"1;i; id;" fade-out; id;{o; ;[;@K;["px;" 24px;i; id; id;"radial-gradient; id;{;"background-image; id;{o; ;T; [o; ; [;@ ; [o:Sass::Script::Color ;{: @attrs{ :rediÿ: alphai: greeniÿ: blueiÿ;0; ifo; ;@s;" recessed; if;;;"background-gradient; if;{: @tabsi;@ : @rule["!.x-button-icon.x-button-mask:@parsed_ruleso:"Sass::Selector::CommaSequence: @members[o:Sass::Selector::Sequence;)[o:#Sass::Selector::SimpleSequence;)[o:Sass::Selector::Class;["x-button-icon:@filename"; ieo;,;["x-button-mask;-@; ie;-@; ie;-@; ie; ie;%i;@ ;&["N.x-toolbar.x-toolbar-neutral .x-toolbar-inner .x-button.x-button-pressing;'o;(;)[o;*;)[o;+;)[o;,;["x-toolbar;-"; ibo;,;["x-toolbar-neutral;-@Ž; ib;-@Ž; ibo;+;)[o;,;["x-toolbar-inner;-@Ž; ib;-@Ž; ibo;+;)[o;,;[" x-button;-@Ž; ibo;,;["x-button-pressing;-@Ž; ib;-@Ž; ib;-@Ž; ib; ibo; ;T;[o; ;T;[o; ;[;i; @ ; ;!;[" overflow;o;%;" visible;&;'; im;i; @ ;([".x-container;)o;*;+[o;,;+[o;-;+[o;2;["x-container;/"; il;/@Ž; il;/@Ž; il; il;i; @ ;([".x-navigation-bar;)o;*;+[o;,;+[o;-;+[o;2;["x-navigation-bar;/"; ik;/@š; ik;/@š; ik; ik; @ : @args[;"sencha-toolbar; i'o; ;[;0; @ ;0;"ì/** * Creates a theme UI for toolbars. * * // SCSS * @include sencha-toolbar-ui('sub', #58710D, 'glossy'); * * // JS * var myTb = new Ext.Toolbar({title: 'My Green Glossy Toolbar', ui: 'sub'}) * * @param {string} $ui-label The name of the UI being created. * Can not included spaces or special punctuation (used in class names) * @param {color} $color Base color for the UI. * @param {string} $gradient: $toolbar-gradien Background gradient style for the UI. */; ir;[o; ;T;[o; ;[; @ ;0;"toolbar-border-color;o:Sass::Script::Funcall ; {;9[o; ; @§;" color;" color; i}o; ;[; @§;["%;"50%;i7; i};" darken; i}:@keywords{; i}o; ;[; @ ;0;"toolbar-button-color;o;: ; {;9[o; ; @·;" color;" color; i~o; ;[; @·;["%;"5%;i ; i~;" darken; i~;;{; i~o; ;T;[o:Sass::Tree::MixinNode ;[; @ ;9[o; ; {;" color;" color; io; ; @É;" gradient;" gradient; i;"background-gradient; i;;{o; ;[;i; @ ; ;!;["border-color;o; ; {;"toolbar-border-color;"toolbar_border_color; i‚; i‚o; ;T;[o;< ;[; @ ;9[o; ; {;" color;" color; i…;"color-by-background; i…;;{o;< ;[; @ ;9[o; ; {;" color;" color; i†;"bevel-by-background; i†;;{;i; @ ;([" .x-title;)o;*;+[o;,;+[o;-;+[o;2;[" x-title;/"; i„;/@ø; i„;/@ø; i„; i„o; ;T;[o; ;[;i; @ ; ;!;["border-bottom-color;o; ; {;"toolbar-border-color;"toolbar_border_color; iŠ; iŠ;i; @ ;(["&.x-docked-top;)o;*;+[o;,;+[o;-;+[o;.;/"; i‰o;2;["x-docked-top;/@ ; i‰;/@ ; i‰;/@ ; i‰; i‰o; ;T;[o; ;[;i; @ ; ;!;["border-top-color;o; ; {;"toolbar-border-color;"toolbar_border_color; iŽ; iŽ;i; @ ;(["&.x-docked-bottom;)o;*;+[o;,;+[o;-;+[o;.;/"; io;2;["x-docked-bottom;/@#; i;/@#; i;/@#; i; io; ;T;[o; ;[;i; @ ; ;!;["border-right-color;o; ; {;"toolbar-border-color;"toolbar_border_color; i’; i’;i; @ ;(["&.x-docked-left;)o;*;+[o;,;+[o;-;+[o;.;/"; i‘o;2;["x-docked-left;/@:; i‘;/@:; i‘;/@:; i‘; i‘o; ;T;[o; ;[;i; @ ; ;!;["border-left-color;o; ; {;"toolbar-border-color;"toolbar_border_color; i–; i–;i; @ ;(["&.x-docked-right;)o;*;+[o;,;+[o;-;+[o;.;/"; i•o;2;["x-docked-right;/@Q; i•;/@Q; i•;/@Q; i•; i•o; ;T;[o;< ;[; @ ;9[o; ; {;"toolbar-button-color;"toolbar_button_color; iœo; ; @[;" gradient;" gradient; iœ;"toolbar-button; iœ;;{;i; @ ;(["e.x-button, .x-field-select .x-component-outer, .x-field-select .x-component-outer:before;)o;*;+[o;,;+[o;-;+[o;2;[" x-button;/"; i›;/@n; i›o;,;+[" o;-;+[o;2;["x-field-select;/@n; i›;/@n; i›o;-;+[o;2;["x-component-outer;/@n; i›;/@n; i›o;,;+[" o;-;+[o;2;["x-field-select;/@n; i›;/@n; i›o;-;+[o;2;["x-component-outer;/@n; i›o:Sass::Selector::Pseudo ;[" before;/@n: @arg0; i›;&: class;/@n; i›;/@n; i›; i›o; ;T;[o;< ;[; @ ;9[o; ; {;" color;" color; i ;"color-by-background; i ;;{o;< ;[; @ ;9[o; ; {;" color;" color; i¡;"bevel-by-background; i¡;;{;i; @ ;([".x-form-label;)o;*;+[o;,;+[o;-;+[o;2;["x-form-label;/"; iŸ;/@«; iŸ;/@«; iŸ; iŸ;i; @ ;([".x-toolbar-o; ; {;" ui-label;" ui_label; i€; i€; @ ;9[[o;; {;" ui-label;" ui_label0[o;; @µ;" color;" color0[o;; @µ;" gradient;" gradiento; ; @µ;"toolbar-gradient;"toolbar_gradient; i{;"sencha-toolbar-ui; i{; @ ; i; "ø@import '../global'; /** * @class Ext.Toolbar */ /** * @var {color} $toolbar-base-color * The primary color variable from which toolbars derive their light and dark UIs. */ $toolbar-base-color: $base-color !default; /** * @var {measurement} $toolbar-spacing * Space between items in a toolbar (like buttons and fields) */ $toolbar-spacing: .2em !default; /** * @var {string} $toolbar-gradient * Background gradient style for toolbars. */ $toolbar-gradient: $base-gradient !default; /** * @var {boolean} $include-toolbar-uis * Optionally disable separate toolbar UIs (light and dark). */ $include-toolbar-uis: $include-default-uis !default; /** * Includes default toolbar styles. */ @mixin sencha-toolbar { .x-toolbar { padding: 0 $toolbar-spacing; overflow: hidden; position: relative; height: $global-row-height; & > * { z-index: 1; } &.x-docked-top { border-bottom: .1em solid; } &.x-docked-bottom { border-top: .1em solid; } &.x-docked-left { width: 7em; height: auto; padding: $toolbar-spacing; border-right: .1em solid; } &.x-docked-right { width: 7em; height: auto; padding: $toolbar-spacing; border-left: .1em solid; } } .x-title { line-height: $global-row-height - .5em; font-size: 1.2em; text-align: center; font-weight: bold; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin: 0 0.3em; max-width: 100%; .x-innerhtml { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding: 0 .3em; } } @if $include-toolbar-uis { @include sencha-toolbar-ui('dark', darken($toolbar-base-color, 10%)); @include sencha-toolbar-ui('light', $toolbar-base-color); @include sencha-toolbar-ui('neutral', $neutral-color); .x-toolbar.x-toolbar-neutral .x-toolbar-inner .x-button.x-button-pressing { $mask-radial-glow: lighten($base-color, 25); @include background-image(radial-gradient(fade-out($mask-radial-glow, .3), fade-out($mask-radial-glow, 1) 24px)); .x-button-icon.x-button-mask { @include background-gradient(#fff, 'recessed'); } } } .x-navigation-bar { .x-container { overflow: visible; } } } /** * Creates a theme UI for toolbars. * * // SCSS * @include sencha-toolbar-ui('sub', #58710D, 'glossy'); * * // JS * var myTb = new Ext.Toolbar({title: 'My Green Glossy Toolbar', ui: 'sub'}) * * @param {string} $ui-label The name of the UI being created. * Can not included spaces or special punctuation (used in class names) * @param {color} $color Base color for the UI. * @param {string} $gradient: $toolbar-gradien Background gradient style for the UI. */ @mixin sencha-toolbar-ui($ui-label, $color, $gradient: $toolbar-gradient) { $toolbar-border-color: darken($color, 50%); $toolbar-button-color: darken($color, 5%); .x-toolbar-#{$ui-label} { @include background-gradient($color, $gradient); border-color: $toolbar-border-color; .x-title { @include color-by-background($color); @include bevel-by-background($color); } &.x-docked-top { border-bottom-color: $toolbar-border-color; } &.x-docked-bottom { border-top-color: $toolbar-border-color; } &.x-docked-left { border-right-color: $toolbar-border-color; } &.x-docked-right { border-left-color: $toolbar-border-color; } .x-button, .x-field-select .x-component-outer, .x-field-select .x-component-outer:before { @include toolbar-button($toolbar-button-color, $gradient); } .x-form-label { @include color-by-background($color); @include bevel-by-background($color); } } }