frio - fix tabbar on mobile view

This commit is contained in:
rabuzarus 2017-02-08 01:34:36 +01:00
parent 7f1acdb8e9
commit 60ef105a14
3 changed files with 56 additions and 53 deletions

View file

@ -1719,13 +1719,14 @@ img.acpopup-img {
} }
/* Menubar Tabs */ /* Menubar Tabs */
section > ul.tabbar { section > .tabbar-wrapper {
/* The tabbar shouldn't' be visibile inside /* The tabbar shouldn't' be visibile inside
the section element. Only after we have the section element. Only after we have
moved it to the nav through js */ moved it to the nav through js */
display: none !important; display: none !important;
} }
#tabmenu, #tabmenu,
.tabbar-wrapper,
.tabbar, .tabbar,
.tabbar > li { .tabbar > li {
height: 100%; height: 100%;

View file

@ -40,7 +40,7 @@ $(document).ready(function(){
$(".field.select > select, .field.custom > select").addClass("form-control"); $(".field.select > select, .field.custom > select").addClass("form-control");
// move the tabbar to the second nav bar // move the tabbar to the second nav bar
$("section ul.tabbar").first().appendTo("#topbar-second > .container > #tabmenu"); $("section .tabbar-wrapper").first().appendTo("#topbar-second > .container > #tabmenu");
// add mask css url to the logo-img container // add mask css url to the logo-img container
// //

View file

@ -1,6 +1,7 @@
{{* Tab navigation bar for tablets and computer *}} <div class="tabbar-wrapper">
<ul role="menubar" class="tabbar list-inline visible-lg visible-md visible-sm hidden-xs"> {{* Tab navigation bar for tablets and computer *}}
<ul role="menubar" class="tabbar list-inline visible-lg visible-md visible-sm hidden-xs">
{{* The normal tabbar *}} {{* The normal tabbar *}}
<li> <li>
<ul class="tabs flex-nav" role="menu" > <ul class="tabs flex-nav" role="menu" >
@ -21,10 +22,10 @@
</li> </li>
</ul> </ul>
</li> </li>
</ul> </ul>
{{* Tab navigation bar for smartphones *}} {{* Tab navigation bar for smartphones *}}
<ul role="menubar" class="tabbar list-inline visible-xs"> <ul role="menubar" class="tabbar list-inline visible-xs">
{{* The active menupoint will be shown as one menupoint*}} {{* The active menupoint will be shown as one menupoint*}}
<li> <li>
<ul class="tabs" role="menu"> <ul class="tabs" role="menu">
@ -55,4 +56,5 @@
</li> </li>
</ul> </ul>
</li> </li>
</ul> </ul>
</div>