tighten padding some on menus

This commit is contained in:
Sam 2015-08-30 09:26:02 +10:00
parent aa45429989
commit fa4b00a144
2 changed files with 36 additions and 8 deletions

View File

@ -1,10 +1,11 @@
{{#menu-panel visible=visible}}
<ul class='menu-links'>
<li>{{#link-to 'user' currentUser class="user-activity-link" }}{{i18n 'user.profile'}}{{/link-to}}</li>
<li>{{#link-to 'userActivity.bookmarks' currentUser}}{{i18n 'user.bookmarks'}}{{/link-to}}</li>
<ul class='menu-links-header'>
<li>{{#link-to 'userActivity.bookmarks' currentUser}}<i class='fa fa-bookmark'></i> {{i18n 'user.bookmarks'}}{{/link-to}}</li>
{{#if allowAnon}}
<li><a href {{action 'toggleAnon'}}>{{#if isAnon}}{{i18n 'switch_from_anon'}}{{else}}{{i18n 'switch_to_anon'}}{{/if}}</a></li>
<li><a href {{action 'toggleAnon'}}><i class='fa fa-user-secret'></i> {{#if isAnon}}{{i18n 'switch_from_anon'}}{{else}}{{i18n 'switch_to_anon'}}{{/if}}</a></li>
{{/if}}
<li>{{#link-to 'user' currentUser class="user-activity-link" }}<i class='fa fa-user'></i> {{i18n 'user.profile'}}{{/link-to}}</li>
</ul>
<div class='notifications'>

View File

@ -21,9 +21,9 @@
background-color: $secondary;
z-index: 1100;
overflow: none;
padding: 0.5em 0.5em 0.5em 0.5em;
padding: 0.5em;
width: 300px;
.panel-header {
position: absolute;
right: 20px;
@ -45,7 +45,7 @@
.menu-panel {
ul.menu-links li, ul li.heading {
a {
padding: 0.5em;
padding: 0.25em 0.5em;
display: block;
&:hover {
background-color: dark-light-diff($highlight, $secondary, 50%, -55%);
@ -176,7 +176,7 @@
.icon { color: dark-light-choose(scale-color($primary, $lightness: 30%), scale-color($secondary, $lightness: 70%)); }
li {
background-color: dark-light-diff($tertiary, $secondary, 85%, -65%);
padding: 0.5em;
padding: 0.25em 0.5em;
i {
float: left;
margin-right: 5px;
@ -217,3 +217,30 @@
@include unselectable;
}
}
ul.menu-links-header {
width: 100%;
display: table;
table-layout: fixed;
li:hover {
background-color: dark-light-diff($highlight, $secondary, 50%, -55%);
}
li {
display: table-cell;
width: auto;
text-align: center;
padding: 0.5em 0;
}
li:first-child {
text-align: left;
padding-left: 0.5em;
}
li:last-child {
text-align: right;
padding-right: 0.5em;
}
}