@lifeintelligencegroup/ngx-lig-ari
Version:
Life Intelligence Group Artificial Intelligence
258 lines • 127 kB
JavaScript
import { Component, Input, Output, EventEmitter } from '@angular/core';
import { cloneDeep } from 'lodash-es';
import { reminders, TaskStatus } from '../../model/task.model';
import * as i0 from "@angular/core";
import * as i1 from "../../services/ari-bot.service";
import * as i2 from "@ionic/angular";
import * as i3 from "../ari-svg-icon/ari-svg-icon.component";
import * as i4 from "../ari-loader/ari-loader.component";
import * as i5 from "../ari-chart/ari-chart.component";
import * as i6 from "@angular/common";
import * as i7 from "../../pipes/task-color.pipe";
export class AriTasksComponent {
constructor(ariBotService, cdRef) {
this.ariBotService = ariBotService;
this.cdRef = cdRef;
this.sendSelectionEv = new EventEmitter();
this.sendActionMessageEv = new EventEmitter();
this.reminders = reminders;
this.oneDay = 1000 * 60 * 60 * 24;
this.showActions = false;
this.taskStatus = TaskStatus;
this.showLoading = false;
this.isTask = false;
this.isGoal = false;
}
ngOnInit() {
let response = JSON.parse(this.attachment.content.text);
if (response) {
if (response.CategoryId) {
this.goal = response;
this.isGoal = true;
}
else {
this.task = response;
this.isTask = true;
}
// response.categoryId ? (this.goal = response) : (this.task = response);
}
if (this.attachment.content && this.attachment.content.buttons) {
this.buttonTitle = this.attachment.content.buttons[0].title;
}
this.getGoalIcon();
this.getReminders();
if (this.task) {
this.task.dateString = this.getTaskDate();
this.getTasksStatus();
}
}
onExpand(task) {
this.taskId = task.Id;
task.expanded = !task.expanded;
this.showActions = !this.showActions;
}
getTaskDoneText(doneCount) {
return doneCount > 1 ? 'Tasks Done' : 'Task Done';
}
getTasksStatus() {
switch (this.task.StatusId) {
case TaskStatus.Unscheduled:
this.taskLabelStatus = 'Unscheduled';
break;
case TaskStatus.Later:
this.taskLabelStatus = 'Later';
break;
case TaskStatus.Todo:
this.taskLabelStatus = 'To do';
break;
case TaskStatus.Doing:
this.taskLabelStatus = 'Doing';
break;
case TaskStatus.Done:
this.taskLabelStatus = 'Done';
break;
}
}
getGoalIcon() {
let goal_id;
if (this.isTask) {
goal_id = this.task.Goal.CategoryId;
}
else {
goal_id = this.goal.CategoryId;
}
// this.task
// ? (goal_id = this.task.goal.categoryId)
// : (goal_id = this.goal.categoryId);
switch (goal_id) {
case 1:
this.categoryIcon = 'icon-life';
this.goalCategory = 'Personal Life';
break;
case 2:
this.categoryIcon = 'icon-health';
this.goalCategory = 'Self-care and Wellness';
break;
case 3:
this.categoryIcon = 'icon-work';
this.goalCategory = 'Work and Career';
break;
case 4:
this.categoryIcon = 'icon-finance';
this.goalCategory = 'Financials';
break;
default:
this.categoryIcon = 'icon-life';
this.goalCategory = 'Personal Life';
}
}
sendSelection() {
// console.log("sendSelection", this.attachment.content.buttons[0]);
this.sendSelectionEv.emit(this.attachment.content.buttons[0]);
// this.sendSelectionEv.emit(this.attachment.content.buttons[0].value);
}
getReminders() {
if (this.task && this.task.RemindMe) {
this.reminders.filter((e) => {
if (e.id === this.task.ReminderTimeId) {
this.task.ReminderTime = e.name + ' before';
return e;
}
});
}
}
showStatusActions() {
this.showActions = !this.showActions;
}
async moveTo(status) {
this.showLoading = !this.showLoading;
const taskMoveResponse = await this.ariBotService.taskMoveTo({
statusId: status,
taskId: this.task.Id,
});
if (taskMoveResponse) {
if (taskMoveResponse.data.code === undefined) {
this.task = cloneDeep(taskMoveResponse.data);
this.getReminders();
if (this.task) {
this.task.dateString = this.getTaskDate();
this.getTasksStatus();
}
}
let messagePayload = {
channelId: "directline",
from: { id: "AriBotChannelDev", name: "TaskSpur-Ari-Channel-Dev" },
inputHint: "expectingInput",
text: taskMoveResponse.toast.message,
type: "message"
};
this.sendActionMessageEv.emit(messagePayload);
this.showLoading = !this.showLoading;
}
}
async deleteTask() {
this.showLoading = !this.showLoading;
const deleteTask = await this.ariBotService.taskTrash(this.task.Id);
this.task.deleted = deleteTask;
setTimeout(() => {
this.showLoading = !this.showLoading;
}, 1000);
}
// DATE
getTaskDate() {
if (this.task && this.task.StartOn) {
let startTime = this.task.StartOn.Time
? new Date(new Date().setHours(this.task.StartOn.Time.substring(0, 2), this.task.StartOn.Time.substring(3, 5)))
: null;
let endTime;
let at;
let dueDate;
if (this.task.EndOn) {
endTime = this.task.EndOn.Time
? new Date(new Date().setHours(this.task.EndOn.Time.substring(0, 2), this.task.EndOn.Time.substring(3, 5)))
: null;
at = this.formatAMPM(endTime);
dueDate = () => {
if (this.isYesterday(this.task.EndOn.Date)) {
return 'Yesterday' + at;
}
else if (this.isToday(this.task.EndOn.Date)) {
return 'Today' + at;
}
else if (this.isTomorrow(this.task.EndOn.Date)) {
return 'Tomorrow' + at;
}
else {
return new Date(this.task.EndOn.Date).toDateString() + at;
}
};
}
if (this.isYesterday(this.task.StartOn.Date)) {
return `Started Yesterday Due ${dueDate()}`;
}
else if (this.isToday(this.task.StartOn.Date)) {
return `Starting Today ${this.formatAMPM(startTime)} Due ${dueDate()}`;
}
else if (this.isTomorrow(this.task.StartOn.Date)) {
return `Starting Tomorrow ${this.formatAMPM(startTime)} Due ${dueDate()}`;
}
else if (this.isDayAfterTomorrow(this.task.StartOn.Date)) {
return `Starting ${new Date(this.task.StartOn.Date).toDateString()} Due ${dueDate()}`;
}
else {
return `Started ${new Date(this.task.StartOn.Date).toDateString()} Due ${dueDate()}`;
}
}
}
isYesterday(startDate) {
const date = this.getMidnight(new Date(startDate));
const midnightTonight = this.getMidnight(new Date());
const midnightYesterday = new Date(midnightTonight.getTime() - this.oneDay);
return date.toDateString() === midnightYesterday.toDateString();
}
isToday(startDate) {
const date = this.getMidnight(new Date(startDate));
const midnightTonight = this.getMidnight(new Date());
const midnightTomorrow = new Date(midnightTonight.getTime() + this.oneDay);
return (date.toDateString() === midnightTonight.toDateString() &&
date.toDateString() !== midnightTomorrow.toDateString());
}
isTomorrow(startDate) {
const date = this.getMidnight(new Date(startDate));
const midnightTonight = this.getMidnight(new Date());
const midnightTomorrow = new Date(midnightTonight.getTime() + this.oneDay);
return date.toDateString() === midnightTomorrow.toDateString();
}
isDayAfterTomorrow(startDate) {
const date = this.getMidnight(new Date(startDate));
const midnightTomorrow = this.getMidnight(new Date(Date.now() + this.oneDay));
return date > midnightTomorrow;
}
getMidnight(day) {
const date = new Date(day);
date.setMilliseconds(999);
date.setSeconds(59);
date.setMinutes(59);
date.setHours(23);
return date;
}
formatAMPM(inputDate) {
if (inputDate) {
let date = new Date(inputDate);
var hours = date.getHours();
var minutes = date.getMinutes();
var ampm = hours >= 12 ? 'pm' : 'am';
hours = hours % 12;
hours = hours ? hours : 12; // the hour '0' should be '12'
minutes = minutes < 10 ? '0' + minutes : minutes;
var strTime = hours + ':' + minutes + ' ' + ampm;
return ' at ' + strTime;
}
return '';
}
}
AriTasksComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: AriTasksComponent, deps: [{ token: i1.AriBotService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
AriTasksComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.4", type: AriTasksComponent, selector: "lig-ari-tasks", inputs: { attachment: "attachment" }, outputs: { sendSelectionEv: "sendSelectionEv", sendActionMessageEv: "sendActionMessageEv" }, ngImport: i0, template: "<ng-container *ngIf=\"task\">\n <ion-card id=\"card-{{ task.Id }}\" class=\"ion-no-margin task-card\"\n [ngClass]='task.TaskDetails?.Ari_Color | colourClass' [class.deleted]=\"task.deleted\"\n [class.show_more]=\"task.expanded\">\n <ion-card-header class=\"mc-header\" (click)=\"onExpand(task)\">\n <ion-card-title>{{ task.Name }}</ion-card-title>\n <ion-card-subtitle class=\"margin-top-10\" *ngIf=\"task.Goal?.Name\">\n {{ task.Goal?.Name }} \u2022 {{ taskLabelStatus }}\n <span *ngIf=\"task.Goal?.Name && task.IsArchived\">\n {{ task.status?.text }}</span>\n </ion-card-subtitle>\n </ion-card-header>\n <ion-card-content (click)=\"onExpand(task)\">\n <div *ngIf=\"task.Description\">\n <p [class.expanded]=\"task.expanded\" class=\"mc-body-desc-text\">\n {{ task.Description }}\n </p>\n </div>\n <div class=\"task-date\">\n <p class=\"{{\n task.EndDateText?.Color | colourClass: 'ari-message'\n }}\"> {{ task.StartDateText?.Text }}</p>\n <p class=\"{{\n task.EndDateText?.Color | colourClass: 'ari-message'\n }}\"> {{ task.EndDateText?.Text }}</p>\n </div>\n </ion-card-content>\n <ion-row (click)=\"onExpand(task)\">\n <ion-col class=\"col-ari\">\n <ng-container *ngIf=\"task.RemindMe\">\n <div class=\"ion-text-left\">\n <div class=\"task-reminder\">\n <span>\n <lig-ari-icon class=\"ari-icon\" [name]=\"'clock'\"></lig-ari-icon>{{ task.ReminderTime }}\n </span>\n </div>\n </div>\n </ng-container>\n <ng-container *ngIf=\"task.TaskDetails\">\n <div class=\"ion-text-left ari-message\">\n <span class=\"card-ari-icon {{\n task.TaskDetails?.Ari_Color | colourClass: 'icon-message'\n }}\">\n <lig-ari-icon *ngIf=\"task.TaskDetails?.Ari_Color === 4\" class=\"ari-icon\" [name]=\"'success'\">\n </lig-ari-icon>\n <lig-ari-icon *ngIf=\"task.TaskDetails?.Ari_Color === 2\" class=\"ari-icon\" [name]=\"'info'\"></lig-ari-icon>\n <lig-ari-icon *ngIf=\"task.TaskDetails?.Ari_Color === 3\" class=\"ari-icon\" [name]=\"'warning'\">\n </lig-ari-icon>\n <lig-ari-icon *ngIf=\"task.TaskDetails?.Ari_Color === 1\" class=\"ari-icon\" [name]=\"'danger'\">\n </lig-ari-icon>\n </span>\n <span class=\"card-ari {{\n task.TaskDetails?.Ari_Color | colourClass: 'ari-message'\n }}\">\n {{ task.TaskDetails?.Ari_Message }}\n </span>\n </div>\n </ng-container>\n </ion-col>\n </ion-row>\n <div class=\"status-actions\" *ngIf=\"showActions\">\n <lig-ari-loader *ngIf=\"showLoading\"></lig-ari-loader>\n <div class=\"statuses\" *ngIf=\"!showLoading\">\n <button (click)=\"moveTo(taskStatus.Later)\" *ngIf=\"\n task.StatusId !== taskStatus.Later &&\n task.StatusId !== taskStatus.Unscheduled\n \">\n <lig-ari-icon class=\"status-icon\" [name]=\"'arrow_later'\"></lig-ari-icon><span>Later</span>\n </button>\n <button (click)=\"moveTo(taskStatus.Todo)\" *ngIf=\"task.StatusId !== taskStatus.Todo\">\n <lig-ari-icon class=\"status-icon\" [name]=\"'arrow_todo'\"></lig-ari-icon><span>To do</span>\n </button>\n <button (click)=\"moveTo(taskStatus.Doing)\" *ngIf=\"task.StatusId !== taskStatus.Doing\">\n <lig-ari-icon class=\"status-icon\" [name]=\"'arrow_doing'\"></lig-ari-icon><span>Doing</span>\n </button>\n <button (click)=\"moveTo(taskStatus.Done)\" *ngIf=\"task.StatusId !== taskStatus.Done\">\n <lig-ari-icon class=\"status-icon\" [name]=\"'arrow_done'\"></lig-ari-icon><span>Done</span>\n </button>\n <button (click)=\"deleteTask()\">\n <lig-ari-icon class=\"status-icon\" [name]=\"'trash'\"></lig-ari-icon><span>Trash</span>\n </button>\n </div>\n </div>\n <div class=\"priority\">\n <!-- // COMMENTED FOR NOW -->\n <!-- <div class=\"priority-statuses\">\n <span (click)=\"showStatusActions()\">\n <lig-ari-icon class=\"size-icon\" [name]=\"'expand_icon'\"></lig-ari-icon>\n </span>\n </div> -->\n <div class=\"priority-statuses\" *ngIf=\"task.RecurringTextInfo\">\n <span [ngSwitch]=\"task.RecurringTextInfo?.color\">\n <lig-ari-icon *ngSwitchCase=\"1\" class=\"size-icon\" [name]=\"'recurring_icon_red'\">\n </lig-ari-icon>\n <lig-ari-icon *ngSwitchCase=\"2\" class=\"size-icon\" [name]=\"'recurring_icon_blue'\">\n <lig-ari-icon *ngSwitchCase=\"3 || 6\" class=\"size-icon\" [name]=\"'recurring_icon_amber'\">\n </lig-ari-icon>\n </lig-ari-icon>\n <lig-ari-icon *ngSwitchCase=\"4\" class=\"size-icon\" [name]=\"'recurring_icon_green'\">\n </lig-ari-icon>\n <lig-ari-icon *ngSwitchDefault class=\"size-icon\" [name]=\"'recurring_icon'\">\n </lig-ari-icon>\n </span>\n </div>\n <div class=\"priority-statuses\" *ngIf=\"task?.RescheduledCount > 0\">\n <span class=\"rechedule-icon\">\n <lig-ari-icon *ngIf=\"task?.RescheduledCount <= 2\" class=\"size-icon\" [name]=\"'reschedule_icon_teal'\">\n </lig-ari-icon>\n <lig-ari-icon *ngIf=\"task?.RescheduledCount >= 3 && task?.RescheduledCount <= 5\" class=\"size-icon\"\n [name]=\"'reschedule_icon_amber'\"></lig-ari-icon>\n <lig-ari-icon *ngIf=\"task?.RescheduledCount >= 6\" class=\"size-icon\" [name]=\"'reschedule_icon_red'\">\n </lig-ari-icon>\n\n <b class=\"badge\" [class.primary-point]=\"task?.RescheduledCount <= 2\" [class.secondary-point]=\"\n task?.RescheduledCount >= 3 && task?.RescheduledCount <= 5\n \" [class.tertiary-point]=\"task?.RescheduledCount >= 6\">{{ task.RescheduledCount > 9 ? '9+' :\n task.RescheduledCount }}</b>\n </span>\n </div>\n <div class=\"priority-statuses\">\n <span *ngIf=\"task.Goal?.Name\">\n <ion-badge class=\"goal-badge\">\n <lig-ari-icon class=\"goal-icon\" [name]=\"categoryIcon\"></lig-ari-icon>\n </ion-badge>\n </span>\n </div>\n <div class=\"priority-statuses\">\n <div [ngSwitch]=\"task.PriorityId\">\n <span *ngSwitchCase=\"1\">\n <lig-ari-icon class=\"size-icon\" [name]=\"'priority-low'\"></lig-ari-icon>\n </span>\n <span *ngSwitchCase=\"2\">\n <lig-ari-icon class=\"size-icon\" [name]=\"'priority-medium'\"></lig-ari-icon>\n </span>\n <span *ngSwitchCase=\"3\">\n <lig-ari-icon class=\"size-icon\" [name]=\"'priority-high'\"></lig-ari-icon>\n </span>\n <span *ngSwitchDefault></span>\n </div>\n </div>\n </div>\n <ion-button *ngIf=\"attachment.content.buttons\" expand=\"block\" fill=\"clear\" class=\"suggested-action-button\"\n (click)=\"sendSelection()\">\n {{ buttonTitle }}\n </ion-button>\n </ion-card>\n</ng-container>\n<!-- ------------------------------ -->\n<!-- ------------------------------ -->\n<!-- ------------------------------ -->\n<!-- GOALS -->\n<!-- ------------------------------ -->\n<!-- ------------------------------ -->\n<!-- ------------------------------ -->\n<ion-card *ngIf=\"goal\" class=\"mobile-bc-card\">\n <ion-card-content class=\"p-0\">\n <div class=\"bc-content\">\n <div class=\"board-chart\">\n <lib-ari-chart [goal]=\"goal\"></lib-ari-chart>\n </div>\n <div class=\"bc-title\">\n <h5>{{ goal.Name }}</h5>\n <p>\n {{ goal.GoalDetails?.Tasks_Done }}/{{ goal.GoalDetails?.Tasks_Total }}\n {{ getTaskDoneText(goal.GoalDetails?.Tasks_Done) }}\n </p>\n </div>\n </div>\n </ion-card-content>\n <div class=\"bc-footer\">\n <ng-container>\n <div class=\"bc-card__more-info\">\n <!-- <p class=\"bc-card__description\">\n {{ truncateToEllipse(goal.description, 75) }}\n </p> -->\n <p class=\"bc-card__due-task\" *ngIf=\"goal?.DueDateText\"\n [ngClass]=\"goal?.DueDateText?.Color | colourClass: 'board-ari'\">\n {{ goal?.DueDateText?.Text }}\n </p>\n </div>\n </ng-container>\n <div class=\"footer-ari\">\n <ng-container *ngIf=\"goal.GoalDetails\">\n <span class=\"board-ari-icon\" [ngClass]=\"goal.GoalDetails?.Ari_Color | colourClass: 'icon-message'\">\n <lig-ari-icon *ngIf=\"goal.GoalDetails?.Ari_Color === 4\" class=\"ari-icon\" [name]=\"'success'\"></lig-ari-icon>\n <lig-ari-icon *ngIf=\"goal.GoalDetails?.Ari_Color === 2\" class=\"ari-icon\" [name]=\"'info'\"></lig-ari-icon>\n <lig-ari-icon *ngIf=\"goal.GoalDetails?.Ari_Color === 3\" class=\"ari-icon\" [name]=\"'warning'\"></lig-ari-icon>\n <lig-ari-icon *ngIf=\"goal.GoalDetails?.Ari_Color === 5\" class=\"ari-icon\" [name]=\"'grey'\"></lig-ari-icon>\n <lig-ari-icon *ngIf=\"goal.GoalDetails?.Ari_Color === 1\" class=\"ari-icon\" [name]=\"'danger'\"></lig-ari-icon>\n </span>\n <span class=\"board-ari\" [ngClass]=\"goal.GoalDetails?.Ari_Color | colourClass: 'board-ari'\">\n {{ goal.GoalDetails?.Ari_Message }}\n </span>\n </ng-container>\n </div>\n <!-- <span class=\"subtitle\" *ngIf=\"attachment.content.subtitle\">\n <lig-ari-icon class=\"ari-icon\" [name]=\"'info'\"></lig-ari-icon><span>{{ attachment.content.subtitle }}</span>\n </span> -->\n </div>\n <div class=\"priority\">\n <div class=\"priority-statuses\">\n </div>\n <div class=\"priority-statuses\">\n <span>\n <ion-badge class=\"goal-badge\">\n <lig-ari-icon [type]=\"'goal'\" class=\"goal-icon\" [name]=\"categoryIcon\"></lig-ari-icon>\n </ion-badge>\n </span>\n </div>\n <div class=\"priority-statuses\">\n <div [ngSwitch]=\"goal.PriorityId\">\n <span *ngSwitchCase=\"1\">\n <lig-ari-icon class=\"size-icon\" [name]=\"'priority-low'\"></lig-ari-icon>\n </span>\n <span *ngSwitchCase=\"2\">\n <lig-ari-icon class=\"size-icon\" [name]=\"'priority-medium'\"></lig-ari-icon>\n </span>\n <span *ngSwitchCase=\"3\">\n <lig-ari-icon class=\"size-icon\" [name]=\"'priority-high'\"></lig-ari-icon>\n </span>\n <span *ngSwitchDefault></span>\n </div>\n </div>\n </div>\n <!-- <div class=\"bc-footer\">\n <div class=\"goal-icon\">\n <span class=\"card-category\">\n <lig-ari-icon [type]=\"'goal'\" [name]=\"categoryIcon\"></lig-ari-icon>\n </span>\n <div class=\"card-priority\" [ngSwitch]=\"goal.priorityId\">\n <span *ngSwitchCase=\"1\">\n <lig-ari-icon class=\"size-icon\" [name]=\"'priority-low'\"></lig-ari-icon>\n </span>\n <span *ngSwitchCase=\"2\">\n <lig-ari-icon class=\"size-icon\" [name]=\"'priority-medium'\"></lig-ari-icon>\n </span>\n <span *ngSwitchCase=\"3\">\n <lig-ari-icon class=\"size-icon\" [name]=\"'priority-high'\"></lig-ari-icon>\n </span>\n <span *ngSwitchDefault></span>\n </div>\n </div>\n </div> -->\n <ion-button *ngIf=\"attachment.content.buttons\" expand=\"block\" fill=\"clear\" class=\"suggested-action\"\n (click)=\"sendSelection()\">\n {{ buttonTitle }}\n </ion-button>\n</ion-card>\n", styles: [":root{--ion-color-white: #ffffff;--ion-color-white-rgb: 255, 255, 255;--ion-color-white-contrast: #000000;--ion-color-white-contrast-rgb: 0, 104, 217;--ion-color-white-shade: #e0e0e0;--ion-color-white-tint: #ffffff;--ion-color-blue: #1d57a4;--ion-color-blue-rgb: 0, 102, 216;--ion-color-blue-contrast: #ffffff;--ion-color-blue-contrast-rgb: 255, 255, 255;--ion-color-blue-shade: #1d57a4;--ion-color-blue-tint: #1d57a4;--ion-color-lightgray: #f2f6fc;--ion-color-lightgray-rgb: 242, 246, 252;--ion-color-lightgray-contrast: #1d57a4;--ion-color-lightgray-contrast-rgb: 0, 0, 0;--ion-color-lightgray-shade: #d5d8de;--ion-color-lightgray-tint: #f3f7fc;--ion-color-ts-red: #ff6060;--ion-color-ts-red-rgb: 255, 96, 96;--ion-color-ts-red-contrast: #ffffff;--ion-color-ts-red-contrast-rgb: 0, 0, 0;--ion-color-ts-red-shade: #e05454;--ion-color-ts-red-tint: #ff7070;--ion-color-ts-blue: #1d57a4;--ion-color-ts-blue-rgb: 2, 153, 255;--ion-color-ts-blue-contrast: #ffffff;--ion-color-ts-blue-contrast-rgb: 255, 255, 255;--ion-color-ts-blue-shade: #1d57a4;--ion-color-ts-blue-tint: #1d57a4;--ion-color-ts-amber: #ffcc66;--ion-color-ts-amber-rgb: 255, 204, 102;--ion-color-ts-amber-contrast: #000000;--ion-color-ts-amber-contrast-rgb: 0, 0, 0;--ion-color-ts-amber-shade: #e0b45a;--ion-color-ts-amber-tint: #ffd175;--ion-color-ts-green: #99cb67;--ion-color-ts-green-rgb: 153, 203, 103;--ion-color-ts-green-contrast: #ffffff;--ion-color-ts-green-contrast-rgb: 0, 0, 0;--ion-color-ts-green-shade: #87b35b;--ion-color-ts-green-tint: #a3d076;--ion-color-ts-grey: #a3a3a3;--ion-color-ts-grey-rgb: 163, 163, 163;--ion-color-ts-grey-contrast: #000000;--ion-color-ts-grey-contrast-rgb: 0, 0, 0;--ion-color-ts-grey-shade: #8f8f8f;--ion-color-ts-grey-tint: #acacac;--ion-color-light-grey: #e1e7f0;--ion-color-light-grey-rgb: 225, 231, 240;--ion-color-light-grey-contrast: #000000;--ion-color-light-grey-contrast-rgb: 0, 0, 0;--ion-color-light-grey-shade: #c6cbd3;--ion-color-light-grey-tint: #e4e9f2;--ion-color-0058ff: #0058ff;--ion-color-0058ff-rgb: 0, 88, 255;--ion-color-0058ff-contrast: #ffffff;--ion-color-0058ff-contrast-rgb: 255, 255, 255;--ion-color-0058ff-shade: #004de0;--ion-color-0058ff-tint: #1a69ff;--ion-color-0099ff: #0099ff;--ion-color-0099ff-rgb: 0, 153, 255;--ion-color-0099ff-contrast: #ffffff;--ion-color-0099ff-contrast-rgb: 255, 255, 255;--ion-color-0099ff-shade: #0087e0;--ion-color-0099ff-tint: #1aa3ff;--bodyfont-default: #151515;--icons-colors: #d3dcdb;--bodyfont-light: #6e7e81;--bodyfont-emptyviews: #343434;--bodyfont-secondary: #2f2f2f;--background-default: #f7f7f7;--background-teal: #d3dcdb;--background-lightgrey: #f4f4f4;--background-white: #ffffff;--background-offwhite: #fafafa;--background-tasks: #ebebeb;--background-emptyview: #f2f2f2;--taskspur-blue: #1d57a4;--taskspur-teal: #309da6;--taskspur-red: #f64d4b;--taskspur-amber: #fac441;--taskspur-darkblue: #184b90;--taskspur-darkteal: #309da6;--taskspur-darkred: #e3413f;--taskspur-darkamber: #e6b53b;--theme-font: \"Helvetica\", sans-serif;--background-tertiary-shadow: 0px 1px 0px #0000000d;--background-card-shadow: 0px 3px 6px #00000014;--background-overlaypanel-shadow: 0px 4px 16px #00000029}.ion-color-white{--ion-color-base: var(--ion-color-white) !important;--ion-color-base-rgb: var(--ion-color-white-rgb) !important;--ion-color-contrast: var(--ion-color-white-contrast) !important;--ion-color-contrast-rgb: var(--ion-color-white-contrast-rgb) !important;--ion-color-shade: var(--ion-color-white-shade) !important;--ion-color-tint: var(--ion-color-white-tint) !important;--ion-toolbar-background: var(--ion-color-white) !important}.ion-color-blue{--ion-color-base: var(--ion-color-blue) !important;--ion-color-base-rgb: var(--ion-color-blue-rgb) !important;--ion-color-contrast: var(--ion-color-blue-contrast) !important;--ion-color-contrast-rgb: var(--ion-color-blue-contrast-rgb) !important;--ion-color-shade: var(--ion-color-blue-shade) !important;--ion-color-tint: var(--ion-color-blue-tint) !important;--ion-toolbar-background: var(--ion-color-blue) !important}.ion-color-lightgray{--ion-color-base: var(--ion-color-lightgray) !important;--ion-color-base-rgb: var(--ion-color-lightgray-rgb) !important;--ion-color-contrast: var(--ion-color-lightgray-contrast) !important;--ion-color-contrast-rgb: var(--ion-color-lightgray-contrast-rgb) !important;--ion-color-shade: var(--ion-color-lightgray-shade) !important;--ion-color-tint: var(--ion-color-lightgray-tint) !important;--ion-toolbar-background: var(--ion-color-lightgray) !important}.ion-color-ts-red{--ion-color-base: var(--ion-color-ts-red) !important;--ion-color-base-rgb: var(--ion-color-ts-red-rgb) !important;--ion-color-contrast: var(--ion-color-ts-red-contrast) !important;--ion-color-contrast-rgb: var(--ion-color-ts-red-contrast-rgb) !important;--ion-color-shade: var(--ion-color-ts-red-shade) !important;--ion-color-tint: var(--ion-color-ts-red-tint) !important;--ion-toolbar-background: var(--ion-color-ts-red) !important}.ion-color-ts-blue{--ion-color-base: var(--ion-color-ts-blue) !important;--ion-color-base-rgb: var(--ion-color-ts-blue-rgb) !important;--ion-color-contrast: var(--ion-color-ts-blue-contrast) !important;--ion-color-contrast-rgb: var(--ion-color-ts-blue-contrast-rgb) !important;--ion-color-shade: var(--ion-color-ts-blue-shade) !important;--ion-color-tint: var(--ion-color-ts-blue-tint) !important;--ion-toolbar-background: var(--ion-color-ts-blue) !important}.ion-color-ts-amber{--ion-color-base: var(--ion-color-ts-amber) !important;--ion-color-base-rgb: var(--ion-color-ts-amber-rgb) !important;--ion-color-contrast: var(--ion-color-ts-amber-contrast) !important;--ion-color-contrast-rgb: var(--ion-color-ts-amber-contrast-rgb) !important;--ion-color-shade: var(--ion-color-ts-amber-shade) !important;--ion-color-tint: var(--ion-color-ts-amber-tint) !important;--ion-toolbar-background: var(--ion-color-ts-amber) !important}.ion-color-ts-green{--ion-color-base: var(--ion-color-ts-green) !important;--ion-color-base-rgb: var(--ion-color-ts-green-rgb) !important;--ion-color-contrast: var(--ion-color-ts-green-contrast) !important;--ion-color-contrast-rgb: var(--ion-color-ts-green-contrast-rgb) !important;--ion-color-shade: var(--ion-color-ts-green-shade) !important;--ion-color-tint: var(--ion-color-ts-green-tint) !important;--ion-toolbar-background: var(--ion-color-ts-green) !important}.ion-color-ts-grey{--ion-color-base: var(--ion-color-ts-grey) !important;--ion-color-base-rgb: var(--ion-color-ts-grey-rgb) !important;--ion-color-contrast: var(--ion-color-ts-grey-contrast) !important;--ion-color-contrast-rgb: var(--ion-color-ts-grey-contrast-rgb) !important;--ion-color-shade: var(--ion-color-ts-grey-shade) !important;--ion-color-tint: var(--ion-color-ts-grey-tint) !important;--ion-toolbar-background: var(--ion-color-ts-grey) !important}.ion-color-light-grey{--ion-color-base: var(--ion-color-light-grey) !important;--ion-color-base-rgb: var(--ion-color-light-grey-rgb) !important;--ion-color-contrast: var(--ion-color-light-grey-contrast) !important;--ion-color-contrast-rgb: var(--ion-color-light-grey-contrast-rgb) !important;--ion-color-shade: var(--ion-color-light-grey-shade) !important;--ion-color-tint: var(--ion-color-light-grey-tint) !important;--ion-toolbar-background: var(--ion-color-light-grey) !important}.ion-color-0058FF{--ion-color-base: var(--ion-color-0058FF) !important;--ion-color-base-rgb: var(--ion-color-0058FF-rgb) !important;--ion-color-contrast: var(--ion-color-0058FF-contrast) !important;--ion-color-contrast-rgb: var(--ion-color-0058FF-contrast-rgb) !important;--ion-color-shade: var(--ion-color-0058FF-shade) !important;--ion-color-tint: var(--ion-color-0058FF-tint) !important;--ion-toolbar-background: var(--ion-color-0058FF) !important}.ion-color-0099FF{--ion-color-base: var(--ion-color-0099FF) !important;--ion-color-base-rgb: var(--ion-color-0099FF-rgb) !important;--ion-color-contrast: var(--ion-color-0099FF-contrast) !important;--ion-color-contrast-rgb: var(--ion-color-0099FF-contrast-rgb) !important;--ion-color-shade: var(--ion-color-0099FF-shade) !important;--ion-color-tint: var(--ion-color-0099FF-tint) !important;--ion-toolbar-background: var(--ion-color-0099FF) !important}::-webkit-scrollbar{width:3px}::-webkit-scrollbar-track{background:#f1f1f1}::-webkit-scrollbar-thumb{background:#373737}::-webkit-scrollbar-thumb:hover{background:#37373780}:host .goal-icon{display:flex;justify-content:flex-end}:host .subtitle{color:#02558c;display:block;width:100%;margin:8px 0}:host .subtitle span{margin-left:3px}:host .deleted{display:none}:host .task-card{background:#ffffff;border-radius:12px;width:300px;flex:0 0 auto;background:#fff;box-shadow:0 4px 12px #0000001a;border:1px solid #d3dcdb;animation:fadein 1s;padding:4px 8px 4px 0;margin:0 8px;cursor:pointer}:host .task-card .mc-header ion-card-title{font-family:Helvetica,sans-serif;font-weight:700;font-size:17px;letter-spacing:.15px;color:#000;width:85%;text-transform:capitalize}:host .task-card .mc-header ion-card-subtitle{font-family:Helvetica,sans-serif;font-size:13px;font-weight:400;color:#8d8d8d;letter-spacing:.13px;text-transform:capitalize}:host .task-card .mc-header ion-card-subtitle span{font-family:Helvetica,sans-serif;font-size:13px;font-weight:400;color:#8d8d8d;letter-spacing:.13px;text-transform:uppercase}:host .task-card .mc-header .mc-header__menu{position:absolute;top:20px;right:15px}:host .task-card .mc-header .mc-header__menu img{width:30px}:host .task-card ion-card-content{padding-top:0}:host .task-card ion-card-content .expanded{display:unset!important}:host .task-card ion-card-content .mc-body-desc-label{font-family:Helvetica,sans-serif;font-size:15px;font-weight:500;letter-spacing:.15px;color:#000}:host .task-card ion-card-content .mc-body-desc-text{font-family:Helvetica,sans-serif;font-size:14px;font-weight:400;letter-spacing:0;color:#000;overflow-wrap:break-word;overflow:hidden!important;text-overflow:ellipsis!important;white-space:initial!important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}:host .task-card ion-card-content .mc-body-desc-text:first-letter{text-transform:uppercase}:host .task-card .size-icon{font-size:20px;line-height:20px}:host .task-card .ari-icon{font-size:11px}:host .task-card .mc-body-space{margin-top:8px}:host .task-card .task-date{margin-top:8px}:host .task-card .task-date p{font-size:14px;font-weight:700;letter-spacing:.14px}:host .task-card .mc-footer{margin:0;height:auto;padding:0 16px 5px}:host .task-card .ch-1{background:#197af2}:host .task-card .ch-2{background:#0099ff}:host .task-card .ch-3{background:#00c2ff}:host .task-card .ch-4{background:#0ddafc}:host .task-card .col-ari{padding:5px 16px}:host .task-card .task-reminder{color:#6e7e81;font-size:14px;margin-bottom:8px;display:flex}:host .task-card .task-reminder span{background:#ededed 0% 0% no-repeat padding-box;border-radius:11px;display:flex;align-items:center;padding:0 5px}:host .task-card .task-reminder span .ari-icon{font-size:14px;line-height:14px;margin-right:5px;height:16px}:host .task-card .ari-message{display:flex}:host .task-card .card-ari{width:auto;height:auto;border-radius:2px;font-family:Helvetica,sans-serif;font-size:14px;letter-spacing:.14px;text-align:left;display:inline-block;margin-left:4px;padding-top:0}:host .task-card .card-ari-icon{margin-right:.25rem}:host .task-card .card-ari-icon i-feather{height:16px!important;width:16px!important;color:#fff!important;fill:inherit!important}:host .task-card .card-ari--amber{color:#fac441}:host .task-card .card-ari--blue{color:#02558c}:host .task-card .card-ari--green{color:#008996}:host .task-card .card-ari--grey{color:#a3a3a3}:host .task-card .card-ari--red{color:#e03f51}:host .task-card .card-ari--yellow{color:#ffcd00}:host .task-card .card-ari--black{color:#333}:host .task-card .card-ari-icon--primary{color:#1d57a4}:host .task-card .card-ari-icon--secondary{color:#ff9a66}:host .task-card .card-ari-icon--success{color:#309da6}:host .task-card .card-ari-icon--info{color:#1d57a4}:host .task-card .card-ari-icon--warning{color:#fac441}:host .task-card .card-ari-icon--danger{color:#ff6262}:host .task-card .card-priority{display:flex;justify-content:center;align-items:center;width:22px;height:22px;border-radius:2px;margin-right:8px;float:right}:host .task-card .card-priority i{font-size:12px!important}:host .task-card .card-priority.card-priority--blue{background-color:#1d57a4}:host .task-card .card-priority.card-priority--yellow{background-color:#fc6}:host .task-card .card-priority.card-priority--red{background-color:#f64d4b}:host .task-card.show_more{border-top:solid 4px #a3a3a3;border-left:none!important;min-height:290px}:host .task-card.my-card--red{border-left-color:#f64d4b!important;border-left-width:4px;border-left-style:solid}:host .task-card.my-card--red.show_more{border-top-color:#f64d4b!important}:host .task-card.my-card--red .start-date{border-right-color:#f64d4b!important}:host .task-card.my-card--red .circle-top,:host .task-card.my-card--red .circle-bottom{border-color:#f64d4b!important}:host .task-card.my-card--blue{border-left-color:#1d57a4!important;border-left-width:4px;border-left-style:solid}:host .task-card.my-card--blue.show_more{border-top-color:#1d57a4!important}:host .task-card.my-card--blue .start-date{border-right-color:#1d57a4!important}:host .task-card.my-card--blue .circle-top,:host .task-card.my-card--blue .circle-bottom{border-color:#1d57a4!important}:host .task-card.my-card--amber{border-left-color:#fac441!important;border-left-width:4px;border-left-style:solid}:host .task-card.my-card--amber.show_more{border-top-color:#fac441!important}:host .task-card.my-card--amber .start-date{border-right-color:#fac441!important}:host .task-card.my-card--amber .circle-top,:host .task-card.my-card--amber .circle-bottom{border-color:#fac441!important}:host .task-card.my-card--green{border-left-color:#309da6!important;border-left-width:4px;border-left-style:solid}:host .task-card.my-card--green.show_more{border-top-color:#309da6!important}:host .task-card.my-card--green .start-date{border-right-color:#309da6!important}:host .task-card.my-card--green .circle-top,:host .task-card.my-card--green .circle-bottom{border-color:#309da6!important}:host .task-card.my-card--grey{border-left-color:#6e7e81!important;border-left-width:4px;border-left-style:solid}:host .task-card.my-card--grey.show_more{border-top-color:#6e7e81!important}:host .task-card.my-card--grey .start-date{border-right-color:#6e7e81!important}:host .task-card.my-card--grey .circle-top,:host .task-card.my-card--grey .circle-bottom{border-color:#6e7e81!important}:host .task-card.my-card--yellow{border-left-color:#fac441!important;border-left-width:4px;border-left-style:solid}:host .task-card.my-card--yellow.show_more{border-top-color:#fac441!important}:host .task-card.my-card--yellow .start-date{border-right-color:#fac441!important}:host .task-card.my-card--yellow .circle-top,:host .task-card.my-card--yellow .circle-bottom{border-color:#fac441!important}:host .status-actions{margin-top:15px}:host .status-actions .statuses{display:flex;align-items:center}:host .status-actions .statuses button{padding:8px;display:flex;flex-direction:column;align-items:center;flex:1}:host .status-actions .statuses button span{color:#6e7e81;letter-spacing:.12px;font-size:12px}:host .status-actions .statuses button .status-icon{font-size:40px}:host .priority{display:flex;justify-content:flex-end;padding:12px 0;align-items:center}:host .priority .priority-statuses{justify-content:center;display:flex;flex:1}:host .priority .priority-statuses span{display:inline-flex;font-weight:400;margin-left:7px}:host .priority .priority-statuses span.reschedule-icon{font-size:20px;width:unset}:host .priority .priority-statuses span .badge{color:#222;font-size:13px;padding-left:4px;letter-spacing:.8px}:host .priority .priority-statuses span .primary-point{color:#008996}:host .priority .priority-statuses span .secondary-point{color:#fac441}:host .priority .priority-statuses span .tertiary-point{color:#e03f51}:host .priority .priority-statuses img{height:16px;width:16px;margin-left:7px}:host .priority .priority-statuses span{display:flex;align-items:center}:host .priority .priority-statuses span .goal-badge{background:unset;font-size:20px}:host .priority .priority-statuses span span{margin-left:5px}:host .priority .priority-statuses span .size-icon{font-size:20px;line-height:20px}:host .priority .priority-statuses span .ari-icon{font-size:11px}:host .bell{width:21px;height:23px;padding-left:12px;vertical-align:top;padding-right:4px}:host .footer-icons{text-align:right}:host .footer-icons .icomoon{color:#637375;font-size:22px;padding-right:4px;padding-bottom:8px}:host .footer-icon{width:22px;height:22px;padding-left:10px;margin-top:1px}:host .suggested-action-button{font-family:Helvetica,sans-serif;font-size:14px;line-height:32px;letter-spacing:0px;background:#fff;--background: #fff;color:#309da6;position:relative;text-align:center;margin:4px 16px 16px;height:38px;cursor:pointer;flex:0 0 auto;text-transform:none;border-radius:5px;border:1px solid #309da6}:host .notification-badge{background:#309da6;position:absolute;top:-5px;margin-left:10px;border-radius:50%;font-size:13px;font-weight:400;min-width:16px;min-height:16px}:host .notification-badge.color-amber{background:#fac441}:host .notification-badge.color-red{background:#f64d4b;color:#fff}:host .notification-badge.color-green{background:#309da6}@media (min-width: 1024px) and (max-width: 1700px){:host .mobile-card{min-height:180px}:host .mobile-card .mc-footer{padding:0 12px 10px!important}:host .mobile-card ion-card-content{padding-top:8px;padding-bottom:8px}:host .mobile-card .card-priority{width:19px;height:19px;border-radius:2px;padding-right:8px}:host .mobile-card .card-priority i{font-size:10px!important}:host .mobile-card.show_more{border-top:solid 4px #a3a3a3;border-left:none!important}:host .mobile-card .mc-body-space{margin-top:16px}:host .mobile-card .card-ari{font-size:13px!important;margin-left:0!important;top:10px!important}:host .mobile-card .bell{padding-right:5px}}@media (min-width: 768px) and (max-width: 1024px){:host .mobile-card{min-height:180px}:host .mobile-card .mc-footer{padding:0 12px 10px!important}:host .mobile-card .mc-body-space{margin-top:16px}:host .mobile-card ion-card-content{padding-top:8px;padding-bottom:8px}:host .mobile-card .card-priority{width:19px;height:19px;border-radius:2px;margin-left:0}:host .mobile-card .card-priority i{font-size:10px!important}:host .mobile-card .card-priority.card-priority--blue{background-color:#1d57a4}:host .mobile-card .card-priority.card-priority--yellow{background-color:#fc6}:host .mobile-card .card-priority.card-priority--red{background-color:#f64d4b}:host .mobile-card.show_more{border-top:solid 4px #a3a3a3;border-left:none!important;min-height:290px}:host .mobile-card .card-ari{font-size:10px!important;margin-left:0!important;top:10px!important}:host .mobile-card .bell{width:16px;height:19px;padding-right:0;padding-left:0}}@media only screen and (min-device-width: 320px) and (max-device-width: 568px){:host .mobile-card .mc-footer{padding:0 12px 10px!important}:host .mobile-card .card-ari{font-size:13px!important;margin-left:0!important;top:10px!important}}@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape){:host .mobile-card{min-height:180px}:host .mobile-card .mc-footer{padding:0 12px 10px!important}:host .mobile-card .mc-body-space{margin-top:16px}:host .mobile-card ion-card-content{padding-top:8px;padding-bottom:8px}:host .mobile-card .card-priority{width:19px;height:19px;border-radius:2px}:host .mobile-card .card-priority .icomoon{font-size:10px!important}:host .mobile-card.show_more{border-top:solid 4px #a3a3a3;border-left:none!important;min-height:290px}:host .mobile-card .card-ari{font-size:13px!important;margin-left:0!important;top:10px!important}:host .mobile-card .bell{padding-right:5px}}@keyframes fadein{0%{opacity:0}to{opacity:1}}:host .mobile-bc-card{background:#ffffff;width:300px;display:flex;flex-direction:column;justify-content:space-between;background:#fff;border:1px solid #d3dcdb;animation:fadein 1s;margin-right:16px;padding:15px 20px 20px 15px;height:auto;background:#FFFFFF 0% 0% no-repeat padding-box;box-shadow:0 1px 6px #0000003d;border-radius:5px}:host .mobile-bc-card:hover{box-shadow:0 3px 6px #00000014}:host .mobile-bc-card ion-card-content{padding-bottom:12px}:host .mobile-bc-card .bc-content{display:flex;align-items:center;position:relative;cursor:pointer;height:initial!important;padding:0!important;margin:0}:host .mobile-bc-card .board-chart{margin-right:10px}:host .mobile-bc-card .bc-title h5{margin:0;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;-webkit-hyphens:auto;hyphens:auto;font-family:HelveticaNeue-Medium,Helvetica,sans-serif;font-size:16px;font-weight:500;color:#333;letter-spacing:.16px;line-height:19px}:host .mobile-bc-card .bc-title h5:first-letter{text-transform:uppercase}:host .mobile-bc-card .bc-title p{font-family:Helvetica Neue,Helvetica,sans-serif;margin-top:3px;margin-bottom:2px;font-size:14px;font-weight:400;line-height:16px;color:#6e7e81}:host .mobile-bc-card .board-ari-icon{margin-right:.25rem}:host .mobile-bc-card .board-ari-icon i-feather{height:17px;width:17px;color:#fff!important;fill:inherit!important}:host .mobile-bc-card .bc-card__menu{position:absolute;top:20px;right:20px;z-index:1;cursor:pointer}:host .mobile-bc-card .bc-card__menu>img{width:26px}:host .mobile-bc-card .board-ari{font-size:14px;line-height:19px;font-family:Helvetica,sans-serif;letter-spacing:.14px;text-align:left;max-width:100%;margin-top:auto}:host .mobile-bc-card .board-ari--amber{color:#fac441}:host .mobile-bc-card .board-ari--blue{color:#1d57a4}:host .mobile-bc-card .board-ari--green{color:#309da6}:host .mobile-bc-card .board-ari--grey{color:#6e7e81}:host .mobile-bc-card .board-ari--red{color:#f64d4b}:host .mobile-bc-card .board-ari--black{color:#333}:host .mobile-bc-card .card-ari-icon--amber{fill:#fac441}:host .mobile-bc-card .card-ari-icon--blue{fill:#1d57a4}:host .mobile-bc-card .card-ari-icon--green{fill:#309da6}:host .mobile-bc-card .card-ari-icon--yellow{fill:#fac441}:host .mobile-bc-card .card-ari-icon--grey{fill:#6e7e81}:host .mobile-bc-card .card-ari-icon--red{fill:#f64d4b}:host .mobile-bc-card .icon-row{padding-top:16px}:host .mobile-bc-card .goal-category{padding-top:2px;width:22px}:host .mobile-bc-card .footer-ari{width:100%;display:flex;align-items:flex-start}:host .mobile-bc-card .footer-icon{width:19px;height:19px;padding-right:22px}:host .mobile-bc-card .bc-footer{margin:0}:host .mobile-bc-card .bc-footer .goal-icon{display:flex;align-items:center}:host .mobile-bc-card .bc-footer .goal-icon .card-category{justify-content:flex-end;display:flex;padding:5px;flex:1}:host .mobile-bc-card .bc-footer .goal-icon .card-priority{display:flex;font-size:20px;border-radius:2px;justify-content:flex-end;padding:5px;flex:1}:host .mobile-bc-card .bc-footer .bc-card__more-info .bc-card__due-task{font-size:14px;line-height:17px;font-weight:700;text-align:left;margin-bottom:13px;margin-top:18px}:host .mobile-bc-card .bc-footer .bc-action-icon{text-align:right}:host .mobile-bc-card .bc-footer .bc-action-icon img{height:18px;width:18px;margin-right:15px}:host .mobile-bc-card .bc-footer .bc-action-icon img:last-child{margin-right:0}:host .suggested-action{font-family:Helvetica,sans-serif;font-size:14px;line-height:32px;letter-spacing:0px;background:#fff;--background: #fff;color:#309da6;position:relative;text-align:center;height:38px;cursor:pointer;flex:0 0 auto;text-transform:none;border-radius:5px;border:1px solid #309da6}@media (max-width: 768px){:host .mobile-bc-card{margin-top:unset;margin-bottom:4px;margin-left:8px;margin-right:8px}}@media only screen and (min-device-width: 320px) and (max-device-width: 480px){:host .mobile-bc-card .board-ari{font-size:14px;left:1.2rem}}@media only screen and (min-device-width: 320px) and (max-device-width: 568px){:host .mobile-bc-card .board-ari{font-size:14px;left:1.2rem}}@media (min-width: 1024px) and (max-width: 1366px){:host .mobile-bc-card{min-height:260px}:host .mobile-bc-card .board-ari{font-size:14px;left:1.2rem;margin-top:0}:host .board-chart{flex-basis:0!important;position:relative;width:80px!important}:host .board-chart canvas{width:80px!important;height:80px}}@media (min-width: 1024px) and (max-width: 1366px) and (orientation: landscape){:host .mobile-bc-card{min-height:260px}:host .mobile-bc-card .board-ari{font-size:14px;left:1.2rem}:host .board-chart{flex-basis:0!important;position:relative;width:80px!important}:host .board-chart canvas{width:80px!important;height:80px}}@media (min-width: 768px) and (max-width: 1024px){:host .mobile-bc-card{min-height:260px}:host .mobile-bc-card .board-ari{font-size:14px;left:1.2rem}:host .board-chart{flex-basis:0!important;position:relative;width:80px!important}:host .board-chart canvas{width:80px!important;height:80px}}@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape){:host .mobile-bc-card{min-height:260px}:host .mobile-bc-card .board-ari{font-size:14px;left:1.2rem}:host .board-chart{flex-basis:0!important;position:relative;width:80px!important}:host .board-chart canvas{width:80px!important;height:80px}}@media (min-width: 481px) and (max-width: 767px){:host .board-chart{flex-basis:0!important;position:relative;width:80px!important}:host .board-chart canvas{width:80px!important;height:80px}}\n"], components: [{ type: i2.IonCard, selector: "ion-card", inputs: ["button", "color", "disabled", "download", "href", "mode", "rel", "routerAnimation", "routerDirection", "target", "type"] }, { type: i2.IonCardHeader, selector: "ion-card-header", inputs: ["color", "mode", "translucent"] }, { type: i2.IonCardTitle, selector: "ion-card-title", inputs: ["color", "mode"] }, { type: i2.IonCardSubtitle, selector: "ion-card-subtitle", inputs: ["color", "mode"] }, { type: i2.IonCardContent, selector: "ion-card-content", inputs: ["mode"] }, { type: i2.IonRow, selector: "ion-row" }, { type: i2.IonCol, selector: "ion-col", inputs: ["offset", "offsetLg", "offsetMd", "offsetSm", "offsetXl", "offsetXs", "pull", "pullLg", "pullMd", "pullSm", "pullXl", "pullXs", "push", "pushLg", "pushMd", "pushSm", "pushXl", "pushXs", "size", "sizeLg", "sizeMd", "sizeSm", "sizeXl", "sizeXs"] }, { type: i3.AriSvgIconComponent, selector: "lig-ari-icon", inputs: ["src", "type", "name", "size"] }, { type: i4.AriLoaderComponent, selector: "lig-ari-loader" }, { type: i2.IonBadge, selector: "ion-badge", inputs: ["color", "mode"] }, { type: i2.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { type: i5.AriChartComponent, selector: "lib-ari-chart", inputs: ["goal"] }], directives: [{ type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i6.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i6.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i6.NgSwitchDefault, selector: "[ngSwitchDefault]" }], pipes: { "colourClass": i7.TaskColorPipe } });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.4", ngImport: i0, type: AriTasksComponent, decorators: [{
type: Component,
args: [{ selector: 'lig-ari-tasks', template: "<ng-container *ngIf=\"task\">\n <ion-card id=\"card-{{ task.Id }}\" class=\"ion-no-margin task-card\"\n [ngClass]='task.TaskDetails?.Ari_Color | colourClass' [class.deleted]=\"task.deleted\"\n [class.show_more]=\"task.expanded\">\n <ion-card-header class=\"mc-header\" (click)=\"onExpand(task)\">\n <ion-card-title>{{ task.Name }}</ion-card-title>\n <ion-card-subtitle class=\"margin-top-10\" *ngIf=\"task.Goal?.Name\">\n