fix alignment issues with toolbar
Signed-off-by: Simon L'nu <simon.lnu@gmail.com>
This commit is contained in:
parent
f087fd5581
commit
af3e37ce20
4 changed files with 113 additions and 84 deletions
|
@ -2,48 +2,52 @@
|
||||||
|
|
||||||
<span id="banner">$banner</span>
|
<span id="banner">$banner</span>
|
||||||
|
|
||||||
<!-- yes, they're going the other way. seems that's how the template renderer
|
|
||||||
works -->
|
|
||||||
<a name="top" id="top"></a>
|
<a name="top" id="top"></a>
|
||||||
<div id="nav-floater">
|
<div id="nav-floater">
|
||||||
<div id="nav-buttons">
|
<ul id="nav-buttons">
|
||||||
{{ if $nav.help }}
|
{{ if $nav.login }}
|
||||||
<a id="nav-help-link" class="nav-link $nav.help.2" href="$nav.help.0" title="$nav.help.1">$nav.help.1</a>
|
<li><a id="nav-login-link" class="nav-login-link $nav.login.2"
|
||||||
|
href="$nav.login.0" title="$nav.login.3" >$nav.login.1</a></li>
|
||||||
{{ endif }}
|
{{ endif }}
|
||||||
{{ if $nav.community }}
|
{{ if $nav.home }}
|
||||||
<a id="nav-community-link" class="nav-link $nav.community.2"
|
<li><a id="nav-home-link" class="nav-link $nav.home.2"
|
||||||
href="$nav.community.0" title="$nav.community.1">$nav.community.1</a>
|
href="$nav.home.0" title="$nav.home.1">$nav.home.1</a></li>
|
||||||
{{ endif }}
|
{{ endif }}
|
||||||
{{ if $nav.apps }}
|
{{ if $nav.network }}
|
||||||
<a id="nav-apps-link" class="nav-link $nav.apps.2" href="$nav.apps.0" title="$nav.apps.1">$nav.apps.1</a>
|
<li><a id="nav-network-link" class="nav-link $nav.network.2"
|
||||||
{{ endif }}
|
href="$nav.network.0" title="$nav.network.1">$nav.network.1</a></li>
|
||||||
<a id="nav-directory-link" class="nav-link $nav.directory.2" href="$nav.directory.0" title="$nav.directory.1">$nav.directory.1</a>
|
|
||||||
<a id="nav-search-link" class="nav-link $nav.search.2" href="$nav.search.0" title="$nav.search.1">$nav.search.1</a>
|
|
||||||
{{ if $nav.messages }}
|
|
||||||
<a id="nav-messages-link" class="nav-link $nav.messages.2"
|
|
||||||
href="$nav.messages.0" title="$nav.messages.1">$nav.messages.1</a>
|
|
||||||
{{ endif }}
|
{{ endif }}
|
||||||
{{ if $nav.notifications }}
|
{{ if $nav.notifications }}
|
||||||
<a id="nav-notifications-linkmenu" class="nav-link $nav.notifications.2" href="$nav.notifications.0" rel="#nav-notifications-menu" title="$nav.notifications.1">$nav.notifications.1</a>
|
<li><a id="nav-notifications-linkmenu" class="nav-link $nav.notifications.2"
|
||||||
|
href="$nav.notifications.0"
|
||||||
|
rel="#nav-notifications-menu" title="$nav.notifications.1">$nav.notifications.1</a></li>
|
||||||
<ul id="nav-notifications-menu" class="menu-popup">
|
<ul id="nav-notifications-menu" class="menu-popup">
|
||||||
<li id="nav-notifications-see-all"><a href="$nav.notifications.all.0">$nav.notifications.all.1</a></li>
|
<li id="nav-notifications-see-all"><a href="$nav.notifications.all.0">$nav.notifications.all.1</a></li>
|
||||||
<li id="nav-notifications-mark-all"><a href="#" onclick="notifyMarkAll(); return false;">$nav.notifications.mark.1</a></li>
|
<li id="nav-notifications-mark-all"><a href="#" onclick="notifyMarkAll(); return false;">$nav.notifications.mark.1</a></li>
|
||||||
<li class="empty">$emptynotifications</li>
|
<li class="empty">$emptynotifications</li>
|
||||||
</ul>
|
</ul>
|
||||||
{{ endif }}
|
{{ endif }}
|
||||||
{{ if $nav.network }}
|
{{ if $nav.messages }}
|
||||||
<a id="nav-network-link" class="nav-link $nav.network.2"
|
<li><a id="nav-messages-link" class="nav-link $nav.messages.2"
|
||||||
href="$nav.network.0" title="$nav.network.1">$nav.network.1</a>
|
href="$nav.messages.0" title="$nav.messages.1">$nav.messages.1</a></li>
|
||||||
{{ endif }}
|
{{ endif }}
|
||||||
{{ if $nav.home }}
|
{{ if $nav.community }}
|
||||||
<a id="nav-home-link" class="nav-link $nav.home.2"
|
<li><a id="nav-community-link" class="nav-link $nav.community.2"
|
||||||
href="$nav.home.0" title="$nav.home.1">$nav.home.1</a>
|
href="$nav.community.0" title="$nav.community.1">$nav.community.1</a></li>
|
||||||
{{ endif }}
|
{{ endif }}
|
||||||
{{ if $nav.login }}
|
<li><a id="nav-directory-link" class="nav-link $nav.directory.2"
|
||||||
<a id="nav-login-link" class="nav-login-link $nav.login.2"
|
href="$nav.directory.0" title="$nav.directory.1">$nav.directory.1</a></li>
|
||||||
href="$nav.login.0" title="$nav.login.3" >$nav.login.1</a>
|
<li><a id="nav-search-link" class="nav-link $nav.search.2"
|
||||||
|
href="$nav.search.0" title="$nav.search.1">$nav.search.1</a></li>
|
||||||
|
{{ if $nav.apps }}
|
||||||
|
<li><a id="nav-apps-link" class="nav-link $nav.apps.2"
|
||||||
|
href="$nav.apps.0" title="$nav.apps.1">$nav.apps.1</a></li>
|
||||||
{{ endif }}
|
{{ endif }}
|
||||||
</div>
|
{{ if $nav.help }}
|
||||||
|
<li><a id="nav-help-link" class="nav-link $nav.help.2"
|
||||||
|
href="$nav.help.0" title="$nav.help.1">$nav.help.1</a></li>
|
||||||
|
{{ endif }}
|
||||||
|
</ul>
|
||||||
|
|
||||||
<div id="user-menu">
|
<div id="user-menu">
|
||||||
<a id="user-menu-label" onclick="openClose('user-menu-popup'); return false" href="$nav.home.0">$sitelocation</a>
|
<a id="user-menu-label" onclick="openClose('user-menu-popup'); return false" href="$nav.home.0">$sitelocation</a>
|
||||||
|
|
|
@ -8,11 +8,22 @@
|
||||||
/* from html5boilerplate */
|
/* from html5boilerplate */
|
||||||
|
|
||||||
/* these are to tell browsers they should be displayed a certain way */
|
/* these are to tell browsers they should be displayed a certain way */
|
||||||
article, aside, details, figcaption, figure, footer,
|
article,
|
||||||
header, hgroup, nav, section {
|
aside,
|
||||||
|
details,
|
||||||
|
figcaption,
|
||||||
|
figure,
|
||||||
|
footer,
|
||||||
|
header,
|
||||||
|
hgroup,
|
||||||
|
nav,
|
||||||
|
section {
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
audio, canvas, video, time {
|
audio,
|
||||||
|
canvas,
|
||||||
|
video,
|
||||||
|
time {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
*display: inline;
|
*display: inline;
|
||||||
*zoom: 1;
|
*zoom: 1;
|
||||||
|
@ -45,7 +56,11 @@ body {
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
line-height: 1.1em;
|
line-height: 1.1em;
|
||||||
}
|
}
|
||||||
body, button, input, select, textarea {
|
body,
|
||||||
|
button,
|
||||||
|
input,
|
||||||
|
select,
|
||||||
|
textarea {
|
||||||
font-family: sans-serif;
|
font-family: sans-serif;
|
||||||
color: #eec;
|
color: #eec;
|
||||||
background-color: #2e2f2e;
|
background-color: #2e2f2e;
|
||||||
|
@ -73,6 +88,10 @@ ul, ol {
|
||||||
:focus {
|
:focus {
|
||||||
outline: 0;
|
outline: 0;
|
||||||
}
|
}
|
||||||
|
[disabled="disabled"] {
|
||||||
|
background: #4e4f4f;
|
||||||
|
color: #ddb;
|
||||||
|
}
|
||||||
|
|
||||||
/* remember to highlight inserts somehow! */
|
/* remember to highlight inserts somehow! */
|
||||||
ins {
|
ins {
|
||||||
|
@ -321,8 +340,7 @@ ul#user-menu-popup li a.nav-sep {
|
||||||
border-top: 1px solid #eeeeec;
|
border-top: 1px solid #eeeeec;
|
||||||
}
|
}
|
||||||
nav .nav-link {
|
nav .nav-link {
|
||||||
float: right;
|
display: inline-block;
|
||||||
display: block;
|
|
||||||
width: 22px;
|
width: 22px;
|
||||||
height: 22px;
|
height: 22px;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
@ -481,7 +499,7 @@ nav #nav-notifications-linkmenu.selected .icon.s22.notify {
|
||||||
width: 170px;
|
width: 170px;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: -19px;
|
top: -19px;
|
||||||
left: 7px;
|
left: 4px;
|
||||||
}
|
}
|
||||||
#nav-floater {
|
#nav-floater {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
|
@ -499,11 +517,13 @@ nav #nav-notifications-linkmenu.selected .icon.s22.notify {
|
||||||
clear: both;
|
clear: both;
|
||||||
list-style: none;
|
list-style: none;
|
||||||
padding: 0px;
|
padding: 0px;
|
||||||
margin: 0 7px 0 0;
|
margin: 0px;
|
||||||
height: 25px;
|
height: 25px;
|
||||||
}
|
}
|
||||||
#nav-buttons li {
|
#nav-buttons li {
|
||||||
padding: 0;
|
padding: 0;
|
||||||
|
display: inline-block;
|
||||||
|
margin: 0px -4px 0px 0px;
|
||||||
}
|
}
|
||||||
.floaterflip {
|
.floaterflip {
|
||||||
display: block;
|
display: block;
|
||||||
|
|
|
@ -2,48 +2,52 @@
|
||||||
|
|
||||||
<span id="banner">$banner</span>
|
<span id="banner">$banner</span>
|
||||||
|
|
||||||
<!-- yes, they're going the other way. seems that's how the template renderer
|
|
||||||
works -->
|
|
||||||
<a name="top" id="top"></a>
|
<a name="top" id="top"></a>
|
||||||
<div id="nav-floater">
|
<div id="nav-floater">
|
||||||
<div id="nav-buttons">
|
<ul id="nav-buttons">
|
||||||
{{ if $nav.help }}
|
{{ if $nav.login }}
|
||||||
<a id="nav-help-link" class="nav-link $nav.help.2" href="$nav.help.0" title="$nav.help.1">$nav.help.1</a>
|
<li><a id="nav-login-link" class="nav-login-link $nav.login.2"
|
||||||
|
href="$nav.login.0" title="$nav.login.3" >$nav.login.1</a></li>
|
||||||
{{ endif }}
|
{{ endif }}
|
||||||
{{ if $nav.community }}
|
{{ if $nav.home }}
|
||||||
<a id="nav-community-link" class="nav-link $nav.community.2"
|
<li><a id="nav-home-link" class="nav-link $nav.home.2"
|
||||||
href="$nav.community.0" title="$nav.community.1">$nav.community.1</a>
|
href="$nav.home.0" title="$nav.home.1">$nav.home.1</a></li>
|
||||||
{{ endif }}
|
{{ endif }}
|
||||||
{{ if $nav.apps }}
|
{{ if $nav.network }}
|
||||||
<a id="nav-apps-link" class="nav-link $nav.apps.2" href="$nav.apps.0" title="$nav.apps.1">$nav.apps.1</a>
|
<li><a id="nav-network-link" class="nav-link $nav.network.2"
|
||||||
{{ endif }}
|
href="$nav.network.0" title="$nav.network.1">$nav.network.1</a></li>
|
||||||
<a id="nav-directory-link" class="nav-link $nav.directory.2" href="$nav.directory.0" title="$nav.directory.1">$nav.directory.1</a>
|
|
||||||
<a id="nav-search-link" class="nav-link $nav.search.2" href="$nav.search.0" title="$nav.search.1">$nav.search.1</a>
|
|
||||||
{{ if $nav.messages }}
|
|
||||||
<a id="nav-messages-link" class="nav-link $nav.messages.2"
|
|
||||||
href="$nav.messages.0" title="$nav.messages.1">$nav.messages.1</a>
|
|
||||||
{{ endif }}
|
{{ endif }}
|
||||||
{{ if $nav.notifications }}
|
{{ if $nav.notifications }}
|
||||||
<a id="nav-notifications-linkmenu" class="nav-link $nav.notifications.2" href="$nav.notifications.0" rel="#nav-notifications-menu" title="$nav.notifications.1">$nav.notifications.1</a>
|
<li><a id="nav-notifications-linkmenu" class="nav-link $nav.notifications.2"
|
||||||
|
href="$nav.notifications.0"
|
||||||
|
rel="#nav-notifications-menu" title="$nav.notifications.1">$nav.notifications.1</a></li>
|
||||||
<ul id="nav-notifications-menu" class="menu-popup">
|
<ul id="nav-notifications-menu" class="menu-popup">
|
||||||
<li id="nav-notifications-see-all"><a href="$nav.notifications.all.0">$nav.notifications.all.1</a></li>
|
<li id="nav-notifications-see-all"><a href="$nav.notifications.all.0">$nav.notifications.all.1</a></li>
|
||||||
<li id="nav-notifications-mark-all"><a href="#" onclick="notifyMarkAll(); return false;">$nav.notifications.mark.1</a></li>
|
<li id="nav-notifications-mark-all"><a href="#" onclick="notifyMarkAll(); return false;">$nav.notifications.mark.1</a></li>
|
||||||
<li class="empty">$emptynotifications</li>
|
<li class="empty">$emptynotifications</li>
|
||||||
</ul>
|
</ul>
|
||||||
{{ endif }}
|
{{ endif }}
|
||||||
{{ if $nav.network }}
|
{{ if $nav.messages }}
|
||||||
<a id="nav-network-link" class="nav-link $nav.network.2"
|
<li><a id="nav-messages-link" class="nav-link $nav.messages.2"
|
||||||
href="$nav.network.0" title="$nav.network.1">$nav.network.1</a>
|
href="$nav.messages.0" title="$nav.messages.1">$nav.messages.1</a></li>
|
||||||
{{ endif }}
|
{{ endif }}
|
||||||
{{ if $nav.home }}
|
{{ if $nav.community }}
|
||||||
<a id="nav-home-link" class="nav-link $nav.home.2"
|
<li><a id="nav-community-link" class="nav-link $nav.community.2"
|
||||||
href="$nav.home.0" title="$nav.home.1">$nav.home.1</a>
|
href="$nav.community.0" title="$nav.community.1">$nav.community.1</a></li>
|
||||||
{{ endif }}
|
{{ endif }}
|
||||||
{{ if $nav.login }}
|
<li><a id="nav-directory-link" class="nav-link $nav.directory.2"
|
||||||
<a id="nav-login-link" class="nav-login-link $nav.login.2"
|
href="$nav.directory.0" title="$nav.directory.1">$nav.directory.1</a></li>
|
||||||
href="$nav.login.0" title="$nav.login.3" >$nav.login.1</a>
|
<li><a id="nav-search-link" class="nav-link $nav.search.2"
|
||||||
|
href="$nav.search.0" title="$nav.search.1">$nav.search.1</a></li>
|
||||||
|
{{ if $nav.apps }}
|
||||||
|
<li><a id="nav-apps-link" class="nav-link $nav.apps.2"
|
||||||
|
href="$nav.apps.0" title="$nav.apps.1">$nav.apps.1</a></li>
|
||||||
{{ endif }}
|
{{ endif }}
|
||||||
</div>
|
{{ if $nav.help }}
|
||||||
|
<li><a id="nav-help-link" class="nav-link $nav.help.2"
|
||||||
|
href="$nav.help.0" title="$nav.help.1">$nav.help.1</a></li>
|
||||||
|
{{ endif }}
|
||||||
|
</ul>
|
||||||
|
|
||||||
<div id="user-menu">
|
<div id="user-menu">
|
||||||
<a id="user-menu-label" onclick="openClose('user-menu-popup'); return false" href="$nav.home.0">$sitelocation</a>
|
<a id="user-menu-label" onclick="openClose('user-menu-popup'); return false" href="$nav.home.0">$sitelocation</a>
|
||||||
|
|
|
@ -340,8 +340,7 @@ ul#user-menu-popup li a.nav-sep {
|
||||||
border-top: 1px solid #eeeeec;
|
border-top: 1px solid #eeeeec;
|
||||||
}
|
}
|
||||||
nav .nav-link {
|
nav .nav-link {
|
||||||
float: right;
|
display: inline-block;
|
||||||
display: block;
|
|
||||||
width: 22px;
|
width: 22px;
|
||||||
height: 22px;
|
height: 22px;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
@ -500,7 +499,7 @@ nav #nav-notifications-linkmenu.selected .icon.s22.notify {
|
||||||
width: 170px;
|
width: 170px;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: -19px;
|
top: -19px;
|
||||||
left: 7px;
|
left: 4px;
|
||||||
}
|
}
|
||||||
#nav-floater {
|
#nav-floater {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
|
@ -518,11 +517,13 @@ nav #nav-notifications-linkmenu.selected .icon.s22.notify {
|
||||||
clear: both;
|
clear: both;
|
||||||
list-style: none;
|
list-style: none;
|
||||||
padding: 0px;
|
padding: 0px;
|
||||||
margin: 0 7px 0 0;
|
margin: 0px;
|
||||||
height: 25px;
|
height: 25px;
|
||||||
}
|
}
|
||||||
#nav-buttons li {
|
#nav-buttons li {
|
||||||
padding: 0;
|
padding: 0;
|
||||||
|
display: inline-block;
|
||||||
|
margin: 0px -4px 0px 0px;
|
||||||
}
|
}
|
||||||
.floaterflip {
|
.floaterflip {
|
||||||
display: block;
|
display: block;
|
||||||
|
|
Loading…
Reference in a new issue