educaweb2/shortcodes/tabpannel.tmpl

60 lines
1.3 KiB
Cheetah

<%doc>
Return a bootstrap4 Tab Pannel
Template engine: Mako
Usage:
{{% tabpannel [active=<active>] %}}
<Title Tab 1>
<Content Tab 1>
<Title Tab 2>
<Content Tab 2>
...
{{% /tabpannel %}}
separate each tab from the next with two blank lines. Where <active> is the number of the initialy active tab, 1 to number of tabs. Default, any tab active.
Example:
</%doc>
<% tabs = data.split('\n\n\n') %>
## <% lines = [item for item in lines if item != ''] %>
<% ntabs = len(tabs) %>
% if active is UNDEFINED:
<% act = None %>
% else:
<% act = int(active) %>
% endif
<ul class="nav nav-pills nav-fill">
% for t in range(0, ntabs):
<li class="nav-item">
% if t+1 == act:
<a class="nav-link active" data-toggle="tab" href="#tab-pane-${t}" id="tab-${t}">
% else:
<a class="nav-link" data-toggle="tab" href="#tab-pane-${t}" id="tab-${t}">
% endif
${tabs[t].lstrip('\n').split('\n', 1)[0]}
</a>
</li>
% endfor
</ul>
<!-- Tab panes -->
<div class="tab-content">
% for t in range(0, ntabs):
% if t+1 == act:
<div id="tab-pane-${t}" class="container-xl tab-pane active"><br>
% else:
<div id="tab-pane-${t}" class="container-xl tab-pane fade"><br>
% endif
${tabs[t].lstrip('\n').split('\n', 1)[1]}
</div>
% endfor
</div>