Merge pull request #3093 from FinnStutzenstein/ProjectorSidebar

Fixing the sidebar
This commit is contained in:
Norman Jäckel 2017-03-20 22:07:14 +01:00 committed by GitHub
commit b6e978f96a
3 changed files with 36 additions and 36 deletions

View File

@ -558,6 +558,7 @@ img {
max-width: 150px; max-width: 150px;
left: -45px; left: -45px;
margin-top: -8px !important; margin-top: -8px !important;
z-index: 10000;
} }
/* special hack for firefox only (see issue#2967) */ /* special hack for firefox only (see issue#2967) */
@-moz-document url-prefix() { @-moz-document url-prefix() {
@ -722,14 +723,12 @@ img {
/** Projector sidebar column **/ /** Projector sidebar column **/
#content .col2 { /*TODO*/ #content .col2 {
float: right; float: right;
position: relative; position: relative;
display: inline-flex; display: inline-flex;
z-index: 3; z-index: 3;
margin-bottom: 20px; margin-bottom: 20px;
top: 0px;
right: 0px;
} }
#sidebar-xs { #sidebar-xs {

View File

@ -887,17 +887,17 @@ angular.module('OpenSlidesApp.core.site', [
if ((scrollTop + marginTop + sidebarHeight) > (documentHeight - marginBottom)) { if ((scrollTop + marginTop + sidebarHeight) > (documentHeight - marginBottom)) {
// Stick to the bottom // Stick to the bottom
var bottom = marginBottom + scrollTop + windowHeight - documentHeight; 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) { } else if ((scrollTop + marginTop) > sidebarMinOffset) {
// scroll with the user // scroll with the user
sidebar.css({'position': 'fixed', 'top': marginTop, 'right': '30px', 'bottom': ''}); sidebar.css({'position': 'fixed', 'top': marginTop, 'bottom': ''});
} else { } else {
// Stick to the top // Stick to the top
sidebar.css({'position': 'relative', 'top': 0, 'right': 0, 'bottom': ''}); sidebar.css({'position': 'relative', 'top': 0, 'bottom': ''});
} }
} else { } else {
// Stick to the top, if the sidebar is larger then the content // 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': ''});
} }
}; };

View File

@ -176,35 +176,6 @@
<div id="content" ng-controller="ProjectorSidebarCtrl"> <div id="content" ng-controller="ProjectorSidebarCtrl">
<div class="containerOS"> <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)--> <!-- col2 sidebar-xs (for small devices)-->
<div id="sidebar-xs" class="col2" os-perms="core.can_see_projector" ng-class="{ <div id="sidebar-xs" class="col2" os-perms="core.can_see_projector" ng-class="{
'sidebar-max': isProjectorSidebar && operator.hasPerms('core.can_see_projector'), 'sidebar-max': isProjectorSidebar && operator.hasPerms('core.can_see_projector'),
@ -251,6 +222,36 @@
</div><!--end footer--> </div><!--end footer-->
</div> </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-container-->
</div><!--end content--> </div><!--end content-->