MOBILE-4565 timeline: Action button will be shown on the next line
parent
e87b05bd69
commit
a471bf24cc
|
@ -16,14 +16,11 @@
|
|||
<ion-item class="addon-block-timeline-activity" [detail]="false" (click)="action($event, event.url)" [attr.aria-label]="event.name"
|
||||
button lines="full">
|
||||
<ion-label>
|
||||
<ion-row class="ion-justify-content-between ion-align-items-center ion-no-padding">
|
||||
<ion-col class="addon-block-timeline-activity-main ion-no-padding">
|
||||
<ion-row class="ion-justify-content-between ion-align-items-center ion-nowrap ion-no-padding">
|
||||
<ion-col class="addon-block-timeline-activity-time ion-no-padding ion-text-nowrap">
|
||||
<small>{{event.timesort * 1000 | coreFormatDate:"strftimetime24" }}</small>
|
||||
<core-mod-icon *ngIf="event.iconUrl" [modicon]="event.iconUrl" [componentId]="event.instance"
|
||||
[modname]="event.modulename" [purpose]="event.purpose" [colorize]="colorizeIcons"
|
||||
[isBranded]="event.branded" />
|
||||
[modname]="event.modulename" [purpose]="event.purpose" [colorize]="colorizeIcons" [isBranded]="event.branded" />
|
||||
</ion-col>
|
||||
<ion-col class="addon-block-timeline-activity-name ion-no-padding">
|
||||
<p class="item-heading">
|
||||
|
@ -48,16 +45,14 @@
|
|||
</p>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
</ion-col>
|
||||
<ion-col class="addon-block-timeline-activity-action ion-no-padding" *ngIf="event.action && event.action.actionable">
|
||||
<div class="addon-block-timeline-activity-action" *ngIf="event.action && event.action.actionable">
|
||||
<ion-button fill="outline" (click)="action($event, event.action.url)" [title]="event.action.name" class="chip">
|
||||
{{event.action.name}}
|
||||
<ion-badge slot="end" class="ion-margin-start" *ngIf="event.action.showitemcount">
|
||||
{{event.action.itemcount}}
|
||||
</ion-badge>
|
||||
</ion-button>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
</div>
|
||||
</ion-label>
|
||||
</ion-item>
|
||||
</ng-container>
|
||||
|
|
|
@ -27,26 +27,22 @@ h4.core-bold {
|
|||
--margin-end: 0.5rem;
|
||||
--margin-vertical: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.addon-block-timeline-activity-time {
|
||||
flex-grow: 0;
|
||||
}
|
||||
ion-label {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.addon-block-timeline-activity-action {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.addon-block-timeline-activity-main,
|
||||
.addon-block-timeline-activity-name {
|
||||
flex-grow: 1;
|
||||
p {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
|
||||
.addon-block-timeline-activity-time {
|
||||
flex-grow: 0;
|
||||
}
|
||||
|
||||
.addon-block-timeline-activity-name {
|
||||
flex-grow: 1;
|
||||
overflow: hidden;
|
||||
|
|
Loading…
Reference in New Issue