hazza/hinode
1
0
Fork 0
mirror of https://github.com/gethinode/hinode.git synced 2025-10-18 15:33:10 +00:00
Code Issues Packages Projects Releases Wiki Activity

Refine badge documentation

Browse Source
This commit is contained in:
mark
2023-01-02 07:52:16 +01:00
parent 8e65ad0d9b
commit ac36334e46
1 changed files with 15 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
content/en/blog/bootstrap.md
View File

@@ -37,18 +37,27 @@ A simple danger alert—check it out!
## Badge ## Badge
Badges can be added to headings and buttons. The following two sections illustrate how to use them.
### Headings ### Headings
<h1>Example heading <span class="badge bg-secondary">New</span></h1> Use HTML code to display a badge for a heading. See the Bootstrap [documentation][bs_badge_heading] for more options. The following example displays a badge for a heading of size six.
<h2>Example heading <span class="badge bg-secondary">New</span></h2>
<h3>Example heading <span class="badge bg-secondary">New</span></h3> ```html
<h4>Example heading <span class="badge bg-secondary">New</span></h4> <h6>Example heading <span class="badge bg-secondary">New</span></h6>
<h5>Example heading <span class="badge bg-secondary">New</span></h5> ```
The result looks like this.
<h6>Example heading <span class="badge bg-secondary">New</span></h6> <h6>Example heading <span class="badge bg-secondary">New</span></h6>
### Buttons ### Buttons
The badge for a button is available via a [custom shortcode]({{< ref "custom-shortcodes#button" >}} "custom shortcode"). The badge for a button is available via a [custom shortcode]({{< ref "custom-shortcodes#button" >}} "custom shortcode"). The following example displays a light button with a badge.
{{< button color="light" href="#" badge="3" >}}
Button
{{< /button >}}
## Breadcrumb ## Breadcrumb