From 83544b59c8a024fb7fcfe081163847cbbd2a3761 Mon Sep 17 00:00:00 2001
From: Johannes Millan <johannes.millan@gmail.com>
Date: Fri, 22 Feb 2019 18:48:18 +0100
Subject: [PATCH] feat(tasks): various little improvements

---
 .../features/tasks/task/task.component.html   |  2 +-
 .../features/tasks/task/task.component.scss   | 35 ++++++++++---------
 src/app/features/tasks/task/task.component.ts |  7 ++--
 .../backlog-tabs/backlog-tabs.component.html  |  4 +--
 4 files changed, 26 insertions(+), 22 deletions(-)

diff --git a/src/app/features/tasks/task/task.component.html b/src/app/features/tasks/task/task.component.html
index bd4bb99123..7e6d089762 100644
--- a/src/app/features/tasks/task/task.component.html
+++ b/src/app/features/tasks/task/task.component.html
@@ -104,7 +104,7 @@
           <button (click)="startTask()"
                   *ngIf="!task.isDone && !isCurrent && !task.subTasks"
                   title="Start tracking time"
-                  class="ico-btn"
+                  class="ico-btn start-task-btn"
                   color=""
                   mat-icon-button
                   tabindex="2">
diff --git a/src/app/features/tasks/task/task.component.scss b/src/app/features/tasks/task/task.component.scss
index b377396f21..6bdab2203d 100644
--- a/src/app/features/tasks/task/task.component.scss
+++ b/src/app/features/tasks/task/task.component.scss
@@ -111,13 +111,17 @@ $z-time-btn-svg-wrapper: 5555;
   }
 
   :host-context(.isLightTheme):last-child > .inner-wrapper > & {
-    //border-bottom-color: $light-theme-extra-border-color;
+    @include mq(xs, max) {
+      border-bottom-color: $light-theme-extra-border-color;
+    }
   }
 
   :host-context(.isDarkTheme):last-child > .inner-wrapper > & {
-    //border-bottom-color: $dark-theme-extra-border-color;
-    //border-bottom-color: $dark-theme-bg;
-    //border-bottom-color: rgb(55, 55, 55);
+    @include mq(xs, max) {
+      //border-bottom-color: $dark-theme-extra-border-color;
+      //border-bottom-color: $dark-theme-bg;
+      border-bottom-color: rgb(55, 55, 55);
+    }
   }
 
   .inner-wrapper:not(.isCurrent) > .box {
@@ -218,13 +222,10 @@ $z-time-btn-svg-wrapper: 5555;
     display: none !important;
   }
 
-  display: flex;
+  display: none;
   flex-flow: row;
-  transform: scaleX(0);
   transform-origin: right center;
   opacity: 0;
-  transition: $transition-ultra-fast;
-  transition-property: transform, opacity;
   position: absolute;
   right: 100%;
   top: 0;
@@ -236,7 +237,7 @@ $z-time-btn-svg-wrapper: 5555;
 
   .first-line:hover & {
     opacity: 1;
-    transform: scaleX(1);
+    display: flex;
   }
 
   :host-context(.isReducedTheme.isDarkTheme) & {
@@ -264,12 +265,13 @@ $z-time-btn-svg-wrapper: 5555;
 
   &:before {
     content: '';
-    border-left: 1px solid rgba(200, 200, 200, 0.9);
+    border-left: 1px solid;
     width: 1px;
     height: 90%;
     position: absolute;
     left: 0;
     top: 5%;
+    opacity: 0.5;
   }
 }
 
@@ -406,13 +408,6 @@ $z-time-btn-svg-wrapper: 5555;
     }
   }
 
-  @include mq(xs) {
-    .first-line:hover {
-      visibility: hidden;
-    }
-  }
-
-
   .time {
     font-style: italic;
     display: flex;
@@ -704,6 +699,12 @@ progress-bar {
 }
 
 
+.start-task-btn {
+  :host-context(.isHidePlayBtn) & {
+    display: none !important;
+  }
+}
+
 // ANIMATIONS ETC
 // --------------
 @keyframes success-btn-ani {
diff --git a/src/app/features/tasks/task/task.component.ts b/src/app/features/tasks/task/task.component.ts
index f9275121a8..e39bfc57eb 100644
--- a/src/app/features/tasks/task/task.component.ts
+++ b/src/app/features/tasks/task/task.component.ts
@@ -347,10 +347,13 @@ export class TaskComponent implements OnInit, OnDestroy, AfterViewInit {
   }
 
   onPanStart(ev) {
+    if (!IS_TOUCH) {
+      return;
+    }
+
     this._resetAfterPan();
     if (
-      !IS_TOUCH
-      || (ev.target.className.indexOf && ev.target.className.indexOf('drag-handle') > -1)
+      (ev.target.className.indexOf && ev.target.className.indexOf('drag-handle') > -1)
       || Math.abs(ev.deltaY) > Math.abs(ev.deltaX)
       || document.activeElement === this.editOnClickEl.nativeElement
       || ev.isFinal
diff --git a/src/app/pages/work-view/backlog-tabs/backlog-tabs.component.html b/src/app/pages/work-view/backlog-tabs/backlog-tabs.component.html
index e3f95383b3..525441c0b4 100644
--- a/src/app/pages/work-view/backlog-tabs/backlog-tabs.component.html
+++ b/src/app/pages/work-view/backlog-tabs/backlog-tabs.component.html
@@ -10,7 +10,7 @@
     </ng-template>
 
     <div class="tab-wrapper bg-400">
-      <div class="component-wrapper page-wrapper">
+      <div class="task-list-wrapper">
         <task-list [tasks]="taskService.backlogTasks$|async"
                    [noTasksMsg]="'There are currently no tasks in your backlog'"
                    listId="PARENT"
@@ -27,7 +27,7 @@
     </ng-template>
 
     <div class="tab-wrapper bg-400">
-      <div class="task-list-wrapper">
+      <div class="component-wrapper page-wrapper">
         <p *ngIf="!(taskService.scheduledTasks$|async)?.length"
            class="no-scheduled-tasks">
           There are currently no scheduled tasks. You can schedule a task by choosing "Schedule Task" in the task