3.1.1 (Brainy Betty) 37ada852e718d4fcfd545517766d5308c36d2c04 o:Sass::Tree::RootNode : @linei:@template"9/* Variables ---------------------------------------- */ // So we can determine if the base font size has been set $stitch-base-font-size:16px; /* Functions ---------------------------------------- */ @function relative-unit($size,$context:$stitch-base-font-size,$unit:em) { @return #{$size/$context}$unit; } /* Mixins ---------------------------------------- */ // Call this first @mixin set-base-font-size($size,$rem:true) { $stitch-base-font-size:$size; @if $rem == true { html { font-size:$size; } } } @mixin base-font-size { font-size:$stitch-base-font-size; } @mixin relative-font-size($size,$context:$stitch-base-font-size,$root:false) { // We don't want it relative to the root @if $root == false { font-size:relative-unit($size,$context,em); } // We want it in rems @else { // For legacy browsers font-size:$size; // For rem-capable browsers font-size:relative-unit($size,$stitch-base-font-size,rem); } } /* Example ---------------------------------------- */ // Make sure I set the base font size, otherwise it will use the default 16px // This adds the font size to the html element for rem font sizing // I can turn this off by setting the variable $rem:false @include set-base-font-size(20px); #id { /* Relative to a given context - 18px */ @include relative-font-size(16px,18px); /* Relative to the root font size (rem) */ @include relative-font-size(10px,$root:true); } // If I wanted to work with font sizes within a module... #id2 { /* Set a base font size */ $size:16px; font-size:$size; p { /* (12px) Relative to the font size for this module */ @include relative-font-size(12px,$size); } p { /* (10px) Or make it relative to the root using rems */ @include relative-font-size(10px,$root:true); } } // We can also do dimensions #id { width:relative-unit(500px); }: @options{: importero: Sass::Importers::Filesystem: @root".:@has_childrenT:@children[o:Sass::Tree::CommentNode ;i: @silent0;@; [: @lines[: @loud0: @value"=/* Variables ---------------------------------------- */o; ;i;i;@; [;[;0;"A/* So we can determine if the base font size has been set */o:Sass::Tree::VariableNode ;i : @name"stitch-base-font-size: @guarded0: @expro:Sass::Script::Number ;i :@denominator_units[:@numerator_units["px;{:@original" 16px;i;@; [o; ;i ;0;@; [;[;0;"=/* Functions ---------------------------------------- */o:Sass::Tree::FunctionNode ;i : @args[[o:Sass::Script::Variable;" size;{:@underscored_name" size0[o;;" context;@%;" contexto; ;i ;"stitch-base-font-size;@%;"stitch_base_font_size[o;;" unit;@%;" unito:Sass::Script::String ;i ;@%: @type:identifier;"em;"relative-unit;@; T; [o:Sass::Tree::ReturnNode ;i;o: Sass::Script::Interpolation ;i:@whitespace_beforei: @aftero; ;i;" unit;{;" unit:@originally_textF: @mido:Sass::Script::Operation ;i:@operand2o; ;i;" context;@:;" context:@operator:div:@operand1o; ;i;" size;@:;" size;@:;@::@whitespace_after0: @before0;@; [o; ;i;0;@; [;[;0;":/* Mixins ---------------------------------------- */o; ;i;i;@; [;[;0;"/* Call this first */o:Sass::Tree::MixinDefNode ;i;[[o;;" size;{;" size0[o;;"rem;@Q;"remo:Sass::Script::Bool;i;@Q;T;"set-base-font-size;@; T; [o; ;i;"stitch-base-font-size;0;o; ;i;" size;{;" size;@; [u:Sass::Tree::IfNodeŽ[o:Sass::Script::Operation : @linei:@operand2o:Sass::Script::Bool;i: @options{: @valueT:@operator:eq:@operand1o:Sass::Script::Variable ;i: @name"rem; @:@underscored_name"rem; @0[o:Sass::Tree::RuleNode ;i:@parsed_ruleso:"Sass::Selector::CommaSequence;i:@filename": @members[o:Sass::Selector::Sequence;[o:#Sass::Selector::SimpleSequence;i;@;[o:Sass::Selector::Element ;i;[" html:@namespace0;@; {: importero: Sass::Importers::Filesystem: @root".:@has_childrenT:@children[o:Sass::Tree::PropNode ;i;["font-size:@prop_syntax:new; @;[: @tabsi; o; ;i;" size; {;" size;"i: @rule[" htmlo;/ ;i;[;"base-font-size;@; T; [o:Sass::Tree::PropNode ;i;["font-size:@prop_syntax:new;@; [: @tabsi;o; ;i;"stitch-base-font-size;{;"stitch_base_font_sizeo;/ ;i";[[o;;" size;{;" size0[o;;" context;@s;" contexto; ;i";"stitch-base-font-size;@s;"stitch_base_font_size[o;;" root;@s;" rooto;0;i";@s;F;"relative-font-size;@; T; [o; ;i$;i;@; [;[;0;"0/* We don't want it relative to the root */u;1Á[o:Sass::Script::Operation : @linei%:@operand2o:Sass::Script::Bool;i%: @options{: @valueF:@operator:eq:@operand1o:Sass::Script::Variable ;i%: @name" root; @:@underscored_name" root; @u:Sass::Tree::IfNode“[00[ o:Sass::Tree::CommentNode : @linei+: @silenti: @options{: importero: Sass::Importers::Filesystem: @root".:@children[: @lines[: @loud0: @value"/* For legacy browsers */o:Sass::Tree::PropNode ;i,: @name["font-size:@prop_syntax:new;@; [: @tabsi;o:Sass::Script::Variable ;i,;" size;{:@underscored_name" sizeo; ;i-;i;@; [; [;0;"#/* For rem-capable browsers */o; ;i.;["font-size;;;@; [;i;o:Sass::Script::Funcall ;i.: @args[o; ;i.;" size;{;" sizeo; ;i.;"stitch-base-font-size;@";"stitch_base_font_sizeo:Sass::Script::String ;i.;@": @type:identifier;"rem;"relative-unit;@":@keywords{[o:Sass::Tree::PropNode ;i&;["font-size:@prop_syntax:new; {: importero: Sass::Importers::Filesystem: @root".:@children[: @tabsi; o:Sass::Script::Funcall ;i&: @args[o; ;i&;" size; {;" sizeo; ;i&;" context; @;" contexto:Sass::Script::String ;i&; @: @type:identifier; "em;"relative-unit; @:@keywords{o; ;i3;0;@; [;[;0;";/* Example ---------------------------------------- */o; ;i6;i;@; [;[;0;"Í/* Make sure I set the base font size, otherwise it will use the default 16px * This adds the font size to the html element for rem font sizing * I can turn this off by setting the variable $rem:false */o:Sass::Tree::MixinNode ;i9;[o; ;i9;[;["px;{;" 20px;i;"set-base-font-size;@; [:@keywords{o:Sass::Tree::RuleNode ;i;:@parsed_ruleso:"Sass::Selector::CommaSequence;i;:@filename": @members[o:Sass::Selector::Sequence;<[o:#Sass::Selector::SimpleSequence;i;;;@˜;<[o:Sass::Selector::Id;i;;["id;;@˜;@; T; [ o; ;i<;0;@; [;[;0;"-/* Relative to a given context - 18px */o;6 ;i=;[o; ;i=;[;["px;{;" 16px;io; ;i=;[;["px;@¬;" 18px;i;"relative-font-size;@; [;7{o; ;i?;0;@; [;[;0;"//* Relative to the root font size (rem) */o;6 ;i@;[o; ;i@;[;["px;{;" 10px;i;"relative-font-size;@; [;7{" rooto;0;i@;@À;T;5i: @rule["#ido; ;iC;i;@; [;[;0;"A/* If I wanted to work with font sizes within a module... */o;8 ;iD;9o;:;iD;;";<[o;=;<[o;>;iD;;@Ï;<[o;?;iD;["id2;;@Ï;@; T; [ o; ;iE;0;@; [;[;0;"/* Set a base font size */o; ;iF;" size;0;o; ;iF;[;["px;{;" 16px;i;@; [o;2 ;iG;["font-size;3;4;@; [;5i;o; ;iG;" size;{;" sizeo;8 ;iI;9o;:;iI;;";<[o;=;<[o;>;iI;;@ð;<[o:Sass::Selector::Element ;iI;["p:@namespace0;;@ð;@; T; [o; ;iJ;0;@; [;[;0;";/* (12px) Relative to the font size for this module */o;6 ;iK;[o; ;iK;[;["px;{;" 12px;io; ;iK;" size;@;" size;"relative-font-size;@; [;7{;5i;@["po;8 ;iN;9o;:;iN;;";<[o;=;<[o;>;iN;;@;<[o;A ;iN;["p;B0;;@;@; T; [o; ;iO;0;@; [;[;0;";iU;;@5;<[o;?;iU;["id;;@5;@; T; [o;2 ;iV;[" width;3;4;@; [;5i;o:Sass::Script::Funcall ;iV;[o; ;iV;[;["px;{;" 500px;iô;"relative-unit;@I;7{;5i;@["#id