scinote-eln/scinote-web
1
1
Fork 0
mirror of https://github.com/scinote-eln/scinote-web.git synced 2025-03-05 04:03:45 +08:00
Code Issues Projects Releases Packages Wiki Activity

Restyle left side menu bar so it also works with lower heights

Browse source
This commit is contained in:
Luka Murn 2018-05-27 15:24:49 +02:00
parent 6e6b6803e6
commit 8b527d8a5b
2 changed files with 95 additions and 86 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
app/assets/stylesheets/themes/menu_bar.scss
View file

@ -7,11 +7,17 @@
height: 100%;
left: 0;
overflow-x: hidden;
padding-bottom: 16px;
padding-top: 16px;
position: fixed;
width: 83px;
z-index: 1001;
padding-bottom: 50px;
.scroll-wrapper {
height: 100%;
padding-top: 16px;
width: 83px;
overflow-x: hidden;
}
ul.nav > li {
@ -58,14 +64,15 @@
color: $color-emperor;
}
}
#sideBarButton:hover {
background-color: $color-concrete;
cursor: pointer;
}
}
@media(max-height:480px) {
.menu-bar > ul.nav-bottom {
@media(max-height:510px) {
.menu-bar ul.nav-bottom {
position: relative;
width: auto;
}

2
app/views/shared/_left_menu_bar.html.erb
View file

@ -1,4 +1,5 @@
<div id="left-menu-bar" class="menu-bar">
<div class="scroll-wrapper">
<ul class="nav">
<li class="<%= "active" if projects_are_selected? %>">
<%= link_to projects_path, id: "projects-link", title: t('left_menu_bar.projects') do %>
@ -82,5 +83,6 @@
</li>
</ul>
</div>
</div>
<%= javascript_include_tag("sidebar_toggle") %>