Skip to content
Attila Večerek edited this page May 22, 2016 · 1 revision

Embedded functions

There might be functions in Less, that can't be replicated in Sass with its native built-in functions. In these situations, it will be necessary to use [helper functions] (http://compass-style.org/reference/compass/helpers/) from Compass (it means an additional dependency to the project), implement a [regular function] (http://sass-lang.com/documentation/file.SASS_REFERENCE.html#function_directives) or a [custom Sass function] (http://sass-lang.com/documentation/Sass/Script/Functions.html#adding_custom_functions).

Misc functions

color

Parses a color, so a string representing a color becomes a color. ([Less functions] (http://lesscss.org/functions/#misc-functions-color))

It can be replaced by Sass's unquote() function, as it only unquotes the string, that is a valid color. Only difference is that it checks for the validity. If the passed string is not a valid color, an error is thrown at compiling. Question is, whether the converter should also throw an error, or it is the user's competence to check it in advance.
Example: [Less] (https://github.com/vecerek/less2sass/blob/master/doc/examples/less/14_functions/01_misc_functions/color.less) - [Sass] (https://github.com/vecerek/less2sass/blob/master/doc/examples/sass/14_functions/01_misc_functions/color.scss)

image-size

Gets the image dimensions from a file.
([Less functions] (http://lesscss.org/functions/#misc-functions-image-size))

The Less' image functions are a clear example of the situation, where the Compass' [helper functions] (http://compass-style.org/reference/compass/helpers/image-dimensions/) come in handy. Compass has functions like image-width() and image-height() that can be used to replicate this Less function.
Example: [Less] (https://github.com/vecerek/less2sass/blob/master/doc/examples/less/14_functions/01_misc_functions/image-size.less) - [Sass] (https://github.com/vecerek/less2sass/blob/master/doc/examples/sass/14_functions/01_misc_functions/image-size.scss)

image-width

Gets the image width from a file.
([Less functions] (http://lesscss.org/functions/#misc-functions-image-width))

See solution above.
Example: [Less] (https://github.com/vecerek/less2sass/blob/master/doc/examples/less/14_functions/01_misc_functions/image-width.less) - [Sass] (https://github.com/vecerek/less2sass/blob/master/doc/examples/sass/14_functions/01_misc_functions/image-width.scss)

image-height

Gets the image height from a file.
([Less functions] (http://lesscss.org/functions/#misc-functions-image-height))

See solution above.
Example: [Less] (https://github.com/vecerek/less2sass/blob/master/doc/examples/less/14_functions/01_misc_functions/image-height.less) - [Sass] (https://github.com/vecerek/less2sass/blob/master/doc/examples/sass/14_functions/01_misc_functions/image-height.scss)

convert

Convert a number from one unit into another.
([Less functions] (http://lesscss.org/functions/#misc-functions-convert))

Compatible unit groups:

  • length: m, cm, mm, in, pt and pc,
  • time: s and ms,
  • angle: rad, deg, grad and turn.

SOLUTION: It is possible to implement a regular Sass function using the available tools of the language to replicate the strict unit conversion in Less. However, the implementation of a custom Sass function should be taken into consideration, as it would be much more effective.
Example: [Less] (https://github.com/vecerek/less2sass/blob/master/doc/examples/less/14_functions/01_misc_functions/convert.less) - [Sass] (https://github.com/vecerek/less2sass/blob/master/doc/examples/sass/14_functions/01_misc_functions/convert.scss)