# Overview

Module `@angular-package/sass/var` is designed to handle CSS variables with the use of space-separated words separated by delimiter that can be translated by the dictionary.

There are available following functions.

## Functions

<table data-card-size="large" data-view="cards"><thead><tr><th></th><th></th><th></th></tr></thead><tbody><tr><td><strong><code>var.adjust()</code></strong></td><td>The function <code>var.adjust()</code> returns CSS variable <code>$var</code> adjusted by <code>$adjust</code> if not <code>null</code>, otherwise <code>$var</code>.</td><td></td></tr><tr><td><strong><code>var.css()</code></strong></td><td>The <code>var.css()</code> function returns the CSS variable of <code>$name</code>, <code>$fallback</code> value, <code>$delimiter</code>, <code>$prefix</code>, <code>$suffix</code> translated with <code>$dictionary</code>.</td><td></td></tr><tr><td><strong><code>var.get()</code></strong></td><td>The <code>var.get()</code> function returns CSS variable built from <code>$name</code>, <code>$delimiter</code>, <code>$prefix</code>, and <code>$suffix</code>.</td><td></td></tr><tr><td><strong><code>var.is()</code></strong></td><td>The <code>var.is()</code> function checks whether the given value is CSS variable <code>var()</code>.</td><td></td></tr><tr><td><p><strong><code>var.name()</code></strong></p><p>The <code>var.name()</code> function returns custom property CSS variable.</p></td><td></td><td></td></tr><tr><td><strong><code>var.negative()</code></strong></td><td>The function <code>var.negative()</code> returns CSS <code>calc()</code> function with the given <code>$var</code> multiplied by <code>-1</code>.</td><td></td></tr><tr><td><strong><code>var.unit()</code></strong></td><td>The <code>var.unit()</code> function returns <code>$var</code> multiplied by <code>$unit</code>.</td><td></td></tr></tbody></table>

## Mixins

<table data-card-size="large" data-view="cards"><thead><tr><th></th><th></th><th></th></tr></thead><tbody><tr><td><strong><code>var.set()</code></strong></td><td>The <code>var.set()</code> mixin defines the CSS variables based on the given <code>$property</code>.</td><td></td></tr></tbody></table>
