Commit 7f843f61071308e96d7fcb9ebd971b04d741c338
Committed by
Igor Kulikov
1 parent
cd213bfe
Improve fix title (#1823)
Showing
3 changed files
with
20 additions
and
15 deletions
... | ... | @@ -24,30 +24,34 @@ div.tb-widget { |
24 | 24 | |
25 | 25 | transition: all .2s ease-in-out; |
26 | 26 | |
27 | - .tb-widget-header{ | |
28 | - display: flex; | |
29 | - align-items: start; | |
30 | - justify-content: space-between; | |
31 | - } | |
32 | - | |
33 | 27 | .tb-widget-title { |
34 | - display: block; | |
35 | - max-height: 75px; | |
28 | + max-height: 60px; | |
36 | 29 | padding-top: 5px; |
37 | 30 | padding-left: 5px; |
38 | 31 | overflow: hidden; |
39 | - text-overflow: ellipsis; | |
40 | 32 | |
41 | 33 | tb-timewindow { |
42 | 34 | font-size: 14px; |
43 | 35 | opacity: .85; |
44 | 36 | } |
37 | + | |
38 | + .title{ | |
39 | + width: 100%; | |
40 | + overflow: hidden; | |
41 | + text-overflow: ellipsis; | |
42 | + } | |
45 | 43 | } |
46 | 44 | |
47 | 45 | .tb-widget-actions { |
48 | 46 | z-index: 19; |
49 | 47 | margin: 0; |
50 | 48 | |
49 | + &-absolute{ | |
50 | + position: absolute; | |
51 | + top: 8px; | |
52 | + right: 8px; | |
53 | + } | |
54 | + | |
51 | 55 | .md-button.md-icon-button { |
52 | 56 | width: 32px; |
53 | 57 | min-width: 32px; | ... | ... |
... | ... | @@ -44,13 +44,14 @@ |
44 | 44 | ng-click="vm.widgetClicked($event, widget)" |
45 | 45 | tb-contextmenu="vm.openWidgetContextMenu($event, widget, $mdOpenMousepointMenu)" |
46 | 46 | ng-style="vm.widgetStyle(widget)"> |
47 | - <div class="tb-widget-header"> | |
47 | + <div layout="row" layout-align="space-between start"> | |
48 | 48 | <div class="tb-widget-title" layout="column" layout-align="center start" ng-show="vm.showWidgetTitlePanel(widget)"> |
49 | 49 | <div ng-if="vm.hasWidgetTitleTemplate(widget)" ng-include="vm.widgetTitleTemplate(widget)"></div> |
50 | - <span ng-show="vm.showWidgetTitle(widget)" ng-style="vm.widgetTitleStyle(widget)" class="md-subhead">{{vm.widgetTitle(widget)}}</span> | |
50 | + <span ng-show="vm.showWidgetTitle(widget)" ng-style="vm.widgetTitleStyle(widget)" class="md-subhead title">{{vm.widgetTitle(widget)}}</span> | |
51 | 51 | <tb-timewindow aggregation="{{vm.hasAggregation(widget)}}" ng-if="vm.hasTimewindow(widget)" ng-model="widget.config.timewindow"></tb-timewindow> |
52 | 52 | </div> |
53 | - <div class="tb-widget-actions" layout="row" layout-align="start center" ng-show="vm.showWidgetActions(widget)" tb-mousedown="$event.stopPropagation()"> | |
53 | + <div class="tb-widget-actions" layout="row" layout-align="start center" ng-show="vm.showWidgetActions(widget)" tb-mousedown="$event.stopPropagation()" | |
54 | + ng-class="{'tb-widget-actions-absolute': !vm.showWidgetTitlePanel(widget) && !(vm.hasWidgetTitleTemplate(widget)||vm.showWidgetTitle(widget)||vm.hasAggregation(widget))}"> | |
54 | 55 | <md-button ng-repeat="action in vm.customWidgetHeaderActions(widget)" |
55 | 56 | aria-label="{{action.displayName}}" |
56 | 57 | ng-show="!vm.isEdit" | ... | ... |
... | ... | @@ -16,7 +16,7 @@ |
16 | 16 | |
17 | 17 | --> |
18 | 18 | <section class="tb-timewindow" layout='row' layout-align="start center"> |
19 | - <md-button ng-if="direction === 'left'" ng-disabled="disabled" class="md-icon-button" aria-label="{{ 'timewindow.edit' | translate }}" ng-click="openEditMode($event)"> | |
19 | + <md-button ng-if="direction === 'left'" ng-disabled="disabled" class="md-icon-button tb-md-32" aria-label="{{ 'timewindow.edit' | translate }}" ng-click="openEditMode($event)"> | |
20 | 20 | <md-tooltip md-direction="{{tooltipDirection}}"> |
21 | 21 | {{ 'timewindow.edit' | translate }} |
22 | 22 | </md-tooltip> |
... | ... | @@ -28,10 +28,10 @@ |
28 | 28 | </md-tooltip> |
29 | 29 | {{model.displayValue}} |
30 | 30 | </span> |
31 | - <md-button ng-if="direction === 'right'" ng-disabled="disabled" class="md-icon-button" aria-label="{{ 'timewindow.edit' | translate }}" ng-click="openEditMode($event)"> | |
31 | + <md-button ng-if="direction === 'right'" ng-disabled="disabled" class="md-icon-button tb-md-32" aria-label="{{ 'timewindow.edit' | translate }}" ng-click="openEditMode($event)"> | |
32 | 32 | <md-tooltip md-direction="{{tooltipDirection}}"> |
33 | 33 | {{ 'timewindow.edit' | translate }} |
34 | 34 | </md-tooltip> |
35 | 35 | <ng-md-icon aria-label="{{ 'timewindow.date-range' | translate }}" icon="query_builder"></ng-md-icon> |
36 | 36 | </md-button> |
37 | -</section> | |
\ No newline at end of file | ||
37 | +</section> | ... | ... |