Markdown tweaks

This commit is contained in:
XhmikosR
2020-06-02 16:57:24 +03:00
parent edc51cc61b
commit 6017b241bf
16 changed files with 171 additions and 103 deletions

View File

@@ -6,7 +6,8 @@ title: Card Refresh Plugin
The card refresh plugin provides the functionality for loading ajax content into the card.
##### Usage
This plugin can be activated as a jQuery plugin or using the data api.
This plugin can be activated as a jQuery plugin or using the data API.
###### Data API
{: .text-bold }
@@ -14,9 +15,9 @@ This plugin can be activated as a jQuery plugin or using the data api.
Activate the plugin by adding a button with `data-card-widget="card-refresh"` to the card and provide the required `data-source="/URL-TO-CONTENT"` option. By doing that, the plugin will automatically create a GET request to the provided URL and render the returned response the `.card-body` section of the card. If you need to process the returned response before rendering, you should use the jQuery API, which provides hooks to deal with the response.
###### jQuery
{: .text-bold }
The jQuery API provides more customizable options that allows the developer to pre-process the request before rendering and post-process it after rendering.
```js

View File

@@ -5,17 +5,18 @@ title: Card Widget Plugin
The card widget plugin provides the functionality for collapsing, expanding and removing a card.
##### Usage
This plugin can be activated as a jQuery plugin or using the data api.
### Usage
###### Data API
{: .text-bold }
This plugin can be activated as a jQuery plugin or using the data API.
This plugin provides two data-api attributes. Any element using one of the following attributes should be placed within the `.card-tools` div, which is usually in the card header. For more information about the [card HTML structure]({% link components/cards.md %}), visit the card component documentation
#### Data API
This plugin provides two `data-api` attributes. Any element using one of the following attributes should be placed within the `.card-tools` div, which is usually in the card header. For more information about the [card HTML structure]({% link components/cards.md %}), visit the card component documentation
##### `data-card-widget="collapse"`
`data-card-widget="collapse"`
<br />
This attribute, when attached to a button, allows the box to be collapsed/expanded when clicked.
<div class="row">
<div class="col-12 col-md-4">
<div class="card">
@@ -53,9 +54,10 @@ This attribute, when attached to a button, allows the box to be collapsed/expand
</div>
</div>
`data-card-widget="remove"`
<br />
##### `data-card-widget="remove"`
This attribute, when attached to a button, allows the box to be removed when clicked.
<div class="row">
<div class="col-12 col-md-4">
<div class="card">
@@ -93,9 +95,10 @@ This attribute, when attached to a button, allows the box to be removed when cli
</div>
</div>
`data-card-widget="maximize"`
<br />
##### `data-card-widget="maximize"`
This attribute, when attached to a button, allows the box to be maximize/minimize when clicked.
<div class="row">
<div class="col-12 col-md-4">
<div class="card">