Sqrt not returning value

[ilicmarko]

Maybe the title is not so accurate but I am having a problem with sqrt function. This is the function

$red-magic-number: 241;
$green-magic-number: 691;
$blue-magic-number: 68;
$brightness-divisor: $red-magic-number + $green-magic-number + $blue-magic-number;

@function brightness($color) {
    $red-component: red($color);
    $green-component: green($color);
    $blue-component: blue($color);

    $number: sqrt((($red-component * $red-component * $red-magic-number) + ($green-component * $green-component * $green-magic-number) + ($blue-component * $blue-component * $blue-magic-number)) / $brightness-divisor);
    @return 100% * ($number / 255);
}

@function text-color($color, $light:#fff, $dark:#000) {
    @if brightness($color) < 65% {
        @return $light;
    } @else {
        @return $dark;
    }
}

Part where it fails

$number: sqrt((($red-component * $red-component * $red-magic-number) + ($green-component * $green-component * $green-magic-number) + ($blue-component * $blue-component * $blue-magic-number)) / $brightness-divisor);

@return 100% * ($number / 255);

Error:

Error: Undefined operation: "100% times sqrt(11707.92)/255".

So $number doesn't return a number but the whole function.

How should I fix this?

[sindresorhus]

This is not the place to ask general Sass questions. Try StackOverflow.

[dudeofawesome]

@ilicmarko It looks like you're trying to use jlong's SCSS brightness gist, which calls a sqrt method which isn't implemented in base SASS. You'll need to include one from either a math library or one of your own. Here's a simple one:

@function sqrt ($r) {
    $x0: 1;
    $x1: $x0;

    @for $i from 1 through 10 {
        $x1: $x0 - ($x0 * $x0 - abs($r)) / (2 * $x0);
        $x0: $x1;
    }

    @return $x1;
}

http://www.antimath.info/css/sass-sqrt-function/

Once you've implemented that, the function should behave as expected.