New client many fixes (#8981)

* Footer style fixes

* Limited string display

* Fixed background reload

* Began adding more avatar items

* Fixed challenge updated cats and official to be seen by admins

* Fixed min prize

* Fixed required fields

* Added my challenges and find challenges to menu

* Removed nav to party page when have no party

* Updated user and notifications icon

* Added accept, reject and messages

* Added selfcare

* Underline links

* Added forgot password

* Fixed task adding

* Disabled habit options that should be

* Added markdown to tags

* Added confirm to delete

* Fixed cancel/delete style

* Fixed rounding

* Added gold icon

* Fixed task icon styles

* Fixed margin botton

* Fixed some repeat styles

* Fixed custom reward style

* Hide like count 0

* Added new tavern images

* Redirect to party page after create

* Hid leader options from non leaders

* Removed manager options from non group plan

* Fixed some nav styles

* Fixed overlay color

* Prevented edit data from being transfered to create

* Added hover state for spells

* Add performance fixes for chat avatars

* Fixed merge conflicts

* Updated fron navigation

* Fixed reg gryphon logo

* Began adding gem modal functionality

* Added purchase gems with gold

* Fixed restore

* Replaced description with summary

* Spells that target tasks fix

* Added initial challenge task load

* Fixed lint issue

website/client/components/tasks/task.vue

@@ -49,7 +49,7 @@
 
     // Habits right side control
     .right-control.d-flex.align-items-center.justify-content-center(v-if="task.type === 'habit'", :class="controlClass.down")
-      .task-control.habit-control(:class="controlClass.down + '-control-habit'", @click="isUser ? score('down') : null")
+      .task-control.habit-control(:class="controlClass.down + '-control-habit'", @click="(isUser && controlClass.down !== 'task-habit-disabled') ? score('down') : null")
         .svg-icon.negative(v-html="icons.negative")
     // Rewards right side control
     .right-control.d-flex.align-items-center.justify-content-center.reward-control(v-if="task.type === 'reward'", :class="controlClass", @click="isUser ? score('down') : null")
@@ -62,7 +62,7 @@
   @import '~client/assets/scss/colors.scss';
 
   .task {
-    margin-bottom: 8px;
+    margin-bottom: 2px;
     box-shadow: 0 2px 2px 0 rgba($black, 0.16), 0 1px 4px 0 rgba($black, 0.12);
     background: transparent;
     border-radius: 2px;
@@ -78,6 +78,10 @@
     }
   }
 
+  .task-habit-disabled-control-habit:hover {
+    cursor: initial;
+  }
+
   .task-title {
     padding-bottom: 8px;
     color: $gray-10;
@@ -247,6 +251,7 @@
     .small-text {
       margin-top: 4px;
       color: $yellow-10;
+      font-style: initial;
     }
   }
 </style>
@@ -276,6 +281,11 @@
     color: $gray-300;
     white-space: nowrap;
   }
+
+  .task-reward {
+    // @TODO: I'm unsure of where this is defined. Can't find it in search. So, I am using important for now
+    background-color: rgba(255, 217, 160, 0.28) !important;
+  }
 </style>
 
 <script>