@vcl/value-unit-anagram

The combination of value(s) with associated unit(s) in any permutation

Usage no npm install needed!

<script type="module">
  import vclValueUnitAnagram from 'https://cdn.skypack.dev/@vcl/value-unit-anagram';
</script>

README

VCL value-unit-anagram

The combination of value(s) with associated unit(s) in any permutation.

Features

The vclVUAnagram is similar to the icogram component; it is a wrapper for vclValue and vclUnit which can occur in arbitrary order and count. The unit can also be an icon component. The value-unit-anagram applies a small gap in form of a margin between the elements.

Usage

Basic usage.

basic example

The following examples show permutations of value and unit, varied font size for the value and the use of an icon as unit.

advanced example

Classes

  • vclVUAnagram
  • vclValue
  • vclUnit

Modifiers

Variables

  • --vu-anagram-unit-font-size
  • --vu-anagram-unit-color

Demo

example.html on GH-pages.