docs(lite): update README about UiIcon (#6520)

This commit is contained in:
Thierry Goettelmann 2022-11-14 10:22:07 +01:00 committed by GitHub
parent 185509a0cf
commit b0cb249ae9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -91,18 +91,21 @@ const fontSize = ref("2rem");
This project is using Font Awesome 6 Free. This project is using Font Awesome 6 Free.
Here is how to use an icon in your template. Icons can be displayed with the `UiIcon` component.
Note: `FontAwesomeIcon` is a global component that does not need to be imported. Passing `undefined` as `icon` prop will disable the component (no need to use an additional `v-if` condition).
Use the `busy` prop to display a loader icon.
```vue ```vue
<template> <template>
<div> <div>
<FontAwesomeIcon :icon="faDisplay" /> <UiIcon :icon="faDisplay" />
</div> </div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import UiIcon from "@/components/ui/UiIcon.vue"
import { faDisplay } from "@fortawesome/free-solid-svg-icons"; import { faDisplay } from "@fortawesome/free-solid-svg-icons";
</script> </script>
``` ```
@ -115,8 +118,6 @@ Here is the equivalent between font weight and style name.
| ---------- | ----------- | | ---------- | ----------- |
| Solid | 900 | | Solid | 900 |
| Regular | 400 | | Regular | 400 |
| Light | 300 |
| Thin | 100 |
### CSS ### CSS