Better fix context-menu position

Fixes mrliptontea#233, mrliptontea#242, mrliptontea#246

src/javascripts/modules/SidebarToggler.js

@@ -32,6 +32,7 @@ PurpleMine.SidebarToggler = (function () {
     this.sidebarVisible = true
     this.sidebarHiding = null
     this.$toggler = null
+    this.$header = $('#header')
     this.$main = $('#main')
     this.$sidebar = $('#sidebar')
     this.lang = document.documentElement.lang
@@ -42,13 +43,6 @@ PurpleMine.SidebarToggler = (function () {
 
     this._ = translations[this.lang]
 
-    // Fix issue with context menu position
-    if (this.$main.css('position') === 'relative') {
-      $(window).on('load', function () {
-        $('#context-menu').appendTo('#wrapper')
-      })
-    }
-
     handleSidebar()
   }
 
@@ -96,7 +90,7 @@ PurpleMine.SidebarToggler = (function () {
       '"></a>'
     instance.$toggler = $(togglerHtml)
 
-    instance.$main.append(instance.$toggler)
+    instance.$header.append(instance.$toggler)
     instance.$toggler.on('click', instance.toggleSidebar)
   }
 

src/sass/components/_context-menu.scss

@@ -8,8 +8,6 @@
   }
 
   #context-menu {
-    position: fixed;
-
     > ul,
     > ul > li > ul {
       @include nice-shadow(2);

src/sass/javascripts/_sidebar-toggler.scss

@@ -1,7 +1,5 @@
 @if $enable-sidebar-toggler {
   #main {
-    position: relative;
-
     // Fix full screen view for dashboard plugin
     // https://github.com/jgraichen/redmine_dashboard
     @at-root .controller-rdb_taskboard & {
@@ -38,9 +36,11 @@
   .sidebar-toggler {
     display: block;
     position: absolute;
-    top: 1px;
+    z-index: 2;
+    bottom: -1px;
     width: 14px;
     height: 16px;
+    transform: translateY(100%);
     border: 2px solid $gray-700;
     border-radius: $border-radius-base;
     background-color: $gray-200;