X-Git-Url: https://git.mxchange.org/?a=blobdiff_plain;f=view%2Ftheme%2Ffrio%2Ftemplates%2Fcommon_tabs.tpl;h=76c6db039820712b43d5b72c1356429a8063a554;hb=a1de23d4cb7b65e9d588728e880ad8edd09d37f2;hp=c5d1dac6bd282b8855815f0f00454d6bc9d9c55f;hpb=7d531afd00de35ef55d0cc5caa63242765341dae;p=friendica.git

diff --git a/view/theme/frio/templates/common_tabs.tpl b/view/theme/frio/templates/common_tabs.tpl
index c5d1dac6bd..76c6db0398 100644
--- a/view/theme/frio/templates/common_tabs.tpl
+++ b/view/theme/frio/templates/common_tabs.tpl
@@ -1,58 +1,60 @@
 
-{{* 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 *}}
-	<li>
-		<ul class="tabs  flex-nav" role="menu" >
-		{{foreach $tabs as $tab}}
-			<li id="{{$tab.id}}" role="menuitem" {{if $tab.sel}} class="{{$tab.sel}}" {{/if}}><a href="{{$tab.url}}" {{if $tab.title}} title="{{$tab.title}}"{{/if}}>{{$tab.label}}</a></li>
-		{{/foreach}}
-		</ul>
-	</li>
-
-	{{* The extended dropdown menu - this would be shown if the tab menu points
-		dosn't fit in the available space. This is done through flexMenu.js *}}
-	<li class="pull-right">
-		<ul class="tabs tabs-extended" role="menu">
-			<li role="menuitem" class="dropdown flex-target">
-				<a class="dropdown-toggle" type="button" id="dropdownMenuTools" data-toggle="dropdown" aria-expanded="true">
-				<i class="fa fa-chevron-down"></i>
-				</a>
-			</li>
-		 </ul>
-	</li>
-</ul>
-
-{{* Tab navigation bar for smartphones *}}
-<ul role="menubar" class="tabbar list-inline visible-xs">
-	{{* The active menupoint will be shown as one menupoint*}}
-	<li>
-		<ul class="tabs" role="menu">
+<div class="tabbar-wrapper">
+	{{* 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 *}}
+		<li>
+			<ul class="tabs  flex-nav" role="menu" >
 			{{foreach $tabs as $tab}}
-				{{if $tab.sel}}
-				<li id="{{$tab.id}}" role="menuitem" {{if $tab.sel}} class="{{$tab.sel}}" {{/if}}><a href="{{$tab.url}}" {{if $tab.title}} title="{{$tab.title}}"{{/if}}>{{$tab.label}}</a></li>
-				{{else}}
-				{{$exttabs[]=$tab}}
-				{{/if}}
+				<li id="{{$tab.id}}" role="presentation" {{if $tab.sel}} class="{{$tab.sel}}" {{/if}}><a role="menuitem" href="{{$tab.url}}" {{if $tab.accesskey}}accesskey="{{$tab.accesskey}}"{{/if}} {{if $tab.title}} title="{{$tab.title}}"{{/if}}>{{$tab.label}}</a></li>
 			{{/foreach}}
+			</ul>
+		</li>
+
+		{{* The extended dropdown menu - this would be shown if the tab menu points
+			doesn't fit in the available space. This is done through flexMenu.js *}}
+		<li class="pull-right">
+			<ul class="tabs tabs-extended" role="menu">
+				<li role="presentation" class="dropdown flex-target">
+					<button type="button" class="btn-link dropdown-toggle" id="dropdownMenuTools" data-toggle="dropdown" aria-expanded="false">
+						<i class="fa fa-chevron-down" aria-hidden="true"></i>
+					</button>
+				</li>
+			 </ul>
+		</li>
+	</ul>
+
+	{{* Tab navigation bar for smartphones *}}
+	<ul role="menubar" class="tabbar list-inline visible-xs">
+		{{* The active menupoint will be shown as one menupoint*}}
+		<li>
+			<ul class="tabs" role="menu">
+				{{foreach $tabs as $tab}}
+					{{if $tab.sel}}
+					<li id="{{$tab.id}}-xs" role="presentation" {{if $tab.sel}} class="{{$tab.sel}}" {{/if}}><a role="menuitem" href="{{$tab.url}}" {{if $tab.title}} title="{{$tab.title}}"{{/if}}>{{$tab.label}}</a></li>
+					{{else}}
+					{{$exttabs[]=$tab}}
+					{{/if}}
+				{{/foreach}}
 
 
-		</ul>
-	</li>
+			</ul>
+		</li>
 
-	{{* All others are moved to this dropdown menu *}}
-	<li class="pull-right">
-		<ul class="tabs tabs-extended">
-			<li class="dropdown">
-				<a class="dropdown-toggle" type="button" id="dropdownMenuTools" data-toggle="dropdown" aria-expanded="true">
-					<i class="fa fa-chevron-down"></i>
-				</a>
-				<ul class="dropdown-menu pull-right" role="menu" aria-labelledby="dropdownMenuTools">
-					{{foreach $exttabs as $tab}}
-					<li id="{{$tab.id}}" role="menuitem" {{if $tab.sel}} class="{{$tab.sel}}" {{/if}}><a href="{{$tab.url}}" {{if $tab.title}} title="{{$tab.title}}"{{/if}}>{{$tab.label}}</a></li>
-					{{/foreach}}
-				</ul>
-			</li>
-		</ul>
-	</li>
-</ul>
+		{{* All others are moved to this dropdown menu *}}
+		<li class="pull-right">
+			<ul class="tabs tabs-extended">
+				<li class="dropdown">
+					<button type="button" class="btn-link dropdown-toggle" id="dropdownMenuTools-xs" data-toggle="dropdown" aria-expanded="false">
+						<i class="fa fa-chevron-down" aria-hidden="true"></i>
+					</button>
+					<ul class="dropdown-menu pull-right" role="menu" aria-labelledby="dropdownMenuTools">
+						{{foreach $exttabs as $tab}}
+						<li id="{{$tab.id}}-xs" role="presentation" {{if $tab.sel}} class="{{$tab.sel}}" {{/if}}><a role="menuitem" href="{{$tab.url}}" {{if $tab.title}} title="{{$tab.title}}"{{/if}}>{{$tab.label}}</a></li>
+						{{/foreach}}
+					</ul>
+				</li>
+			</ul>
+		</li>
+	</ul>
+</div>