From 1e7470f531d13e7f14ba68b925b83feab109b0d4 Mon Sep 17 00:00:00 2001 From: Benjamin Canac Date: Thu, 13 Jun 2024 11:29:39 +0200 Subject: [PATCH] docs: update badges --- docs/content/2.components/alert.md | 4 ++-- docs/content/2.components/carousel.md | 2 +- docs/content/2.components/divider.md | 2 +- docs/content/2.components/input-menu.md | 2 +- docs/content/2.components/input.md | 2 +- docs/content/2.components/modal.md | 4 ++-- docs/content/2.components/select-menu.md | 2 +- docs/content/2.components/slideover.md | 2 +- docs/content/2.components/tabs.md | 2 +- docs/content/2.components/textarea.md | 3 +-- docs/content/2.components/toggle.md | 2 +- 11 files changed, 13 insertions(+), 14 deletions(-) diff --git a/docs/content/2.components/alert.md b/docs/content/2.components/alert.md index 8f05441f..b88fa394 100644 --- a/docs/content/2.components/alert.md +++ b/docs/content/2.components/alert.md @@ -163,13 +163,13 @@ This can be handy when you want to display HTML content. To achieve this, you ca :component-example{component="alert-example-html"} -### `icon` :u-badge{label="New" class="align-middle ml-2 !rounded-full" variant="subtle"} +### `icon` Use the `#icon` slot to customize the displayed icon. :component-example{component="alert-example-icon"} -### `avatar` :u-badge{label="New" class="align-middle ml-2 !rounded-full" variant="subtle"} +### `avatar` Use the `#avatar` slot to customize the displayable avatar. diff --git a/docs/content/2.components/carousel.md b/docs/content/2.components/carousel.md index 395279ae..b066ad5a 100644 --- a/docs/content/2.components/carousel.md +++ b/docs/content/2.components/carousel.md @@ -98,7 +98,7 @@ The number of indicators will be automatically generated based on the number of :component-example{component="carousel-example-indicators-size"} -## Autoplay :u-badge{label="New" class="align-middle ml-2 !rounded-full" variant="subtle"} +## Autoplay You can easily implement an autoplay behavior using the exposed [API](#api) through a template ref. diff --git a/docs/content/2.components/divider.md b/docs/content/2.components/divider.md index 037f9a6b..754d6b9d 100644 --- a/docs/content/2.components/divider.md +++ b/docs/content/2.components/divider.md @@ -66,7 +66,7 @@ excludedProps: --- :: -### Size :u-badge{label="New" class="align-middle ml-2 !rounded-full" variant="subtle"} +### Size Use the `size` prop to change the size of the divider. diff --git a/docs/content/2.components/input-menu.md b/docs/content/2.components/input-menu.md index f43dd5d8..51056414 100644 --- a/docs/content/2.components/input-menu.md +++ b/docs/content/2.components/input-menu.md @@ -130,7 +130,7 @@ Pass a function to the `search` prop to customize the search behavior and filter Use the `debounce` prop to adjust the delay of the function. -Use the `searchLazy` prop to control the immediacy of data requests. :u-badge{label="New" class="!rounded-full" variant="subtle"} +Use the `searchLazy` prop to control the immediacy of data requests. ::component-example --- diff --git a/docs/content/2.components/input.md b/docs/content/2.components/input.md index 0765b6d5..4145fbb4 100644 --- a/docs/content/2.components/input.md +++ b/docs/content/2.components/input.md @@ -71,7 +71,7 @@ props: Use the `type` prop to change the input type, the default `type` is set to `text`, you can check all the available types at [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#input_types). -Some types have been implemented in their own components, such as [Checkbox](/components/checkbox), [Radio](/components/radio-group), etc. and others have been styled like `file` for example. :u-badge{label="New" class="!rounded-full" variant="subtle"} +Some types have been implemented in their own components, such as [Checkbox](/components/checkbox), [Radio](/components/radio-group), etc. and others have been styled like `file` for example. ::component-card --- diff --git a/docs/content/2.components/modal.md b/docs/content/2.components/modal.md index 2164ac96..5a54056a 100644 --- a/docs/content/2.components/modal.md +++ b/docs/content/2.components/modal.md @@ -59,7 +59,7 @@ Set the `fullscreen` prop to `true` to enable it. :component-example{component="modal-example-fullscreen"} -### Control programmatically :u-badge{label="New" class="align-middle ml-2 !rounded-full" variant="subtle"} +### Control programmatically First of all, add the `Modals` component to your app, preferably inside `app.vue`. @@ -85,7 +85,7 @@ Then, you can use the `useModal` composable to control your modals within your a :component-example{component="modal-example-component" hiddenPreview label="modal.vue" } :: -Additionally, you can close the modal within the modal component by calling `modal.close()`. +Additionally, you can close the modal within the modal component by calling `modal.close()`. ## Props diff --git a/docs/content/2.components/select-menu.md b/docs/content/2.components/select-menu.md index eb4a261f..9124a8a0 100644 --- a/docs/content/2.components/select-menu.md +++ b/docs/content/2.components/select-menu.md @@ -150,7 +150,7 @@ Pass a function to the `searchable` prop to customize the search behavior and fi Use the `debounce` prop to adjust the delay of the function. -Use the `searchableLazy` prop to control the immediacy of data requests. :u-badge{label="New" class="!rounded-full" variant="subtle"} +Use the `searchableLazy` prop to control the immediacy of data requests. ::component-example --- diff --git a/docs/content/2.components/slideover.md b/docs/content/2.components/slideover.md index f2d3f4a7..0d7660c1 100644 --- a/docs/content/2.components/slideover.md +++ b/docs/content/2.components/slideover.md @@ -53,7 +53,7 @@ defineShortcuts({ ``` -### Control programmatically :u-badge{label="New" class="align-middle ml-2 !rounded-full" variant="subtle"} +### Control programmatically First of all, add the `USlideovers` component to your app, preferably inside `app.vue`. diff --git a/docs/content/2.components/tabs.md b/docs/content/2.components/tabs.md index ac74c853..d4747765 100644 --- a/docs/content/2.components/tabs.md +++ b/docs/content/2.components/tabs.md @@ -63,7 +63,7 @@ componentProps: --- :: -You can use the `content` prop and set it to `false` to avoid the rendering of the HTML content if you don't need it. +You can use the `content` prop and set it to `false` to avoid the rendering of the HTML content if you don't need it. :u-badge{label="New" class="!rounded-full" variant="subtle"} ### Control the selected index diff --git a/docs/content/2.components/textarea.md b/docs/content/2.components/textarea.md index eac54ab9..72724460 100644 --- a/docs/content/2.components/textarea.md +++ b/docs/content/2.components/textarea.md @@ -119,8 +119,7 @@ props: --- :: -Use the `maxrows` prop to set a maximum number of rows when autoresizing. If set to `0`, the Textarea will infinitely grow up. :u-badge{label="New" class="!rounded-full" variant="subtle"} - +Use the `maxrows` prop to set a maximum number of rows when autoresizing. If set to `0`, the Textarea will infinitely grow up. ::component-card --- baseProps: diff --git a/docs/content/2.components/toggle.md b/docs/content/2.components/toggle.md index f303df33..434d9e88 100644 --- a/docs/content/2.components/toggle.md +++ b/docs/content/2.components/toggle.md @@ -52,7 +52,7 @@ excludedProps: --- :: -### Loading :u-badge{label="New" class="align-middle ml-2 !rounded-full" variant="subtle"} +### Loading Use the `loading` prop to show a loading icon and disable the Toggle.