I've recently decided I want to have some default actions that run when my SASS is compiled and found this stack overflow question which helped me write a function to do it (Use variable defined in config.rb in scss files)
The colour value gets pulled through fine and is treated like a SASS color object (i.e. if I pass '#ff0000' into the function it comes out as 'red' which is fine) but it doesn't work in the tint() and shade() functions.
The error I get is
(Line 137: "#ff1122" is not a color for 'shade')
But if I comment out all of the instances of tint() and shade() then it works perfectly.
Here's all the code that's being used:
config.rb (taken from the stack overflow link up there mentioned before)
sass_options = {:custom => { :custom_colors => {"main" => "#ff1122"} } }
module Sass::Script::Functions
def custom_color(value)
rgb = options[:custom][:custom_colors][value.to_s].scan(/^#?(..?)(..?)(..?)$/).first.map {|a| a.ljust(2, a).to_i(16)}
Sass::Script::Color.new(rgb)
end
end
style.scss (line 5)
$col_primary : #{custom_color(main)};
style.scss (line 137 that was mentioned in the error)
@include background-with-css2-fallback(linear-gradient(-45deg, transparent 51%, shade($col_primary, 10) 50%, $col_primary 75%, $col_primary 0%));
I can't see a reason that this wouldn't work as it works as a colour elsewhere.
I can give more info if needed