bitPickups/friendica_2021.01_tupambae_shared_hosting
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

mobile friendly tabs

Browse source
This commit is contained in:
fabrixxm 2015-11-11 18:39:32 +01:00
parent c687069709
commit e5edd7b7db
2 changed files with 29 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

25
view/theme/vier/mobile.css
View file

@ -115,3 +115,28 @@ aside {
aside.show { aside.show {
left: 0; left: 0;
} }
/* tabs */
.tabs { position: relative; height: 25px!important; }
.tabs li { width: 100%; }
.tabs .tab { display: none;}
.tabs .tab.active { display: block; }
.tabs::after {
content: " ";
display: block;
position: absolute;
left: 0; right:0; top: 0; bottom: 0;
}
.tabs.show {
position: fixed;
z-index: 1000;
left: 10px;
right: 10px;
top: 0px;
bottom: 10px;
height: auto !important;
border: 1px solid #ccc;
}
.tabs.show::after { display: none; }
.tabs.show .tab { display: block; }

5
view/theme/vier/theme.php
View file

@ -33,7 +33,7 @@ function vier_init(&$a) {
$a->page['htmlhead'] .= '<meta name=viewport content="width=device-width, initial-scale=1">'."\n"; $a->page['htmlhead'] .= '<meta name=viewport content="width=device-width, initial-scale=1">'."\n";
$a->page['htmlhead'] .= '<link rel="stylesheet" type="text/css" href="view/theme/vier/mobile.css" media="screen"/>'."\n"; $a->page['htmlhead'] .= '<link rel="stylesheet" type="text/css" href="view/theme/vier/mobile.css" media="screen"/>'."\n";
} }
$a->page['htmlhead'] .= '<link rel="stylesheet" type="text/css" href="view/theme/vier/mobile.css" media="screen and (max-width: 1000px)"/>'."\n"; #$a->page['htmlhead'] .= '<link rel="stylesheet" type="text/css" href="view/theme/vier/mobile.css" media="screen and (max-width: 1000px)"/>'."\n";
$a->page['htmlhead'] .= <<< EOT $a->page['htmlhead'] .= <<< EOT
<link rel='stylesheet' type='text/css' href='view/theme/vier/narrow.css' media='screen and (max-width: 1100px)' /> <link rel='stylesheet' type='text/css' href='view/theme/vier/narrow.css' media='screen and (max-width: 1100px)' />
@ -92,6 +92,9 @@ $(document).ready(function() {
e.preventDefault(); e.preventDefault();
$("aside").toggleClass("show"); $("aside").toggleClass("show");
}); });
$(".tabs").click(function(e){
$(this).toggleClass("show");
});
}); });
</script> </script>