From 542cb67d59e7f909accdd3a9adbe180f2df0d17d Mon Sep 17 00:00:00 2001
From: FinnStutzenstein <finn.stutzenstein@hotmail.de>
Date: Fri, 17 Mar 2017 10:52:54 +0100
Subject: [PATCH] Fixing the sidebar, fixes #3068

---
 openslides/core/static/css/app.css          |  5 +-
 openslides/core/static/js/core/site.js      |  8 +--
 openslides/core/static/templates/index.html | 59 +++++++++++----------
 3 files changed, 36 insertions(+), 36 deletions(-)

diff --git a/openslides/core/static/css/app.css b/openslides/core/static/css/app.css
index 538b71cf8..2338f9f4b 100644
--- a/openslides/core/static/css/app.css
+++ b/openslides/core/static/css/app.css
@@ -558,6 +558,7 @@ img {
     max-width: 150px;
     left: -45px;
     margin-top: -8px !important;
+    z-index: 10000;
 }
 /* special hack for firefox only (see issue#2967) */
 @-moz-document url-prefix() {
@@ -722,14 +723,12 @@ img {
 
 /** Projector sidebar column **/
 
-#content .col2 { /*TODO*/
+#content .col2 {
     float: right;
     position: relative;
     display: inline-flex;
     z-index: 3;
     margin-bottom: 20px;
-    top: 0px;
-    right: 0px;
 }
 
 #sidebar-xs {
diff --git a/openslides/core/static/js/core/site.js b/openslides/core/static/js/core/site.js
index 0916d0776..39de51a4a 100644
--- a/openslides/core/static/js/core/site.js
+++ b/openslides/core/static/js/core/site.js
@@ -887,17 +887,17 @@ angular.module('OpenSlidesApp.core.site', [
                 if ((scrollTop + marginTop + sidebarHeight) > (documentHeight - marginBottom)) {
                     // Stick to the bottom
                     var bottom = marginBottom + scrollTop + windowHeight - documentHeight;
-                    sidebar.css({'position': 'fixed', 'top': '', 'right': '30px', 'bottom': bottom});
+                    sidebar.css({'position': 'fixed', 'top': '', 'bottom': bottom});
                 } else if ((scrollTop + marginTop) > sidebarMinOffset) {
                     // scroll with the user
-                    sidebar.css({'position': 'fixed', 'top': marginTop, 'right': '30px', 'bottom': ''});
+                    sidebar.css({'position': 'fixed', 'top': marginTop, 'bottom': ''});
                 } else {
                     // Stick to the top
-                    sidebar.css({'position': 'relative', 'top': 0, 'right': 0, 'bottom': ''});
+                    sidebar.css({'position': 'relative', 'top': 0, 'bottom': ''});
                 }
             } else {
                 // Stick to the top, if the sidebar is larger then the content
-                sidebar.css({'position': 'relative', 'top': 0, 'right': 0, 'bottom': ''});
+                sidebar.css({'position': 'relative', 'top': 0, 'bottom': ''});
             }
         };
 
diff --git a/openslides/core/static/templates/index.html b/openslides/core/static/templates/index.html
index f9dc00860..bb613ef54 100644
--- a/openslides/core/static/templates/index.html
+++ b/openslides/core/static/templates/index.html
@@ -176,35 +176,6 @@
 <div id="content" ng-controller="ProjectorSidebarCtrl">
   <div class="containerOS">
 
-    <!-- col2 -->
-    <div id="sidebar" class="col2" os-perms="core.can_see_projector" ng-class="{
-        'sidebar-max': isProjectorSidebar && operator.hasPerms('core.can_see_projector'),
-        'sidebar-min': !isProjectorSidebar && operator.hasPerms('core.can_see_projector'),
-        'sidebar-none': !operator.hasPerms('core.can_see_projector') }"
-        ng-init="initSidebar()">
-      <!-- sidebar maximized -->
-      <div class="projector_full" ng-if="isProjectorSidebar">
-        <div class="title" ng-click="showProjectorSidebar(false)">
-          <div class="name">
-            <i class="fa fa-video-camera"></i>
-            <translate>Projector</translate>
-          </div>
-          <div class="icon">
-            <i class="fa fa-angle-right"></i>
-          </div>
-        </div>
-        <div ng-include src="'static/templates/core/projector-controls.html'"></div>
-      </div>
-      <!-- sidebar minimized -->
-      <div class="projector_min" ng-if="!isProjectorSidebar">
-        <div class="icon">
-          <a href="" ng-click="showProjectorSidebar(true)">
-            <i class="fa fa-video-camera"></i>
-          </a>
-        </div>
-      </div>
-    </div>
-
     <!-- col2 sidebar-xs (for small devices)-->
     <div id="sidebar-xs" class="col2" os-perms="core.can_see_projector" ng-class="{
         'sidebar-max': isProjectorSidebar && operator.hasPerms('core.can_see_projector'),
@@ -251,6 +222,36 @@
         </div><!--end footer-->
     </div>
 
+    <!-- col2 normal sidebar -->
+    <div id="sidebar" class="col2" os-perms="core.can_see_projector" ng-class="{
+        'sidebar-max': isProjectorSidebar && operator.hasPerms('core.can_see_projector'),
+        'sidebar-min': !isProjectorSidebar && operator.hasPerms('core.can_see_projector'),
+        'sidebar-none': !operator.hasPerms('core.can_see_projector') }"
+        ng-init="initSidebar()">
+      <!-- sidebar maximized -->
+      <div class="projector_full" ng-if="isProjectorSidebar">
+        <div class="title" ng-click="showProjectorSidebar(false)">
+          <div class="name">
+            <i class="fa fa-video-camera"></i>
+            <translate>Projector</translate>
+          </div>
+          <div class="icon">
+            <i class="fa fa-angle-right"></i>
+          </div>
+        </div>
+        <div ng-include src="'static/templates/core/projector-controls.html'"></div>
+      </div>
+      <!-- sidebar minimized -->
+      <div class="projector_min" ng-if="!isProjectorSidebar">
+        <div class="icon">
+          <a href="" ng-click="showProjectorSidebar(true)">
+            <i class="fa fa-video-camera"></i>
+          </a>
+        </div>
+      </div>
+    </div>
+
+
   </div><!--end content-container-->
 </div><!--end content-->