Merge pull request #2991 from emanuelschuetze/css-fixes
CSS improvements for projector sidebar on small devices.
This commit is contained in:
commit
4d3a45c8fb
@ -309,14 +309,18 @@ img {
|
|||||||
float: left;
|
float: left;
|
||||||
}
|
}
|
||||||
|
|
||||||
#content .col1.min { /*with maximized sidebar*/
|
#content .col1.sidebar-max { /*with maximized sidebar*/
|
||||||
width: calc(100% - 330px);
|
width: calc(100% - 330px);
|
||||||
}
|
}
|
||||||
|
|
||||||
#content .col1.max { /*with minimized sidebar*/
|
#content .col1.sidebar-min { /*with minimized sidebar*/
|
||||||
width: calc(100% - 70px);
|
width: calc(100% - 70px);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#content .col1.sidebar-none { /*without sidebar*/
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
.col1 .header {
|
.col1 .header {
|
||||||
background: #fff;
|
background: #fff;
|
||||||
border: 1px solid #d3d3d3;
|
border: 1px solid #d3d3d3;
|
||||||
@ -730,13 +734,16 @@ img {
|
|||||||
margin-bottom: 20px;
|
margin-bottom: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#content .col2.max {
|
#content .col2.sidebar-max {
|
||||||
width: 330px;
|
width: 330px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#content .col2.min {
|
#content .col2.sidebar-min {
|
||||||
width: 70px;
|
width: 70px;
|
||||||
}
|
}
|
||||||
|
#content .col2.sidebar-none {
|
||||||
|
width: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
#content .col2 h4 {
|
#content .col2 h4 {
|
||||||
font-size: 22px;
|
font-size: 22px;
|
||||||
@ -1717,16 +1724,18 @@ tr.selected td {
|
|||||||
#content .containerOS {
|
#content .containerOS {
|
||||||
padding: 0;
|
padding: 0;
|
||||||
}
|
}
|
||||||
#content .col2.max {
|
#content .col2 {
|
||||||
|
position: relative !important;
|
||||||
|
margin-top: -20px;
|
||||||
|
}
|
||||||
|
#content .col2.sidebar-max {
|
||||||
|
width: 296px;
|
||||||
|
}
|
||||||
|
#content .col2 .projector_full, #content .col2 .projector_min {
|
||||||
|
margin-left: 0;
|
||||||
|
}
|
||||||
|
#content .col1.sidebar-min, #content .col1.sidebar-max {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
position: absolute !important;
|
|
||||||
left: 0;
|
|
||||||
}
|
|
||||||
#content .col1.min {
|
|
||||||
width: calc(100% - 70px);
|
|
||||||
}
|
|
||||||
.col2 .projector_full {
|
|
||||||
margin-left: 0px;
|
|
||||||
}
|
}
|
||||||
#groups-table .perm-head {
|
#groups-table .perm-head {
|
||||||
width: 150px;
|
width: 150px;
|
||||||
|
@ -175,7 +175,10 @@
|
|||||||
<!-- Content -->
|
<!-- Content -->
|
||||||
<div id="content" ng-controller="ProjectorSidebarCtrl">
|
<div id="content" ng-controller="ProjectorSidebarCtrl">
|
||||||
<div class="containerOS">
|
<div class="containerOS">
|
||||||
<div class="col1" ng-class="(isProjectorSidebar && operator.hasPerms('core.can_see_projector')) ? 'min' : 'max'">
|
<div class="col1" 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') }">
|
||||||
<!-- dynamic views -->
|
<!-- dynamic views -->
|
||||||
<div ui-view ng-if="openslidesBootstrapDone && baseViewPermissionsGranted"></div>
|
<div ui-view ng-if="openslidesBootstrapDone && baseViewPermissionsGranted"></div>
|
||||||
<!-- footer -->
|
<!-- footer -->
|
||||||
@ -184,8 +187,10 @@
|
|||||||
<a ui-sref="legalnotice" translate>Legal notice</a>
|
<a ui-sref="legalnotice" translate>Legal notice</a>
|
||||||
</div><!--end footer-->
|
</div><!--end footer-->
|
||||||
</div>
|
</div>
|
||||||
<div id="sidebar" class="col2" os-perms="core.can_see_projector"
|
<div id="sidebar" class="col2" os-perms="core.can_see_projector" ng-class="{
|
||||||
ng-class="(isProjectorSidebar && operator.hasPerms('core.can_see_projector')) ? 'max' : 'min'"
|
'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()">
|
ng-init="initSidebar()">
|
||||||
<!-- sidebar maximized -->
|
<!-- sidebar maximized -->
|
||||||
<div class="projector_full" ng-if="isProjectorSidebar">
|
<div class="projector_full" ng-if="isProjectorSidebar">
|
||||||
|
Loading…
Reference in New Issue
Block a user