Pascal Precht 17e9e30454 feat: introduce StatusIcon component
This introduces a new `StatusIcon` component to the component library,
including various icon assets.

The component can be used to render icons in different colors and rotations.
It's also one of the atomic components that can be used to build other
more complex components like icon buttons.

Usage:

```
StatusIcon {
    icon: "arrow-right" // name of asset file in `ui/shared/status/assets/img/icons
    width: 24 // default: 24
    height 24 // default: 24
    color: "red" // default: asset file color
    rotation: 0 // default: 0
}
```

Closes #2330
2021-04-27 14:56:09 -04:00

5 lines
805 B
XML

<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M6.25 10.5C6.66421 10.5 7 10.1642 7 9.75C7 9.33579 6.66421 9 6.25 9H6C3.79086 9 2 10.7909 2 13V18C2 20.2091 3.79086 22 6 22H11C13.2091 22 15 20.2091 15 18V17.75C15 17.3358 14.6642 17 14.25 17C13.8358 17 13.5 17.3358 13.5 17.75V18C13.5 19.3807 12.3807 20.5 11 20.5H6C4.61929 20.5 3.5 19.3807 3.5 18V13C3.5 11.6193 4.61929 10.5 6 10.5H6.25Z" fill="black"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M9 6C9 3.79086 10.7909 2 13 2H18C20.2091 2 22 3.79086 22 6V11C22 13.2091 20.2091 15 18 15H13C10.7909 15 9 13.2091 9 11V6ZM13 3.5H18C19.3807 3.5 20.5 4.61929 20.5 6V11C20.5 12.3807 19.3807 13.5 18 13.5H13C11.6193 13.5 10.5 12.3807 10.5 11V6C10.5 4.61929 11.6193 3.5 13 3.5Z" fill="black"/>
</svg>