-
Notifications
You must be signed in to change notification settings - Fork 1
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).
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)
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)
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)
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 a number from one unit into another.
([Less functions] (http://lesscss.org/functions/#misc-functions-convert))
Compatible unit groups:
- length:
m,cm,mm,in,ptandpc, - time:
sandms, - angle:
rad,deg,gradandturn.
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)
- [Language Differences] (https://github.com/vecerek/less2sass/wiki/Less-vs.-Sass#difference-between-less-and-sass)
- [Variables] (https://github.com/vecerek/less2sass/wiki/Less-vs.-Sass#variables)
- [Data Types] (https://github.com/vecerek/less2sass/wiki/Less-vs.-Sass#data-types)
- [Extend] (https://github.com/vecerek/less2sass/wiki/Less-vs.-Sass#extend)
- [Mixins] (https://github.com/vecerek/less2sass/wiki/Less-vs.-Sass#mixins)
- [Import Directive] (https://github.com/vecerek/less2sass/wiki/Less-vs.-Sass#import-directive)
- [CSS Guards] (https://github.com/vecerek/less2sass/wiki/Less-vs.-Sass#css-guards)
- [Loops] (https://github.com/vecerek/less2sass/wiki/Less-vs.-Sass#loops)
- [Merge] (https://github.com/vecerek/less2sass/wiki/Less-vs.-Sass#merge)
- [Parent Selectors] (https://github.com/vecerek/less2sass/wiki/Less-vs.-Sass#parent-selector)
- [JavaScript Evaluation] (https://github.com/vecerek/less2sass/wiki/Less-vs.-Sass#javascript-evaluation)