Skip to content
This repository was archived by the owner on Mar 27, 2025. It is now read-only.

Commit 8bfc83d

Browse files
authored
Merge pull request bootstrap-vue-next#1454 from VividLemon/main
docs: grammar
2 parents a0c5939 + 2066afb commit 8bfc83d

File tree

1 file changed

+9
-9
lines changed

1 file changed

+9
-9
lines changed

apps/docs/src/docs/components/toast.md

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -10,11 +10,11 @@
1010

1111
<div class="lead mb-5">
1212

13-
Push notifications to your visitors with `BToast` and `BToaster`. These are lightweight components which are generally easily customizable for generating alert messages
13+
Push notifications to your visitors with `BToast` and `BToaster`. These are lightweight components that are generally easily customizable for generating alert messages
1414

1515
</div>
1616

17-
Toasts are lightweight notifications designed to mimic the push notifications that have been popularized by mobile and desktop operating systems. Toasts are intended to be small interruptions to your visitors or users, and therefore should contain minimal, to-the-point, non-interactive content. Please refer to the Accessibility tips section below for important usage information
17+
Toasts are lightweight notifications designed to mimic the push notifications that have been popularized by mobile and desktop operating systems. Toasts are intended to be small interruptions to your visitors or users and therefore should contain minimal, to-the-point, non-interactive content. Please refer to the Accessibility Tips section below for important usage information
1818

1919
## Overview
2020

@@ -53,12 +53,12 @@ const {show} = useToast()
5353

5454
### String
5555

56-
There are two acceptable options for the `show` function. The first set of options are a `string` followed by an `object`. The string corresponds to the body of the `Toast`. If only the string is passed, a simple `Toast` is made, and by default it is made at the `top-right` and it will expire in `5000` ms. You can pass in an optional `object` for the second parameter where you have a list of options, such as `pos`, `value`, `variant`, etc. Many of the values correspond to props for the `BToast` component. However, some props are taken out as they are reserved
56+
There are two acceptable options for the `show` function. The first set of options is a `string` followed by an `object`. The string corresponds to the body of the `Toast`. If only the string is passed, a simple `Toast` is made, and by default, it is made at the `top-right` and it will expire in `5000` ms. You can pass in an optional `object` for the second parameter where you have a list of options, such as `pos`, `value`, `variant`, etc. Many of the values correspond to props for the `BToast` component. However, some props are taken out as they are reserved
5757

5858
<HighlightCard>
5959
<BButton
6060
@click="
61-
show('Bar (this Toast will not auto expire)', {
61+
show('Bar (this Toast will not auto-expire)', {
6262
title: 'Foo',
6363
variant: 'danger',
6464
pos: 'top-center',
@@ -74,7 +74,7 @@ There are two acceptable options for the `show` function. The first set of optio
7474
<template>
7575
<BButton
7676
@click="
77-
show('Bar (this Toast will not auto expire)', {
77+
show('Bar (this Toast will not auto-expire)', {
7878
title: 'Foo',
7979
variant: 'danger',
8080
pos: 'top-center',
@@ -103,7 +103,7 @@ The second option is to use a full object, this is similar to the string, howeve
103103
<BButton
104104
@click="
105105
show({
106-
body: 'Bar (this Toast will not auto expire)',
106+
body: 'Bar (this Toast will not auto-expire)',
107107
title: 'Foo',
108108
variant: 'danger',
109109
pos: 'top-center',
@@ -120,7 +120,7 @@ The second option is to use a full object, this is similar to the string, howeve
120120
<BButton
121121
@click="
122122
show({
123-
body: 'Bar (this Toast will not auto expire)',
123+
body: 'Bar (this Toast will not auto-expire)',
124124
title: 'Foo',
125125
variant: 'danger',
126126
pos: 'top-center',
@@ -219,7 +219,7 @@ You can place toasts in static static placements, and with more control by using
219219

220220
## Automatic Countdown
221221

222-
As you may have noticed, `BToast` counts down similar to `BAlert`, in fact, it actually uses the same underlying engine that powers the countdown timer of `BAlert`, albeit with some minor adjustments. So, many of the same props are shared, including the `interval` props and others. So, similar quirks apply
222+
As you may have noticed, `BToast` counts down similarly to `BAlert` it uses the same underlying engine that powers the countdown timer of `BAlert`, albeit with some minor adjustments. So, many of the same props are shared, including the `interval` props and others. So, similar quirks apply
223223

224224
<HighlightCard>
225225
<BButton
@@ -271,7 +271,7 @@ const {show} = useToast()
271271

272272
### ProgressBar Integration
273273

274-
As you may have noticed in that example, there was a built-in progress bar. This is triggered when using a value that is a `number` and when `progressProps` is not `undefined`. This was implemented because it can be difficult do modify the behavior of `BToast` when using a pure method, and the appearance of a ticking down progress bar is a "nice to have". Although, it is not out of the box behavior by Bootstrap, so its behavior is opt-in. This functions similarly to examples in `BAlert`
274+
As you may have noticed in that example, there was a built-in progress bar. This is triggered when using a value that is a `number` and when `progressProps` is not `undefined`. This was implemented because it can be difficult to modify the behavior of `BToast` when using a pure method, and the appearance of a ticking down progress bar is a "nice to have". Although it is not out of the box behavior by Bootstrap, its behavior is opt-in. This functions similarly to examples in `BAlert`
275275

276276
## BLink Integration
277277

0 commit comments

Comments
 (0)