Font Face
Teva Sans Latin

Drafts & Templates
PBS Templates

Primitives & components context

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