diff --git a/browser/components/SideNavFilter.styl b/browser/components/SideNavFilter.styl
index bad5661b4..b7fd7dc67 100644
--- a/browser/components/SideNavFilter.styl
+++ b/browser/components/SideNavFilter.styl
@@ -102,4 +102,4 @@ body[data-theme="dark"]
background-color alpha($ui-dark-button--active-backgroundColor, 50%)
color $ui-favorite-star-button-color
.menu-button-label
- color $ui-dark-text-color
\ No newline at end of file
+ color $ui-dark-text-color
diff --git a/browser/main/SideNav/SideNav.styl b/browser/main/SideNav/SideNav.styl
index f3de5803b..586692871 100644
--- a/browser/main/SideNav/SideNav.styl
+++ b/browser/main/SideNav/SideNav.styl
@@ -15,7 +15,8 @@
navButtonColor()
position absolute
top 22px
- right 5px
+ left 200px
+ height 23px
&:hover
color $ui-text-color
&:active, &:active:hover
@@ -49,6 +50,7 @@
.top-menu-label
margin-left 5px
overflow ellipsis
+ opacity 0
.tabBody
flex 1
@@ -65,6 +67,40 @@
overflow-y auto
flex: 1
+.root--folded
+ height 100vh
+ width $sideNav--folded-width
+ .switch-buttons
+ display none
+ .top
+ height 60px
+ .top-menu
+ position static
+ width $sideNav--folded-width
+ height 60px
+ text-align center
+ &:hover .top-menu-label
+ transition opacity 0.15s
+ opacity 1
+ .top-menu-label
+ position fixed
+ display inline-block
+ height 30px
+ left $sideNav--folded-width
+ padding 0 10px
+ margin-top -8px
+ opacity 0
+ margin-left 0
+ overflow hidden
+ background-color $ui-tooltip-backgroundColor
+ z-index 10
+ color white
+ line-height 30px
+ border-top-right-radius 2px
+ border-bottom-right-radius 2px
+ pointer-events none
+ font-size 12px
+
body[data-theme="dark"]
.root, .root--folded
border-color $ui-dark-borderColor
diff --git a/browser/main/SideNav/index.js b/browser/main/SideNav/index.js
index 9fe198ad4..d93eb87e2 100644
--- a/browser/main/SideNav/index.js
+++ b/browser/main/SideNav/index.js
@@ -150,6 +150,7 @@ class SideNav extends React.Component {
onClick={(e) => this.handleMenuButtonClick(e)}
>
+ Preferences