Graphics

The graphics folder contains reusable components for rendering a variety of graphical elements.

KIcon

The KIcon component is a wrapper around Quasar's Icon that enables displaying a primary icon with an optional stacked overlay icon. This is useful for creating composite or symbolic icons by layering one icon on top of another. Moreover, and unlike Quasar's built-in QIcon, KIcon supports any valid HTML color definition.

Props

Prop	Type	Default	Description
icon	String | Object	undefined	Main icon name (as string) or an object describing the main icon and its overlay.

Usage

• An icon using a name:

<KIcon icon='las la-home' />

• And the same icon with a red slash through it:

<KIcon
  :icon="{
    name: 'las la-home',
    overlay: {
      name: 'las la-slash',
      color: 'red',
      rotation: 90
    }
  }"
/>