////////////////////////////// // Compass Extension Imports ////////////////////////////// ////////////////////////////// // Tint and Shade ////////////////////////////// @function tint($colour, $amount) { @return mix(toolkit-get('tint color'), $colour, $amount); } @function shade($colour, $amount) { @return mix(toolkit-get('shade color'), $colour, $amount); } ////////////////////////////// // Color Stacks ////////////////////////////// @function color-stack($main, $secondary, $amounts...) { @if length($amounts) == 0 { $amounts: toolkit-get('color stack amounts'); } @else if length($amounts) == 1 { $amounts: nth($amounts, 1); } $stack: $main; @each $amount in $amounts { $stack: join($stack, mix($secondary, nth($stack, 1), $amount)); } @return $stack; } // Tint Stack @function tint-stack($color, $amounts...) { @if length($amounts) > 0 { @return color-stack($color, toolkit-get('tint color'), $amounts); } @else { @return color-stack($color, toolkit-get('tint color')); } } // Shade Stack @function shade-stack($color, $amounts...) { @if length($amounts) > 0 { @return color-stack($color, toolkit-get('shade color'), $amounts); } @else { @return color-stack($color, toolkit-get('shade color')); } } ////////////////////////////// // Color Scales ////////////////////////////// @function color-scale($main, $secondary, $shades: null) { $shades: if($shades != null, $shades, toolkit-get('color scale shades')); $list: $main; $red1: red($main); $red2: red($secondary); $red-diff: (($red1 - $red2) / (($shades - 1))); $grn1: green($main); $grn2: green($secondary); $grn-diff: (($grn1 - $grn2) / (($shades - 1))); $blu1: blue($main); $blu2: blue($secondary); $blu-diff: (($blu1 - $blu2) / (($shades - 1))); $red-hold: $red1; $grn-hold: $grn1; $blu-hold: $blu1; @for $i from 2 through $shades { $red-hold: $red-hold - ($red-diff); $grn-hold: $grn-hold - ($grn-diff); $blu-hold: $blu-hold - ($blu-diff); $color-hold: rgb($red-hold, $grn-hold, $blu-hold); $list: append($list, $color-hold); } @return $list; }