UI: Layout improvements/fixes
This commit is contained in:
		
							parent
							
								
									9668b8a231
								
							
						
					
					
						commit
						696cb33156
					
				@ -35,12 +35,12 @@
 | 
			
		||||
    "angular-sanitize": "1.5.8",
 | 
			
		||||
    "angular-storage": "0.0.15",
 | 
			
		||||
    "angular-touch": "1.5.8",
 | 
			
		||||
    "angular-translate": "^2.12.1",
 | 
			
		||||
    "angular-translate-handler-log": "^2.12.1",
 | 
			
		||||
    "angular-translate-interpolation-messageformat": "^2.12.1",
 | 
			
		||||
    "angular-translate-loader-static-files": "^2.12.1",
 | 
			
		||||
    "angular-translate-storage-cookie": "^2.12.1",
 | 
			
		||||
    "angular-translate-storage-local": "^2.12.1",
 | 
			
		||||
    "angular-translate": "2.13.1",
 | 
			
		||||
    "angular-translate-handler-log": "2.13.1",
 | 
			
		||||
    "angular-translate-interpolation-messageformat": "2.13.1",
 | 
			
		||||
    "angular-translate-loader-static-files": "2.13.1",
 | 
			
		||||
    "angular-translate-storage-cookie": "2.13.1",
 | 
			
		||||
    "angular-translate-storage-local": "2.13.1",
 | 
			
		||||
    "angular-ui-ace": "^0.2.3",
 | 
			
		||||
    "angular-ui-router": "^0.3.1",
 | 
			
		||||
    "angular-websocket": "^2.0.1",
 | 
			
		||||
 | 
			
		||||
