Commit 696cb331561e51539cea33c3889d78e60329d5dc

Authored by Igor Kulikov
1 parent 9668b8a2

UI: Layout improvements/fixes

... ... @@ -35,12 +35,12 @@
35 35 "angular-sanitize": "1.5.8",
36 36 "angular-storage": "0.0.15",
37 37 "angular-touch": "1.5.8",
38   - "angular-translate": "^2.12.1",
39   - "angular-translate-handler-log": "^2.12.1",
40   - "angular-translate-interpolation-messageformat": "^2.12.1",
41   - "angular-translate-loader-static-files": "^2.12.1",
42   - "angular-translate-storage-cookie": "^2.12.1",
43   - "angular-translate-storage-local": "^2.12.1",
  38 + "angular-translate": "2.13.1",
  39 + "angular-translate-handler-log": "2.13.1",
  40 + "angular-translate-interpolation-messageformat": "2.13.1",
  41 + "angular-translate-loader-static-files": "2.13.1",
  42 + "angular-translate-storage-cookie": "2.13.1",
  43 + "angular-translate-storage-local": "2.13.1",
44 44 "angular-ui-ace": "^0.2.3",
45 45 "angular-ui-router": "^0.3.1",
46 46 "angular-websocket": "^2.0.1",
... ...
... ... @@ -66,6 +66,12 @@ function Timewindow($compile, $templateCache, $filter, $mdPanel, $document, $mdM
66 66
67 67 scope.aggregation = angular.isDefined(attrs.aggregation);
68 68
  69 + scope.isToolbar = angular.isDefined(attrs.isToolbar);
  70 +
  71 + scope.hideLabel = function() {
  72 + return scope.isToolbar && !$mdMedia('gt-sm');
  73 + }
  74 +
69 75 var translationPending = false;
70 76
71 77 $translate.onReady(function() {
... ...
... ... @@ -22,7 +22,7 @@
22 22 </md-tooltip>
23 23 <ng-md-icon aria-label="{{ 'timewindow.date-range' | translate }}" icon="query_builder"></ng-md-icon>
24 24 </md-button>
25   - <span ng-click="openEditMode($event)">
  25 + <span ng-hide="hideLabel()" ng-click="openEditMode($event)">
26 26 <md-tooltip md-direction="{{tooltipDirection}}">
27 27 {{ 'timewindow.edit' | translate }}
28 28 </md-tooltip>
... ...
... ... @@ -23,7 +23,7 @@
23 23 </md-tooltip>
24 24 <md-icon aria-label="{{ 'dashboard.select-devices' | translate }}" class="material-icons">devices_other</md-icon>
25 25 </md-button>
26   - <span ng-click="openEditMode($event)">
  26 + <span hide-xs hide-sm ng-click="openEditMode($event)">
27 27 <md-tooltip md-direction="{{tooltipDirection}}">
28 28 {{ 'dashboard.select-devices' | translate }}
29 29 </md-tooltip>
... ...
... ... @@ -27,7 +27,7 @@ import aliasesDeviceSelectPanelTemplate from './aliases-device-select-panel.tpl.
27 27
28 28 /* eslint-disable angular/angularelement */
29 29 /*@ngInject*/
30   -export default function AliasesDeviceSelectDirective($compile, $templateCache, types, $mdPanel, $document, $translate) {
  30 +export default function AliasesDeviceSelectDirective($compile, $templateCache, $mdMedia, types, $mdPanel, $document, $translate) {
31 31
32 32 var linker = function (scope, element, attrs, ngModelCtrl) {
33 33
... ... @@ -51,7 +51,7 @@ export default function AliasesDeviceSelectDirective($compile, $templateCache, t
51 51 return;
52 52 }
53 53 var position;
54   - var panelHeight = 250;
  54 + var panelHeight = $mdMedia('min-height: 350px') ? 250 : 150;
55 55 var panelWidth = 300;
56 56 var offset = element[0].getBoundingClientRect();
57 57 var bottomY = offset.bottom - $(window).scrollTop(); //eslint-disable-line
... ... @@ -64,7 +64,7 @@ export default function AliasesDeviceSelectDirective($compile, $templateCache, t
64 64 yPosition = $mdPanel.yPosition.BELOW;
65 65 }
66 66 if (leftX + panelWidth > $( window ).width()) { //eslint-disable-line
67   - xPosition = $mdPanel.xPosition.ALIGN_END;
  67 + xPosition = $mdPanel.xPosition.CENTER;
68 68 } else {
69 69 xPosition = $mdPanel.xPosition.ALIGN_START;
70 70 }
... ...
... ... @@ -21,7 +21,10 @@
21 21 }
22 22
23 23 .tb-aliases-device-select-panel {
24   - max-height: 250px;
  24 + max-height: 150px;
  25 + @media (min-height: 350px) {
  26 + max-height: 250px;
  27 + }
25 28 min-width: 300px;
26 29 background: white;
27 30 border-radius: 4px;
... ...
... ... @@ -49,7 +49,7 @@
49 49 </md-button>
50 50 <tb-user-menu ng-show="forceFullscreen" display-user-info="true">
51 51 </tb-user-menu>
52   - <tb-timewindow direction="left" tooltip-direction="bottom" aggregation ng-model="vm.dashboardConfiguration.timewindow">
  52 + <tb-timewindow is-toolbar direction="left" tooltip-direction="bottom" aggregation ng-model="vm.dashboardConfiguration.timewindow">
53 53 </tb-timewindow>
54 54 <tb-aliases-device-select ng-show="!vm.isEdit"
55 55 tooltip-direction="bottom"
... ...
... ... @@ -41,7 +41,7 @@
41 41 <div flex layout="column" tabIndex="-1" role="main">
42 42 <md-toolbar class="md-whiteframe-z1 tb-primary-toolbar" ng-class="{'md-hue-1': vm.displaySearchMode()}">
43 43 <div layout="row" flex class="md-toolbar-tools">
44   - <md-button id="main" hide-gt-sm
  44 + <md-button id="main" hide-gt-sm ng-show="!forceFullscreen"
45 45 class="md-icon-button" ng-click="vm.openSidenav()" aria-label="{{ 'home.menu' | translate }}" ng-class="{'tb-invisible': vm.displaySearchMode()}">
46 46 <md-icon aria-label="{{ 'home.menu' | translate }}" class="material-icons">menu</md-icon>
47 47 </md-button>
... ...