The palest ink is better than the best memory
Github markdown tabs
I tried some different implementations. Based on jekyll configs, Navtabs is most flexible to my knowlege, with least changes to my yml file.
Navtabs demo
The following is a demo of a navtab.
Profile
Praesent sit amet fermentum leo. Aliquam feugiat,
- nibh in u ltrices mattis
- felis ipsum venenatis metus, vel vehicula libero mauris a enim. Sed placerat est ac lectus vestibulum tempor.
- Quisque ut condimentum massa.
- ut condimentum massa.
Proin venenatis leo id urna cursus blandit. Vivamus sit amet hendrerit metus.
About
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam vel sollicitudin felis. Sed eu arcu sed ipsum semper luctus eu a tortor. Suspendisse id leo eu metus laoreet varius. Mauris consequat accumsan ex, a iaculis metus fermentum a. Praesent sit amet fermentum leo. Aliquam feugiat, nibh in u ltrices mattis, felis ipsum venenatis metus, vel vehicula libero mauris a enim. Sed placerat est ac lectus vestibulum tempor. Quisque ut condimentum massa. Proin venenatis leo id urna cursus blandit. Vivamus sit amet hendrerit metus.about
1
echo "Hello world"
1
2
name="world"
print(f"hello,{name}")
Raw code in the md file
Here, we need to use ```` to enclose the html code, as ``` are used inside.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
<ul id="profileTabs" class="nav nav-tabs">
<li class="active"><a class="noCrossRef" href="#profile" data-toggle="tab">Profile</a></li>
<li><a class="noCrossRef" href="#about" data-toggle="tab">About</a></li>
<li><a class="noCrossRef" href="#bash" data-toggle="tab">Using bash</a></li>
<li><a class="noCrossRef" href="#python" data-toggle="tab">Using python</a></li>
</ul>
<div class="tab-content">
<div role="tabpanel" class="tab-pane active" id="profile" markdown="1">
## Profile(markdown active, default)
Pr...
1. n...
2. fel...
* Qu...
* ut...
> Pro...
</div>
<div role="tabpanel" class="tab-pane" id="about">
<h2>About</h2>
<p>Lorem...</p>
</div>
<div role="tabpanel" class="tab-pane" id="bash" markdown="1">
```bash
echo "Hello world"
```
</div>
<div role="tabpanel" class="tab-pane" id="python" markdown="1">
```python
name="world"
print(f"hello,{name}")
```
</div>
</div>