@ -66,6 +66,12 @@ function Timewindow($compile, $templateCache, $filter, $mdPanel, $document, $mdM
 | 
			
		||||
 | 
			
		||||
        scope.aggregation = angular.isDefined(attrs.aggregation);
 | 
			
		||||
 | 
			
		||||
        scope.isToolbar = angular.isDefined(attrs.isToolbar);
 | 
			
		||||
 | 
			
		||||
        scope.hideLabel = function() {
 | 
			
		||||
            return scope.isToolbar && !$mdMedia('gt-sm');
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        var translationPending = false;
 | 
			
		||||
 | 
			
		||||
        $translate.onReady(function() {
 | 
			
		||||
 | 
			
		||||
@ -22,7 +22,7 @@
 | 
			
		||||
        </md-tooltip>
 | 
			
		||||
        <ng-md-icon aria-label="{{ 'timewindow.date-range' | translate }}" icon="query_builder"></ng-md-icon>
 | 
			
		||||
    </md-button>
 | 
			
		||||
    <span ng-click="openEditMode($event)">
 | 
			
		||||
    <span ng-hide="hideLabel()" ng-click="openEditMode($event)">
 | 
			
		||||
        <md-tooltip md-direction="{{tooltipDirection}}">
 | 
			
		||||
            {{ 'timewindow.edit' | translate }}
 | 
			
		||||
        </md-tooltip>
 | 
			
		||||
 | 
			
		||||
@ -23,7 +23,7 @@
 | 
			
		||||
        </md-tooltip>
 | 
			
		||||
        <md-icon aria-label="{{ 'dashboard.select-devices' | translate }}" class="material-icons">devices_other</md-icon>
 | 
			
		||||
    </md-button>
 | 
			
		||||
    <span ng-click="openEditMode($event)">
 | 
			
		||||
    <span hide-xs hide-sm ng-click="openEditMode($event)">
 | 
			
		||||
        <md-tooltip md-direction="{{tooltipDirection}}">
 | 
			
		||||
            {{ 'dashboard.select-devices' | translate }}
 | 
			
		||||
        </md-tooltip>
 | 
			
		||||
 | 
			
		||||
@ -27,7 +27,7 @@ import aliasesDeviceSelectPanelTemplate from './aliases-device-select-panel.tpl.
 | 
			
		||||
 | 
			
		||||
/* eslint-disable angular/angularelement */
 | 
			
		||||
/*@ngInject*/
 | 
			
		||||
export default function AliasesDeviceSelectDirective($compile, $templateCache, types, $mdPanel, $document, $translate) {
 | 
			
		||||
export default function AliasesDeviceSelectDirective($compile, $templateCache, $mdMedia, types, $mdPanel, $document, $translate) {
 | 
			
		||||
 | 
			
		||||
    var linker = function (scope, element, attrs, ngModelCtrl) {
 | 
			
		||||
 | 
			
		||||
@ -51,7 +51,7 @@ export default function AliasesDeviceSelectDirective($compile, $templateCache, t
 | 
			
		||||
                return;
 | 
			
		||||
            }
 | 
			
		||||
            var position;
 | 
			
		||||
            var panelHeight = 250;
 | 
			
		||||
            var panelHeight = $mdMedia('min-height: 350px') ? 250 : 150;
 | 
			
		||||
            var panelWidth = 300;
 | 
			
		||||
            var offset = element[0].getBoundingClientRect();
 | 
			
		||||
            var bottomY = offset.bottom - $(window).scrollTop(); //eslint-disable-line
 | 
			
		||||
@ -64,7 +64,7 @@ export default function AliasesDeviceSelectDirective($compile, $templateCache, t
 | 
			
		||||
                yPosition = $mdPanel.yPosition.BELOW;
 | 
			
		||||
            }
 | 
			
		||||
            if (leftX + panelWidth > $( window ).width()) { //eslint-disable-line
 | 
			
		||||
                xPosition = $mdPanel.xPosition.ALIGN_END;
 | 
			
		||||
                xPosition = $mdPanel.xPosition.CENTER;
 | 
			
		||||
            } else {
 | 
			
		||||
                xPosition = $mdPanel.xPosition.ALIGN_START;
 | 
			
		||||
            }
 | 
			
		||||
 | 
			
		||||
@ -21,7 +21,10 @@
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.tb-aliases-device-select-panel {
 | 
			
		||||
  max-height: 250px;
 | 
			
		||||
  max-height: 150px;
 | 
			
		||||
  @media (min-height: 350px) {
 | 
			
		||||
    max-height: 250px;
 | 
			
		||||
  }
 | 
			
		||||
  min-width: 300px;
 | 
			
		||||
  background: white;
 | 
			
		||||
  border-radius: 4px;
 | 
			
		||||
 | 
			
		||||
@ -49,7 +49,7 @@
 | 
			
		||||
                    </md-button>
 | 
			
		||||
                    <tb-user-menu ng-show="forceFullscreen" display-user-info="true">
 | 
			
		||||
                    </tb-user-menu>
 | 
			
		||||
                    <tb-timewindow direction="left" tooltip-direction="bottom" aggregation ng-model="vm.dashboardConfiguration.timewindow">
 | 
			
		||||
                    <tb-timewindow is-toolbar direction="left" tooltip-direction="bottom" aggregation ng-model="vm.dashboardConfiguration.timewindow">
 | 
			
		||||
                    </tb-timewindow>
 | 
			
		||||
                    <tb-aliases-device-select ng-show="!vm.isEdit"
 | 
			
		||||
                                              tooltip-direction="bottom"
 | 
			
		||||
 | 
			
		||||
@ -41,7 +41,7 @@
 | 
			
		||||
  <div flex layout="column" tabIndex="-1" role="main">
 | 
			
		||||
    <md-toolbar class="md-whiteframe-z1 tb-primary-toolbar" ng-class="{'md-hue-1': vm.displaySearchMode()}">
 | 
			
		||||
    	<div layout="row" flex class="md-toolbar-tools">
 | 
			
		||||
		      <md-button id="main" hide-gt-sm
 | 
			
		||||
		      <md-button id="main" hide-gt-sm ng-show="!forceFullscreen"
 | 
			
		||||
		      		class="md-icon-button" ng-click="vm.openSidenav()" aria-label="{{ 'home.menu' | translate }}" ng-class="{'tb-invisible': vm.displaySearchMode()}">
 | 
			
		||||
		      		<md-icon aria-label="{{ 'home.menu' | translate }}" class="material-icons">menu</md-icon>
 | 
			
		||||
		      </md-button>
 | 
			
		||||
 | 
			
		||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user