mirror of
https://github.com/ArthurDanjou/ui.git
synced 2026-01-14 20:19:34 +01:00
docs(icon): put back component page
This commit is contained in:
@@ -278,7 +278,7 @@ const isDark = computed({
|
||||
|
||||
## Icons
|
||||
|
||||
Thanks to [`@nuxt/icon`](https://github.com/nuxt/icon), use 200,000+ ready to use icons based on [Iconify](https://iconify.design).
|
||||
Thanks to [`@nuxt/icon`](https://github.com/nuxt/icon), add 200,000+ ready to use icons to your Nuxt application based on [Iconify](https://iconify.design).
|
||||
|
||||
You can use any name from the https://icones.js.org collection such as the `i-` prefix (for example, `i-heroicons-cog`) with:
|
||||
|
||||
@@ -320,7 +320,7 @@ npm install @iconify-json/{collection_name}
|
||||
|
||||
For example, to use the `i-uil-github` icon, install it's collection with `@iconify-json/uil`. This way the icons can be served locally or from your serverless functions, which is faster and more reliable on both SSR and client-side.
|
||||
|
||||
::callout{icon="i-heroicons-cog-6-tooth" to="https://github.com/nuxt/icon?tab=readme-ov-file#custom-local-collections" target="_blank"}
|
||||
::callout{icon="i-heroicons-light-bulb" to="https://github.com/nuxt/icon?tab=readme-ov-file#custom-local-collections" target="_blank"}
|
||||
Read more about custom collections in the `@nuxt/icon` documentation.
|
||||
::
|
||||
|
||||
|
||||
@@ -1,5 +1,27 @@
|
||||
---
|
||||
description: Use 200,000+ ready to use icons from Iconify.
|
||||
to: https://github.com/nuxt/icon
|
||||
target: _blank
|
||||
description: Add 200,000+ ready to use icons to your Nuxt application, based on Iconify.
|
||||
links:
|
||||
- label: Iconify
|
||||
icon: i-simple-icons-iconify
|
||||
to: https://icones.js.org
|
||||
- label: Nuxt Icon
|
||||
icon: i-simple-icons-github
|
||||
to: https://github.com/nuxt/icon
|
||||
---
|
||||
|
||||
## Usage
|
||||
|
||||
You can use any name from the https://icones.js.org collection such as the `i-` prefix:
|
||||
|
||||
::component-card
|
||||
---
|
||||
baseProps:
|
||||
class: 'w-5 h-5'
|
||||
props:
|
||||
name: 'i-heroicons-light-bulb'
|
||||
---
|
||||
::
|
||||
|
||||
::callout{icon="i-heroicons-light-bulb"}
|
||||
It's highly recommended to install the icons collections you need, read more about this in [Theming](/getting-started/theming#icons).
|
||||
::
|
||||
|
||||
Reference in New Issue
Block a user