diff options
Diffstat (limited to 'docs/guide/components')
| -rw-r--r-- | docs/guide/components/alert.md | 4 | ||||
| -rw-r--r-- | docs/guide/components/button.md | 9 | ||||
| -rw-r--r-- | docs/guide/components/table.md | 32 | ||||
| -rw-r--r-- | docs/guide/components/toast.md | 2 |
4 files changed, 14 insertions, 33 deletions
diff --git a/docs/guide/components/alert.md b/docs/guide/components/alert.md index 1ad965bd..1892f3f8 100644 --- a/docs/guide/components/alert.md +++ b/docs/guide/components/alert.md @@ -3,9 +3,7 @@ An alert is an inline message that contains a short description that a user cann [Learn more about Bootstrap-vue alert options](https://bootstrap-vue.js.org/docs/components/alert) -<alert show variant="warning">This is a warning message</alert> -<alert show variant="danger">This is an error message</alert> -<alert show variant="info">This is an info message</alert> + ```vue <alert show variant="warning">This is a warning message</alert> diff --git a/docs/guide/components/button.md b/docs/guide/components/button.md index 6916d438..3e61b797 100644 --- a/docs/guide/components/button.md +++ b/docs/guide/components/button.md @@ -4,7 +4,14 @@ Buttons are used to perform an action. The main buttons in the application are t [Learn more about Bootstrap-vue buttons](https://bootstrap-vue.js.org/docs/components/button) -<BmcButtons /> +### Enabled buttons + + + +### Disabled buttons + + + ```vue // Enabled Buttons diff --git a/docs/guide/components/table.md b/docs/guide/components/table.md index ddb1413f..af464e46 100644 --- a/docs/guide/components/table.md +++ b/docs/guide/components/table.md @@ -17,29 +17,8 @@ There are a few required properties to maintain consistency across the applicati - `show-empty` *(required if table data is generated dynamically)* - shows an empty message if there are no items in the table - `empty-text` *(required if table data is generated dynamically)* - the translated empty message -<br/> - -<b-table - :fields="['Name', 'Age', 'Color']" - :items="[ - {Name: 'Babe', Age: '3 years', Color: 'white, orange, grey' }, - {Name: 'Grey Boy', Age: '4 months', Color: 'grey' } - ]" - hover - head-variant="light" - table-variant="light" -/> - -<b-table - show-empty - hover - :fields="['Name', 'Age', 'Color']" - head-variant="light" - table-variant="light" - empty-text="No items available" -/> - -<br/> + + ```vue <template> @@ -95,7 +74,8 @@ To enable table sort, include `sortable: true` in the fields array for sortable - `no-sort-reset` - `sort-icon-left` -<br/> + + ```vue <template> @@ -137,10 +117,6 @@ export default { </script> ``` -<br /> - -<BmcTable /> - <!-- ## Expandable row --> <!-- ## Pagination --> <!-- ## Row actions --> diff --git a/docs/guide/components/toast.md b/docs/guide/components/toast.md index 5dc2e0e9..fa8e56ee 100644 --- a/docs/guide/components/toast.md +++ b/docs/guide/components/toast.md @@ -3,7 +3,7 @@ Use a toast message to indicate the status of a user action. For example, a user There are different transitions for the toast messages. The `success` toast message will auto-hide after 10 seconds. The user must manually dismiss the `informational`, `warning`, and `error` toast messages. The `BVToastMixin` provides a simple API that generates a toast message that meets the transition guidelines. -<BmcToasts /> +<img :src="$withBase('/toast.png')" alt="Toast example" style="max-width:350px"> ```js{5} // Sample method from Reboot BMC page |