N°2847 - Tab container: Fix some issues

- Fix extra tabs list being behind the tab content
- Sanitize tab ID in the HTML
This commit is contained in:
Molkobain
2020-10-05 11:00:51 +02:00
parent aa38be4578
commit 79514358db
2 changed files with 6 additions and 5 deletions

View File

@@ -82,6 +82,7 @@ $ibo-tab-container--extra-tab-toggler--background-color--on-hover: $ibo-color-gr
}
.ibo-tab-container--extra-tabs-list{
position: absolute;
z-index: 1;
top: calc(100% + 6px);
right: 12px;
max-height: $ibo-tab-container--extra-tabs-list--max-height;

View File

@@ -7,12 +7,12 @@
{% for oTab in oUIBlock.GetSubBlocks() %}
{% block iboTabContainerTab %}
{% if oTab.GetType() == constant('TabManager::ENUM_TAB_TYPE_AJAX') %}
<li class="ibo-tab-container--tab-header" data-role="ibo-tab-container--tab-header" data-tab-id="tab_{{ loop.index }}" data-tab-type="{{ oTab.GetType() }}" data-cache="{{ oTab.GetCache() }}">
<li class="ibo-tab-container--tab-header" data-role="ibo-tab-container--tab-header" data-tab-id="tab_{{ oTab.GetId()|sanitize_identifier }}" data-tab-type="{{ oTab.GetType() }}" data-cache="{{ oTab.GetCache() }}">
<a href="{{ oTab.GetUrl() }}" class="ibo-tab-container--tab-toggler" data-role="ibo-tab-container--tab-toggler"><span>{{ oTab.GetTitle() }}</span></a>
</li>
{% elseif oTab.GetType() == constant('TabManager::ENUM_TAB_TYPE_HTML') %}
<li class="ibo-tab-container--tab-header" data-role="ibo-tab-container--tab-header" data-tab-id="tab_{{ loop.index }}" data-tab-type="{{ oTab.GetType() }}">
<a href="#tab_{{ loop.index }}" class="ibo-tab-container--tab-toggler" data-role="ibo-tab-container--tab-toggler"><span>{{ oTab.GetTitle() }}</span></a>
<li class="ibo-tab-container--tab-header" data-role="ibo-tab-container--tab-header" data-tab-id="tab_{{ oTab.GetId()|sanitize_identifier }}" data-tab-type="{{ oTab.GetType() }}">
<a href="#tab_{{ oTab.GetId()|sanitize_identifier }}" class="ibo-tab-container--tab-toggler" data-role="ibo-tab-container--tab-toggler"><span>{{ oTab.GetTitle() }}</span></a>
</li>
{% endif %}
{% endblock %}
@@ -21,7 +21,7 @@
<a href="#" class="ibo-tab-container--extra-tabs-list-toggler" data-role="ibo-tab-container--extra-tabs-list-toggler"><span class="fas fa-ellipsis-v"></span></a>
<div class="ibo-tab-container--extra-tabs-list ibo-is-hidden" data-role="ibo-tab-container--extra-tabs-list">
{% for oTab in oUIBlock.GetSubBlocks() %}
<a href="#tab_{{ loop.index }}" class="ibo-tab-container--extra-tab-toggler" data-role="ibo-tab-container--extra-tab-toggler"><span>{{ oTab.GetTitle() }}</span></a>
<a href="#tab_{{ oTab.GetId()|sanitize_identifier }}" class="ibo-tab-container--extra-tab-toggler" data-role="ibo-tab-container--extra-tab-toggler"><span>{{ oTab.GetTitle() }}</span></a>
{% endfor %}
</div>
</li>
@@ -30,7 +30,7 @@
{% block iboTabContainerTabsContainers %}
{% for oTab in oUIBlock.GetSubBlocks() %}
{% if oTab.GetType() == constant('TabManager::ENUM_TAB_TYPE_HTML') %}
<div id="tab_{{ loop.index }}" class="ibo-tab-container--tab-container">
<div id="tab_{{ oTab.GetId()|sanitize_identifier }}" class="ibo-tab-container--tab-container">
{{ render_block(oTab, {aPage: aPage}) }}
</div>
{% endif %}