From 25d5d07dd342dc57831785032b813b3c2b3a5a9e Mon Sep 17 00:00:00 2001 From: Sean Corrales Date: Thu, 8 Oct 2015 15:37:54 -0500 Subject: Updating function instructions. --- sass.html.markdown | 19 ++++++++++--------- 1 file changed, 10 insertions(+), 9 deletions(-) diff --git a/sass.html.markdown b/sass.html.markdown index d1e0721f..9bc72478 100644 --- a/sass.html.markdown +++ b/sass.html.markdown @@ -188,7 +188,8 @@ body.noLinks a { #################### */ /* Sass provides functions that can be used to accomplish a variety of tasks. Consider the following */ - + +/* Functions can be invoked by using their name and passing in the required arguments */ body { width: round(10.25px); } @@ -207,19 +208,19 @@ body { background-color: rgba(0, 0, 0, 0.75); } -/* You may also define your own functions. Functions are very similar to mixins. When trying to choose between - a function or a mixin, remember that functions are best for returning values while mixins are best for - generating CSS while functions are better for logic that might be used throughout your Sass code. The - examples in the Math Operators' section are ideal candidates for becoming a reusable function. */ - -/* This function will take a target size and the parent size and calculate and return the percentage */ +/* You may also define your own functions. Functions are very similar to mixins. When trying + to choose between a function or a mixin, remember that functions are best for returning + values while mixins are best for generating CSS while functions are better for logic that + might be used throughout your Sass code. The examples in the Math Operators' section are + ideal candidates for becoming a reusable function. */ + +/* This function will take a target size and the parent size and calculate and return + the percentage */ @function calculate-percentage($target-size, $parent-size) { @return $target-size / $parent-size * 100%; } -/* Functions can be invoked by using their name and passing in the required arguments */ - $main-content: calculate-percentage(600px, 960px); .main-content { -- cgit v1.2.3