[docs] Add Tabs List component to smoke test page. (#9097)

This commit is contained in:
Jesse Stuart
2018-06-19 14:01:32 -04:00
committed by k8s-ci-robot
parent 2e23aa3a05
commit 3fd4c6b3d1
+40 -6
View File
@@ -62,7 +62,7 @@ from Jekyll to Hugo, we broke some lists. To fix them, keep the following in
mind: mind:
- Make sure you indent sub-list items **4 spaces** rather than the 2 that you - Make sure you indent sub-list items **4 spaces** rather than the 2 that you
ma be yused to. Counter-intuitively, you need to indent block-level content may be used to. Counter-intuitively, you need to indent block-level content
within a list item an extra 4 spaces too. within a list item an extra 4 spaces too.
- To end a list and start another, you need a HTML comment block on a new line - To end a list and start another, you need a HTML comment block on a new line
@@ -92,9 +92,9 @@ mind:
```bash ```bash
ls -l ls -l
``` ```
- And a sub-list after some block-level content - And a sub-list after some block-level content
- A bullet list item can contain a numbered list. - A bullet list item can contain a numbered list.
1. Numbered sub-list item 1 1. Numbered sub-list item 1
2. Numbered sub-list item 2 2. Numbered sub-list item 2
@@ -123,15 +123,49 @@ mind:
```bash ```bash
$ ls -l $ ls -l
``` ```
- And a sub-list after some block-level content. This is at the same - And a sub-list after some block-level content. This is at the same
"level" as the paragraph and code block above, despite being indented "level" as the paragraph and code block above, despite being indented
more. more.
### Tab lists
Tab lists can be used to conditionally display content, e.g., when multiple
options must be documented that require distinct instructions or context.
{{< tabs name="tab_lists_example" >}}
{{% tab name="Choose one..." %}}
Please select an option.
{{% /tab %}}
{{% tab name="Formatting tab lists" %}}
Tabs may also nest formatting styles.
1. Ordered
1. (Or unordered)
1. Lists
```bash
$ echo 'Tab lists may contain code blocks!'
```
{{% /tab %}}
{{% tab name="Nested headers" %}}
### Header within a tab list
Nested header tags may also be included.
{{< warning >}}
**Note**: Headers within tab lists will not appear in the Table of Contents.
{{< /warning >}}
{{% /tab %}}
{{< /tabs >}}
### Checklists ### Checklists
Checlists are technically bullet lists, but the bullets are suppressed by CSS. Checklists are technically bullet lists, but the bullets are suppressed by CSS.
- [ ] This is a checklist item - [ ] This is a checklist item
- [x] This is a selected checklist item - [x] This is a selected checklist item
@@ -151,7 +185,6 @@ This is due to
[blackfriday issue #239](https://github.com/russross/blackfriday/issues/239). [blackfriday issue #239](https://github.com/russross/blackfriday/issues/239).
{{< /warning >}} {{< /warning >}}
``` ```
this is a code block created by back-ticks this is a code block created by back-ticks
``` ```
@@ -293,3 +326,4 @@ You can have multiple paragraphs and block-level elements inside an admonition.
{{< warning >}} {{< warning >}}
**Warning:** Warnings point out something that could cause harm if ignored. **Warning:** Warnings point out something that could cause harm if ignored.
{{< /warning >}} {{< /warning >}}