{: versionI"3.2.19 (Media Mark):EF:shaI"-ec65f803dcc78a0e06d27d2696c4022597c33d61;F: contents"ÑPo:Sass::Tree::RootNode :@children['o:Sass::Tree::CommentNode : @value[I"#/* * Dropdown Variables * */:ET: @type: silent;[: @linei: @options{o:Sass::Tree::VariableNode : @nameI" include-html-button-classes; T: @expro:Sass::Script::Variable ;I"include-html-classes; T:@underscored_nameI"include_html_classes; T; @ ; i : @guardedI" !default; T;[; i ; @ o; ;[I"/* We use this to set the border styles for dropdowns. */; T; ; ;[; i; @ o; ;I"f-dropdown-border-style; T;o; ;I" solid; T; ;; i; @ ;I" !default; T;[; i; @ o; ;I"f-dropdown-border-width; T;o; ;i;[I"px; T;[; i;I"1px; F; @ ;I" !default; T;[; i; @ o; ;I"f-dropdown-border-color; T;o:Sass::Script::Funcall ;I" darken; T: @args[o; ;0;{ ;i˙;i˙;i˙;i; i; @ o; ;i;[I"%; T;[; i;I"20%; F; @ :@keywords{: @splat0; i; @ ;I" !default; T;[; i; @ o; ;[I"2/* We use these to style the triangle pip. */; T; ; ;[; i; @ o; ;I"f-dropdown-triangle-size; T;o; ;i ;[I"px; T;[; i;I"6px; F; @ ;I" !default; T;[; i; @ o; ;I"f-dropdown-triangle-color; T;o; ;0;{ ;i˙;i˙;i˙;i; i; @ ;I" !default; T;[; i; @ o; ;I"$f-dropdown-triangle-side-offset; T;o; ;i;[I"px; T;[; i;I" 10px; F; @ ;I" !default; T;[; i; @ o; ;[I"@/* We use these to control styles for the list elements. */; T; ; ;[; i; @ o; ;I"f-dropdown-list-style; T;o; ;I" none; T; ;; i; @ ;I" !default; T;[; i; @ o; ;I"f-dropdown-font-color; T;o; ;0;{ ;iZ;iZ;iZ;i; i ; @ ;I" !default; T;[; i ; @ o; ;I"f-dropdown-font-size; T;o; ;I" em-calc; T;![o; ;i;[;[; i!;I"14; F; @ ;"{;#0; i!; @ ;I" !default; T;[; i!; @ o; ;I"f-dropdown-list-padding; T;o; ;I" em-calc; T;![o; ;i ;[;@; i";I"5; F; @ o; ;i;[;@; i";I"10; F; @ ;"{;#0; i"; @ ;I" !default; T;[; i"; @ o; ;I"f-dropdown-line-height; T;o; ;I" em-calc; T;![o; ;i;[;@; i#;I"18; F; @ ;"{;#0; i#; @ ;I" !default; T;[; i#; @ o; ;I"f-dropdown-list-hover-bg; T;o; ;0;{ ;iî;iî;iî;i; i$; @ ;I" !default; T;[; i$; @ o; ;I""dropdown-mobile-default-float; T;o; ;i;[;@; i%;I"0; F; @ ;I" !default; T;[; i%; @ o; ;[I"V/* We use this to control the styles for when the dropdown has custom content. */; T; ; ;[; i'; @ o; ;I"f-dropdown-content-padding; T;o; ;I" em-calc; T;![o; ;i;[;@; i(;I"20; F; @ ;"{;#0; i(; @ ;I" !default; T;[; i(; @ o; ;[I" /* * Dropdown Mixins * */; T; ; ;[; i*; @ o; ;[I"/* NOTE: Make default max-width change between list and content types. Can add more width with classes, maybe .small, .medium, .large, etc.; */; T; ; ;[; i.; @ o; ;[I"?/* We use this to style the dropdown container element. */; T; ; ;[; i0; @ o:Sass::Tree::MixinDefNode ;I"dropdown-container; T;![[o;;I" content; T;I" content; T; @ o; ;I" list; T; ;; i1; @ [o;;I" triangle; T;I" triangle; T; @ o:Sass::Script::Bool;T; i1; @ [o;;I"max-width; T;I"max_width; T; @ o; ;I"f-dropdown-max-width; T;I"f_dropdown_max_width; T; @ ; i1;#0;[o:Sass::Tree::PropNode ;[I" position; T;o;;I" absolute; T; ;; @ : @tabsi:@prop_syntax:new;[; i2; @ o;& ;[I"top; T;o;;I" -9999px; T; ;; @ ;'i;(;);[; i3; @ o;& ;[I"list-style; T;o; ;I"f-dropdown-list-style; T;I"f_dropdown_list_style; T; @ ; i4;'i;(;);[; i4; @ o;& ;[I" margin-; To; ;I"default-float; T;I"default_float; T; @ ; i5;o;;I"0; T; ;; @ ;'i;(;);[; i5; @ o:Sass::Tree::RuleNode : @rule[I"> *:first-child; T;'i:@parsed_ruleso:"Sass::Selector::CommaSequence: @members[o:Sass::Selector::Sequence;.[I">; To:#Sass::Selector::SimpleSequence ;.[o:Sass::Selector::Universal:@namespace0; i7:@filenameI"; To:Sass::Selector::Pseudo :@syntactic_type: class;[I"first-child; T: @arg0; i7;3@: @subject0: @sourceso:Set: @hash{; i7;3@; i7;3@;[o;& ;[I"margin-top; T;o;;I"0; T; ;; @ ;'i;(;);[; i7; @ ; i7:@has_childrenT; @ o;* ;+[I"> *:last-child; T;'i;,o;-;.[o;/;.[I">; To;0 ;.[o;1;20; i8;3I"; To;4 ;5;6;[I"last-child; T;70; i8;3@*;80;9o;:;;{; i8;3@*; i8;3@*;[o;& ;[I"margin-bottom; T;o;;I"0; T; ;; @ ;'i;(;);[; i8; @ ; i8;;i;;;[; i>; @ o; ;[I" border; T;o:Sass::Script::List ;[o; ;I"f-dropdown-border-style; T; I"f_dropdown_border_style; T; @ ; i?o; ;I"f-dropdown-border-width; T; I"f_dropdown_border_width; T; @ ; i?o; ;I"f-dropdown-border-color; T; I"f_dropdown_border_color; T; @ ; i?:@separator: space; i?; @ ;i;;;[; i?; @ o; ;[I"font-size; T;o; ;I" em-base; T; I" em_base; T; @ ; i@;i;;;[; i@; @ o; ;[I" z-index; T;o;;I"99; T;;; @ ;i;;;[; iA; @ u;=â [o:Sass::Script::Variable : @nameI" triangle:ET:@underscored_nameI" triangle;T: @options{: @lineiN0[ o:Sass::Tree::PropNode ;[I"margin-top;T: @valueo; ;I"f-dropdown-margin-top;T;I"f_dropdown_margin_top;T; @ ; iO: @tabsi:@prop_syntax:new:@children[; iO; @ o:Sass::Tree::RuleNode : @rule[I" &:before;T; i:@parsed_ruleso:"Sass::Selector::CommaSequence: @members[o:Sass::Selector::Sequence;[o:#Sass::Selector::SimpleSequence ;[o:Sass::Selector::Parent; iQ:@filenameI";To:Sass::Selector::Pseudo :@syntactic_type: class;[I" before;T: @arg0; iQ;@: @subject0: @sourceso:Set: @hash{; iQ;@; iQ;@;[ o:Sass::Tree::MixinNode ;I"css-triangle;T: @args[o; ;I"f-dropdown-triangle-size;T;I"f_dropdown_triangle_size;T; @ ; iRo; ;I"f-dropdown-triangle-color;T;I"f_dropdown_triangle_color;T; @ ; iRo:Sass::Script::String ; I" bottom;T: @type:identifier; iR; @ :@keywords{: @splat0;[; iR; @ o; ;[I" position;T; o;$; I" absolute;T;%;&; @ ; i;;;[; iS; @ o; ;[I"top;T; o:!Sass::Script::UnaryOperation : @operando:Sass::Script::Operation :@operand1o; ;I"f-dropdown-triangle-size;T;I"f_dropdown_triangle_size;T; @ ; iT:@operand2o:Sass::Script::Number ; i:@numerator_units[:@denominator_units[; iT:@originalI"2;F; @ :@operator: times; iT; @ ;2: minus; iT; @ ; i;;;[; iT; @ o; ;[o; ;I"default-float;T;I"default_float;T; @ ; iU; o; ;I"$f-dropdown-triangle-side-offset;T;I"$f_dropdown_triangle_side_offset;T; @ ; iU; i;;;[; iU; @ o; ;[I" z-index;T; o;$; I"99;T;%;&; @ ; i;;;[; iV; @ ; iQ:@has_childrenT; @ o; ;[I" &:after;T; i;o;;[o;;[o; ;[o;; iX;I";To; ;;;[I" after;T;0; iX;@\;0;o; ;!{; iX;@\; iX;@\;[ o;" ;I"css-triangle;T;#[o;+ ;,o; ;I"f-dropdown-triangle-size;T;I"f_dropdown_triangle_size;T; @ ; iY;-o;. ; i;/[;0@@; iY;1I"1;F; @ ;2: plus; iY; @ o; ;I"f-dropdown-border-color;T;I"f_dropdown_border_color;T; @ ; iYo;$ ; I" bottom;T;%;&; iY; @ ;'{;(0;[; iY; @ o; ;[I" position;T; o;$; I" absolute;T;%;&; @ ; i;;;[; iZ; @ o; ;[I"top;T; o;) ;*o;+ ;,o;+ ;,o; ;I"f-dropdown-triangle-size;T;I"f_dropdown_triangle_size;T; @ ; i[;-o;. ; i;/[;0@@; i[;1I"1;F; @ ;2;6; i[; @ ;-o;. ; i;/[;0@@; i[; @ ;2;3; i[; @ ;2;4; i[; @ ; i;;;[; i[; @ o; ;[o; ;I"default-float;T;I"default_float;T; @ ; i\; o;+ ;,o; ;I"$f-dropdown-triangle-side-offset;T;I"$f_dropdown_triangle_side_offset;T; @ ; i\;-o;. ; i;/[;0@@; i\;1I"1;F; @ ;2;4; i\; @ ; i;;;[; i\; @ o; ;[I" z-index;T; o;$; I"98;T;%;&; @ ; i;;;[; i]; @ ; iX;5T; @ o; ;[I"&.right:before;T; i;o;;[o;;[o; ;[o;; i`;I";To:Sass::Selector::Class;[I" right;T; i`;@Ħo; ;;;[I" before;T;0; i`;@Ħ;0;o; ;!{; i`;@Ħ; i`;@Ħ;[o; ;[I" left;T; o;$; I" auto;T;%;&; @ ; i;;;[; ia; @ o; ;[I" right;T; o; ;I"$f-dropdown-triangle-side-offset;T;I"$f_dropdown_triangle_side_offset;T; @ ; ib; i;;;[; ib; @ ; i`;5T; @ o; ;[I"&.right:after;T; i;o;;[o;;[o; ;[o;; id;I";To;7;[I" right;T; id;@Âo; ;;;[I" after;T;0; id;@Â;0;o; ;!{; id;@Â; id;@Â;[o; ;[I" left;T; o;$; I" auto;T;%;&; @ ; i;;;[; ie; @ o; ;[I" right;T; o;+ ;,o; ;I"$f-dropdown-triangle-side-offset;T;I"$f_dropdown_triangle_side_offset;T; @ ; if;-o;. ; i;/[;0@@; if;1I"1;F; @ ;2;4; if; @ ; i;;;[; if; @ ; id;5T; @ u;= [o:Sass::Script::Variable : @nameI"max-width:ET:@underscored_nameI"max_width;T: @options{: @lineiju:Sass::Tree::IfNodeí[00[o:Sass::Tree::PropNode : @name[I"max-width:ET: @valueo:Sass::Script::Variable ;I"f-dropdown-max-width;T:@underscored_nameI"f_dropdown_max_width;T: @options{: @lineik: @tabsi:@prop_syntax:new:@children[; ik; @ [o:Sass::Tree::PropNode ;[I"max-width;T: @valueo; ;I"max-width;T;I"max_width;T; @ ; ij: @tabsi:@prop_syntax:new:@children[; ij; @ ; i1;; ix;3@go;4 ;5;6;[I" focus; T;70; ix;3@g;80;9o;:;;{; ix;3@g; ix;3@g;[o;& ;[I"background; T;o; ;I"f-dropdown-list-hover-bg; T;I"f_dropdown_list_hover_bg; T; @ ; ix;'i;(;);[; ix; @ ; ix; *:first-child { margin-top: 0; } > *:last-child { margin-bottom: 0; } @if $content == list { width: 100%; max-height: $f-dropdown-max-height; height: $f-dropdown-height; background: $f-dropdown-bg; border: $f-dropdown-border-style $f-dropdown-border-width $f-dropdown-border-color; font-size: $em-base; z-index: 99; } @else if $content == content { padding: $f-dropdown-content-padding; width: 100%; height: $f-dropdown-height; max-height: $f-dropdown-max-height; background: $f-dropdown-bg; border: $f-dropdown-border-style $f-dropdown-border-width $f-dropdown-border-color; font-size: $em-base; z-index: 99; } @if $triangle { margin-top: $f-dropdown-margin-top; &:before { @include css-triangle($f-dropdown-triangle-size, $f-dropdown-triangle-color, bottom); position: absolute; top: -($f-dropdown-triangle-size * 2); #{$default-float}: $f-dropdown-triangle-side-offset; z-index: 99; } &:after { @include css-triangle($f-dropdown-triangle-size + 1, $f-dropdown-border-color, bottom); position: absolute; top: -(($f-dropdown-triangle-size + 1) * 2); #{$default-float}: $f-dropdown-triangle-side-offset - 1; z-index: 98; } &.right:before { left: auto; right: $f-dropdown-triangle-side-offset; } &.right:after { left: auto; right: $f-dropdown-triangle-side-offset - 1; } } @if $max-width { max-width: $max-width; } @else { max-width: $f-dropdown-max-width; } } // We use this to style the list elements or content inside the dropdown. @mixin dropdown-style { font-size: $f-dropdown-font-size; cursor: $cursor-pointer-value; line-height: $f-dropdown-line-height; margin: 0; &:hover, &:focus { background: $f-dropdown-list-hover-bg; } a { display: block; padding: $f-dropdown-list-padding; color: $f-dropdown-font-color; } } @if $include-html-button-classes != false { @media only screen and (max-width: 767px) { .f-dropdown { max-width: 100%; #{$default-float}: $dropdown-mobile-default-float; } } /* Foundation Dropdowns */ .f-dropdown { @include dropdown-container(list); // max-width: none; li { @include dropdown-style; } // You can also put custom content in these dropdowns &.content { @include dropdown-container(content, $triangle:false); } // Sizes &.tiny { max-width: 200px; } &.small { max-width: 300px; } &.medium { max-width: 500px; } &.large { max-width: 800px; } } } ; T; i;