Var

Introduction

Sass functions to manage the var() CSS function.

Installing

npm install @unsass/var

Usage

@use "@unsass/var";

.foo {
  color: var.create("primary-color", darkcyan);
}

Result

.foo {
  color: var(--primary-color, darkcyan);
}

Functions

create-name($name)

This function will return string value with -- if missing.

@use "@unsass/var";

$name: var.create-name("primary-color"); // $name: "--primary-color";

name($var)

This function will return variable name value.

@use "@unsass/var";

$var: var(--primary-color, darkcyan);
$name: var.name($var); // $name: "--primary-color";

fallback($var)

This function will return variable fallback value.

@use "@unsass/var";

$var: var(--primary-color, darkcyan);
$fallback: var.fallback($var); // $fallback: "darkcyan";

parse($var)

This function will return a map with variable name and fallback values on dedicated keys.

@use "@unsass/var";

$var: var(--primary-color, darkcyan);
$map: var.parse($var); // $map: ("name": --primary-color, "fallback": darkcyan);