Storybook

Truncate

Shortens text with ellipsis.

Basic

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt

Custom tags

  1. organisation
  2. / department
  3. / tickets
  4. / #99 —
  5. User cannot register on the website

Delay truncate

  1. organisation
  2. / department
  3. / tickets
  4. / #99 —
  5. User cannot register on the website

Expand on hover

Note: this does not work well on small screens.

Custom max widths

Lorem ipsum dolor sit amet consectetuer

Lorem ipsum dolor sit amet consectetuer

Lorem ipsum dolor sit amet consectetuer