Open Close
Teva VIsion
Font Face
Teva Sans Latin
Drafts & Templates
PBS Templates
Primitives & components context
Teva SCS
Primitives & components: Teva SCS

Taxonomy

v0.0.0

The Taxonomy renders links by default in the dominant brand color.

Use modifier --inversed on element with class .vi-taxonomy__link to change the color.

<ul aria-label="categories" class="vi-taxonomy">
  <li class="vi-taxonomy__item">
    <a class="vi-taxonomy__link" href="#taxonomy-978a20">
      8-bit banjo
    </a>
  </li>
  <li class="vi-taxonomy__item">
    <a class="vi-taxonomy__link" href="#taxonomy-188162">
      seitan street
    </a>
  </li>
</ul>
<ul aria-label="categories" class="vi-taxonomy">
  <li class="vi-taxonomy__item">
    <a class="vi-taxonomy__link vi-taxonomy__link--inversed" href="#taxonomy-090521">
      diy post-ironic
    </a>
  </li>
  <li class="vi-taxonomy__item">
    <a class="vi-taxonomy__link vi-taxonomy__link--inversed" href="#taxonomy-cd2576">
      leggings letterpress
    </a>
  </li>
</ul>

Stylesheets #

The following stylesheet is required to display this component.

Usage documentation #

Usage documentation can be found here.

Changelog #

Changelog

Fix

  • Long tag names should wrap.

Changed

  • A11y Add aria-label="categeries" to element ul.vi-taxonomy

Added

  • PBS support
  • Initial draft