main navigation redesign
This commit is contained in:
parent
485e72a9d1
commit
99f101306b
4 changed files with 54 additions and 35 deletions
|
|
@ -41,19 +41,24 @@
|
|||
|
||||
<body>
|
||||
<header>
|
||||
<nav>
|
||||
<nav class="cf">
|
||||
<input type="checkbox" id="toggle">
|
||||
<label for="toggle" class="toggle" onclick><i class="fa fa-bars"></i>Menü</label>
|
||||
<div id="home">
|
||||
<a href="<?=$linker->link(array(), 0, true, array(), true)?>"><?=\nre\configs\AppConfig::$app['name']?></a>
|
||||
</div>
|
||||
<?php if(!is_null($loggedUser)) : ?>
|
||||
<?php if(!is_null($loggedCharacter)) : ?>
|
||||
<a href="<?=$linker->link(array('characters','character',$loggedSeminary['url'],$loggedCharacter['url']))?>" id="profile"><i class="fa fa-user fa-fw"></i><?=$loggedCharacter['name']?><span class="circlenote"><?=$loggedCharacter['xplevel']?></span></a>
|
||||
<?php else : ?>
|
||||
<a href="<?=$linker->link(array('users',$loggedUser['url']))?>" id="profile"><i class="fa fa-user fa-fw"></i><?=$loggedUser['username']?></a>
|
||||
<div id="profile" class="cf">
|
||||
<?php if(!is_null($loggedCharacter)) : ?>
|
||||
<a href="<?=$linker->link(array('characters','character',$loggedSeminary['url'],$loggedCharacter['url']))?>"><img src="http://s1.directupload.net/images/140501/z6ni4yk8.png"><span><?=$loggedCharacter['name']?></span><span class="lvlname">Level <?=$loggedCharacter['xplevel']?></span></a>
|
||||
<?php else : ?>
|
||||
<a href="<?=$linker->link(array('users',$loggedUser['url']))?>"><?=$loggedUser['username']?><span class="lvlname">Martina Mustermann</span></a>
|
||||
<?php endif ?>
|
||||
</div>
|
||||
<?php endif ?>
|
||||
<?php endif ?>
|
||||
<menu>
|
||||
<ul id="mainmenu">
|
||||
<?=$menu?>
|
||||
</menu>
|
||||
</ul>
|
||||
</nav>
|
||||
</header>
|
||||
<article class="wrap">
|
||||
|
|
|
|||
|
|
@ -1,9 +1,9 @@
|
|||
<li><a href="<?=$linker->link(array(), 0, true, array(), true)?>"><i class="fa fa-home fa-fw"></i><?=\nre\configs\AppConfig::$app['name']?></a></li>
|
||||
<?php if(!is_null($loggedUser) && count(array_intersect(array('admin','moderator'),$loggedUser['roles'])) > 0) : ?><li><a href="<?=$linker->link('users')?>"><i class="fa fa-users fa-fw"></i><?=_('Users')?></a></li><?php endif ?>
|
||||
<?php if(!is_null($loggedUser)) : ?><li><a href="<?=$linker->link('seminaries')?>"><i class="fa fa-pencil-square-o fa-fw"></i><?=_('Seminaries')?></a></li><?php endif ?>
|
||||
<li><a href="<?=$linker->link(array(), 0, true, array(), true)?>"><?=\nre\configs\AppConfig::$app['name']?></a></li>
|
||||
<?php if(!is_null($loggedUser) && count(array_intersect(array('admin','moderator'),$loggedUser['roles'])) > 0) : ?><li><a href="<?=$linker->link('users')?>"><?=_('Users')?></a></li><?php endif ?>
|
||||
<?php if(!is_null($loggedUser)) : ?><li><a href="<?=$linker->link('seminaries')?>"><?=_('Seminaries')?></a></li><?php endif ?>
|
||||
<?php if(!is_null($loggedCharacter) && count($loggedCharacter['characterroles']) > 0) : ?><?=$seminarymenu?><?php endif ?>
|
||||
<?php if(is_null($loggedUser)) : ?>
|
||||
<li><a href="<?=$linker->link(array('users','login'))?>"><i class="fa fa-sign-in fa-fw"></i><?=_('Login')?></a></li>
|
||||
<li><a href="<?=$linker->link(array('users','login'))?>"><?=_('Login')?></a></li>
|
||||
<?php else : ?>
|
||||
<li><a href="<?=$linker->link(array('users','logout'))?>"><i class="fa fa-sign-out fa-fw"></i><?=_('Logout')?></a></li>
|
||||
<li><a href="<?=$linker->link(array('users','logout'))?>"><?=_('Logout')?></a></li>
|
||||
<?php endif ?>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,7 @@
|
|||
<li><a href="<?=$linker->link(array('seminaries',$loggedSeminary['url']))?>" class="smnry"><i class="fa fa-chevron-right fa-fw"></i><?=$loggedSeminary['title']?></a></li>
|
||||
<?php if(count(array_intersect(array('admin','moderator'),$loggedUser['roles'])) > 0 || count(array_intersect(array('admin','moderator'),$loggedCharacter['characterroles']))) : ?><li><a href="<?=$linker->link(array('characters',$loggedSeminary['url']))?>" class="smnry"><i class="fa fa-users fa-fw"></i><?=_('Characters')?></a></li><?php endif ?>
|
||||
<li><a href="<?=$linker->link(array('charactergroups','index',$loggedSeminary['url']))?>" class="smnry"><i class="fa fa-users fa-fw"></i><?=_('Character Groups')?></a></li>
|
||||
<li><a href="<?=$linker->link(array('achievements','index',$loggedSeminary['url']))?>" class="smnry"><i class="fa fa-trophy fa-fw"></i><?=_('Achievements')?></a></li>
|
||||
<li><a href="<?=$linker->link(array('library','index',$loggedSeminary['url']))?>" class="smnry"><i class="fa fa-book fa-fw"></i><?=_('Library')?></a></li>
|
||||
<ul id="smnry">
|
||||
<li><a href="<?=$linker->link(array('seminaries',$loggedSeminary['url']))?>"><i class="fa fa-chevron-right fa-fw"></i><?=$loggedSeminary['title']?></a></li>
|
||||
<?php if(count(array_intersect(array('admin','moderator'),$loggedUser['roles'])) > 0 || count(array_intersect(array('admin','moderator'),$loggedCharacter['characterroles']))) : ?><li><a href="<?=$linker->link(array('characters',$loggedSeminary['url']))?>"><i class="fa fa-users fa-fw"></i><?=_('Characters')?></a></li><?php endif ?>
|
||||
<li><a href="<?=$linker->link(array('charactergroups','index',$loggedSeminary['url']))?>"><i class="fa fa-users fa-fw"></i><?=_('Character Groups')?></a></li>
|
||||
<li><a href="<?=$linker->link(array('achievements','index',$loggedSeminary['url']))?>"><i class="fa fa-trophy fa-fw"></i><?=_('Achievements')?></a></li>
|
||||
<li><a href="<?=$linker->link(array('library','index',$loggedSeminary['url']))?>"><i class="fa fa-book fa-fw"></i><?=_('Library')?></a></li>
|
||||
</ul>
|
||||
|
|
@ -62,26 +62,30 @@ a:hover{color:#62c5cd}
|
|||
header{background:#0f373c;margin-bottom:19px;position:fixed;width:100%;z-index:99}
|
||||
header nav{z-index:99;margin:0 5%}
|
||||
|
||||
header a{display:block;margin-left:5%;color:#d9e5e7;font-family:Georgia,serif;text-transform:uppercase}
|
||||
header a:hover{color:#fff}
|
||||
header .fa{color:#5e9499}
|
||||
header a:hover .fa{color:#7fb0b4}
|
||||
|
||||
menu{display:none;opacity:0;position:absolute;margin:0;padding:0 0 15px;background:#0f373c;right:0;left:0}
|
||||
menu li{display:block;margin:0 5%}
|
||||
|
||||
menu a,#profile{display:block;padding:15px 0;color:#d9e5e7}
|
||||
menu a:hover,#profile:hover{color:#fff}
|
||||
|
||||
menu .active{color:#fff}
|
||||
menu .active .fa,.crewards .unlocked .fa{color:#bcd75e}
|
||||
|
||||
menu .smnry{font-size:0.875em;padding:8px 0 8px 12px;background:#0c2e32;border-bottom:2px solid #0f373c;border-radius:3px}
|
||||
|
||||
#home{display:none;opacity:0}
|
||||
#home a{line-height:93px;font-size:22px;letter-spacing:8px}
|
||||
#profile{float:right}
|
||||
.circlenote{margin-left:15px;background:#bcd75e;border-radius:0.8em;display:inline-block;color:#0f373c;font-weight:bold;line-height:1.6em;text-align:center;width:1.6em;font-size:.8em}
|
||||
#profile a{padding-top:10px;font-size:.875em;font-family:"Open sans",sans-serif;text-transform:none;margin-left:0}
|
||||
#profile img{float:left;width:36px;height:36px;margin-right:15px;border-radius:18px}
|
||||
#profile span{display:inline-block}
|
||||
#profile .lvlname{font-size:.875em;color:#889da0;margin-top:-4px;display:block}
|
||||
|
||||
#mainmenu{display:none;opacity:0;position:absolute;background:#0f373c;margin:0;left:0;right:0}
|
||||
#mainmenu a{padding:6px 0;letter-spacing:1px}
|
||||
#mainmenu .active{color:#fff}
|
||||
#mainmenu .active .fa,.crewards .unlocked .fa{color:#bcd75e}
|
||||
#smnry a{font-size:0.875em;font-family:"Open sans",sans-serif;text-transform:none;letter-spacing:0;margin:0 5% 2px;padding:8px 0 8px 12px;background:#0c2e32;border-radius:3px}
|
||||
#smnry li:first-child{margin-top:10px}
|
||||
#smnry li:last-child{margin-bottom:10px}
|
||||
|
||||
#toggle,.toggle{display:none}
|
||||
.toggle{color:#d9e5e7;display:inline-block;padding:15px 15px 15px 0;position:relative;cursor:pointer;-webkit-touch-callout:none;-moz-user-select:none;-ms-user-select:none;-webkit-user-select:none;user-select:none}
|
||||
#toggle:checked ~ menu{display:block;position:fixed;left:0;top:54px;bottom:0;overflow-y:auto;opacity:1}
|
||||
#toggle:checked ~ #mainmenu{display:block;position:fixed;top:56px;bottom:0;overflow-y:auto;opacity:1}
|
||||
|
||||
article{padding:70px 0 30px}
|
||||
aside{display:none}
|
||||
|
|
@ -377,10 +381,18 @@ input[type="submit"][disabled]{text-shadow:1px 2px #d48c4e;background:#f9ac69;bo
|
|||
|
||||
@media only screen and (min-width:1024px){
|
||||
header{position:fixed;left:0;top:0;bottom:0;width:300px;margin:0}
|
||||
header nav{margin:30px 10% 0}
|
||||
menu{display:block;opacity:1;position:relative}
|
||||
menu a{padding:10px 0}
|
||||
#profile{float:none;margin:0 0 15px 12px}
|
||||
header nav{margin:0}
|
||||
header a{margin-left:40px}
|
||||
#home{display:block;opacity:1}
|
||||
#profile{float:none;height:94px;margin-bottom:28px;background:#0c2e32}
|
||||
#profile a{margin-top:15px;margin-left:40px}
|
||||
#profile img{width:44px;height:44px;border-radius:22px}
|
||||
#profile span{display:block}
|
||||
#profile .lvlname{margin-top:0}
|
||||
#mainmenu{display:block;opacity:1;position:relative}
|
||||
#mainmenu li:first-child{display:none;opacity:0}
|
||||
#smnry li:first-child{display:block;opacity:1}
|
||||
#smnry a{margin:0 40px 2px}
|
||||
#toggle,.toggle{display:none}
|
||||
.wrap{margin:0 0 0 300px}
|
||||
article{padding:20px 40px 80px 40px}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue