main navigation redesign

This commit is contained in:
Daniel 2014-05-01 23:48:51 +02:00
commit 99f101306b
4 changed files with 54 additions and 35 deletions

View file

@ -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}