From 513e8580b1e9e56441a85feebcb02cc8e37d2d2d Mon Sep 17 00:00:00 2001
From: Johannes Millan <johannes.millan@gmail.com>
Date: Thu, 9 Feb 2017 23:44:28 +0100
Subject: [PATCH] add minor improvements for toasts and header animation

---
 .../scripts/main-header/_main-header-d.scss   |   7 +-
 .../scripts/main-header/main-header-d.html    | 112 +++++++++---------
 .../scripts/main/global-services/tasks-s.js   |   2 +-
 3 files changed, 64 insertions(+), 57 deletions(-)

diff --git a/app-src/scripts/main-header/_main-header-d.scss b/app-src/scripts/main-header/_main-header-d.scss
index 0173552d02..bc4b69b02c 100644
--- a/app-src/scripts/main-header/_main-header-d.scss
+++ b/app-src/scripts/main-header/_main-header-d.scss
@@ -4,8 +4,13 @@ main-header {
     margin: 0 3px;
     &.is-active {
       //ng-md-icon {
-      border: 1px solid #fff;
+      border: 1px solid #ffffff;
       //}
     }
   }
+
+  nav .md-button {
+    // only use background color to speed up animation
+    transition-property: background-color !important;
+  }
 }
\ No newline at end of file
diff --git a/app-src/scripts/main-header/main-header-d.html b/app-src/scripts/main-header/main-header-d.html
index bdf74b211f..e3170ef3ed 100644
--- a/app-src/scripts/main-header/main-header-d.html
+++ b/app-src/scripts/main-header/main-header-d.html
@@ -30,65 +30,67 @@
 
     <span flex></span>
 
-    <md-button class="md-icon-button"
-               aria-label="Add Task"
-               ng-click="vm.openAddTask()">
-      <md-tooltip md-direction="bottom">
-        Add Task
-      </md-tooltip>
-      <ng-md-icon icon="add"></ng-md-icon>
-    </md-button>
+    <nav class="nav">
+      <md-button class="md-icon-button"
+                 aria-label="Add Task"
+                 ng-click="vm.openAddTask()">
+        <md-tooltip md-direction="bottom">
+          Add Task
+        </md-tooltip>
+        <ng-md-icon icon="add"></ng-md-icon>
+      </md-button>
 
-    <md-button class="md-icon-button"
-               aria-label="Daily Planner"
-               ui-sref-active="md-raised"
-               ui-sref="daily-planner">
-      <md-tooltip md-direction="bottom">
-        Go to daily planer
-      </md-tooltip>
-      <ng-md-icon icon="border_color"></ng-md-icon>
-    </md-button>
+      <md-button class="md-icon-button"
+                 aria-label="Daily Planner"
+                 ui-sref-active="md-raised"
+                 ui-sref="daily-planner">
+        <md-tooltip md-direction="bottom">
+          Go to daily planer
+        </md-tooltip>
+        <ng-md-icon icon="border_color"></ng-md-icon>
+      </md-button>
 
-    <md-button class="md-icon-button"
-               aria-label="Work View"
-               ui-sref-active="md-raised"
-               ng-if="$state.current.name!=='daily-summary'"
-               ui-sref="work-view">
-      <md-tooltip md-direction="bottom">
-        Go to work view
-      </md-tooltip>
-      <ng-md-icon icon="playlist_play"></ng-md-icon>
-    </md-button>
+      <md-button class="md-icon-button"
+                 aria-label="Work View"
+                 ui-sref-active="md-raised"
+                 ng-if="$state.current.name!=='daily-summary'"
+                 ui-sref="work-view">
+        <md-tooltip md-direction="bottom">
+          Go to work view
+        </md-tooltip>
+        <ng-md-icon icon="playlist_play"></ng-md-icon>
+      </md-button>
 
-    <md-button class="md-icon-button"
-               aria-label="Daily Summary"
-               ng-if="$state.current.name==='daily-summary'"
-               ui-sref-active="md-raised"
-               ui-sref="daily-summary">
-      <md-tooltip md-direction="bottom">
-        Finish your day / Go to summary
-      </md-tooltip>
-      <ng-md-icon icon="done_all"></ng-md-icon>
-    </md-button>
+      <md-button class="md-icon-button"
+                 aria-label="Daily Summary"
+                 ng-if="$state.current.name==='daily-summary'"
+                 ui-sref-active="md-raised"
+                 ui-sref="daily-summary">
+        <md-tooltip md-direction="bottom">
+          Finish your day / Go to summary
+        </md-tooltip>
+        <ng-md-icon icon="done_all"></ng-md-icon>
+      </md-button>
 
-    <md-button class="md-icon-button"
-               aria-label="Daily Agenda / Tracking History"
-               ui-sref-active="md-raised"
-               ui-sref="daily-agenda">
-      <md-tooltip md-direction="bottom">
-        Go to daily agenda / Tracking history
-      </md-tooltip>
-      <ng-md-icon icon="today"></ng-md-icon>
-    </md-button>
+      <md-button class="md-icon-button"
+                 aria-label="Daily Agenda / Tracking History"
+                 ui-sref-active="md-raised"
+                 ui-sref="daily-agenda">
+        <md-tooltip md-direction="bottom">
+          Go to daily agenda / Tracking history
+        </md-tooltip>
+        <ng-md-icon icon="today"></ng-md-icon>
+      </md-button>
 
-    <md-button class="md-icon-button"
-               aria-label="Settings"
-               ui-sref-active="md-raised"
-               ui-sref="settings">
-      <md-tooltip md-direction="bottom">
-        Go to settings
-      </md-tooltip>
-      <ng-md-icon icon="settings"></ng-md-icon>
-    </md-button>
+      <md-button class="md-icon-button"
+                 aria-label="Settings"
+                 ui-sref-active="md-raised"
+                 ui-sref="settings">
+        <md-tooltip md-direction="bottom">
+          Go to settings
+        </md-tooltip>
+        <ng-md-icon icon="settings"></ng-md-icon>
+      </md-button>
+    </nav>
   </div>
 </md-toolbar>
diff --git a/app-src/scripts/main/global-services/tasks-s.js b/app-src/scripts/main/global-services/tasks-s.js
index 38791a9cf9..4c7128eb4b 100644
--- a/app-src/scripts/main/global-services/tasks-s.js
+++ b/app-src/scripts/main/global-services/tasks-s.js
@@ -257,7 +257,7 @@
     addToday(task) {
       if (task && task.title) {
         this.$localStorage.tasks.unshift(this.createTask(task));
-        this.SimpleToast('SUCCESS', 'Task "' + task.title + '" created.');
+        this.SimpleToast('SUCCESS', 'Task "' + task.title + '" created.', 200);
       }
     }