purple tasks

HabitRPG · Aug 15, 2019 · 19337ae · 19337ae
1 parent a6c5ff8
commit 19337ae
Show file tree

Hide file tree

Showing 3 changed files with 30 additions and 15 deletions.
diff --git a/website/client/assets/scss/colors.scss b/website/client/assets/scss/colors.scss
@@ -71,3 +71,5 @@ $wizard-color: #1f6ea2;
 $gems-color: #24CC8F;
 $gold-color: #FFA623;
 $hourglass-color: #2995CD;
+
+$purple-task: #925cf3;
diff --git a/website/client/assets/scss/task.scss b/website/client/assets/scss/task.scss
@@ -1,7 +1,7 @@
 .task {
   &-worst { // dark red
     &-control {
-      &-bg { 
+      &-bg {
         background: $maroon-100 !important;
         &:hover {
           .habit-control { background: rgba(26, 24, 29, 0.48) !important; }
@@ -30,7 +30,7 @@
 
   &-worse { // light red
     &-control {
-      &-bg { 
+      &-bg {
         background: $red-100 !important;
         &:hover {
           .habit-control { background: rgba(26, 24, 29, 0.48) !important; }
@@ -59,7 +59,7 @@
 
   &-bad { // orange
     &-control {
-      &-bg { 
+      &-bg {
         background: $orange-100 !important;
 
         &:hover {
@@ -73,7 +73,7 @@
     }
 
     &-modal {
-      &-bg { 
+      &-bg {
         background: $orange-100 !important;
 
         .form-control {
@@ -99,7 +99,7 @@
 
   &-neutral { // yellow
     &-control {
-      &-bg { 
+      &-bg {
         background: $yellow-100 !important;
         &:hover {
           .habit-control { background: #bf7d1a !important; }
@@ -112,7 +112,7 @@
     }
 
     &-modal {
-      &-bg { 
+      &-bg {
         background: $yellow-100 !important;
 
         .form-control {
@@ -138,7 +138,7 @@
 
   &-good { // green
     &-control {
-      &-bg { 
+      &-bg {
         background: $green-10 !important;
         &:hover {
           .habit-control { background: rgba(26, 24, 29, 0.48) !important; }
@@ -167,7 +167,7 @@
 
   &-better { // teal
     &-control {
-      &-bg { 
+      &-bg {
         background: $teal-50 !important;
         &:hover {
           .habit-control { background: rgba(26, 24, 29, 0.48) !important; }
@@ -196,7 +196,7 @@
 
   &-best { // blue
     &-control {
-      &-bg { 
+      &-bg {
         background: $blue-100 !important;
         &:hover {
           .habit-control { background: rgba(26, 24, 29, 0.48) !important; }
@@ -224,6 +224,19 @@
   }
 
   &-purple { // purple, only used in modals
+    &-control {
+      &-bg {
+        background: $purple-task !important;
+        &:hover {
+          .habit-control { background: rgba(26, 24, 29, 0.48) !important; }
+          .daily-todo-control { background: rgba(255, 255, 255, 0.72) !important; }
+        }
+      }
+      &-inner-habit { background: rgba(26, 24, 29, 0.24) !important; }
+      &-inner-daily-todo { background: #ffffff80 !important; }
+      &-checkbox { color: $purple-task !important; }
+    }
+
     &-modal {
       &-bg { background: $purple-300 !important; }
       &-icon { color: $purple-300 !important; }
@@ -241,7 +254,7 @@
 
   &-reward {
     &-control {
-      &-bg { 
+      &-bg {
         background: rgba(255, 217, 160, 0.32) !important;
         .small-text { color: $orange-10 !important; }
 
@@ -251,7 +264,7 @@
   }
 
   &-disabled {
-    &-habit {    
+    &-habit {
       &-control {
         &-bg { background: $gray-600; }
         &-inner {
@@ -261,13 +274,13 @@
       }
     }
 
-    &-daily-todo {    
+    &-daily-todo {
       &-control {
-        &-bg { 
+        &-bg {
           background: $gray-400 !important;
           &:hover {
             .daily-todo-control { background: rgba(255, 255, 255, 0.72) !important; }
-          }      
+          }
         }
         &-inner { background: $gray-500 !important; }
         &-checkbox { color: $gray-400 !important; }

diff --git a/website/client/store/getters/tasks.js b/website/client/store/getters/tasks.js
@@ -16,7 +16,7 @@ export function getTagsFor (store) {
 }
 
 function getTaskColor (task) {
-  if (task.type === 'reward') return 'purple';
+  if (task.type === 'reward' || task.byHabitica) return 'purple';
 
   const value = task.value;