diff --git a/ayanova/src/components/custom-fields-control.vue b/ayanova/src/components/custom-fields-control.vue
index 07f4b97d..00dcfd85 100644
--- a/ayanova/src/components/custom-fields-control.vue
+++ b/ayanova/src/components/custom-fields-control.vue
@@ -1,6 +1,6 @@
 <template>
   <div v-if="templateHasVisibleCustomFields()">
-    <span class="v-label v-label--active theme--light">
+    <span class="text-caption">
       {{ $ay.t("ObjectCustomFieldCustomGrid") }}
     </span>
     <div>
diff --git a/ayanova/src/components/tag-picker.vue b/ayanova/src/components/tag-picker.vue
index 246ff77c..c66fab0f 100644
--- a/ayanova/src/components/tag-picker.vue
+++ b/ayanova/src/components/tag-picker.vue
@@ -1,6 +1,6 @@
 <template>
   <div>
-    <span class="v-label v-label--active theme--light">
+    <span class="text-caption">
       {{ title }}
     </span>
     <v-autocomplete
diff --git a/ayanova/src/components/work-order-state.vue b/ayanova/src/components/work-order-state.vue
index 4b72bbb6..65c96038 100644
--- a/ayanova/src/components/work-order-state.vue
+++ b/ayanova/src/components/work-order-state.vue
@@ -1,10 +1,14 @@
 <template>
   <div>
-    <h5>WORKORDER STATE</h5>
-    {{ lastState }}
+    <span class="text-caption">{{ $ay.t("WorkOrderStatus") }}</span>
+    <div>
+      {{ lastState }}
+    </div>
 
-    <!-- Display as drop down box so it appears like any other select, however, it also has a button to show history and
-    when user clicks on it a popup dialog shows the entire history of the state in a datatable or something along those lines -->
+    <!-- 
+    Display as drop down box set to last status entered, user selects new status and it appends a new record to the wostate collection
+    and shows dirty and as new state.
+    Also a button to show more info which pops up a dialog showing the entire state history in a data table -->
   </div>
 </template>
 <script>
@@ -49,7 +53,7 @@ export default {
       if (!this.value.states) {
         return "UNKNOWN";
       } else {
-        return this.value.states[this.value.states.length-1];
+        return this.value.states[this.value.states.length - 1];
       }
     }
   }
diff --git a/ayanova/src/views/adm-user.vue b/ayanova/src/views/adm-user.vue
index df798b9a..4ce39fe2 100644
--- a/ayanova/src/views/adm-user.vue
+++ b/ayanova/src/views/adm-user.vue
@@ -379,7 +379,7 @@
 
                 <v-col cols="12" sm="6" lg="4" xl="3">
                   <!-- https://vuetifyjs.com/en/components/color-pickers -->
-                  <span class="v-label v-label--active theme--light">
+                  <span class="text-caption">
                     {{ $ay.t("UserColor") }}
                   </span>
                   <v-color-picker
diff --git a/ayanova/src/views/cust-user.vue b/ayanova/src/views/cust-user.vue
index bcfef489..16a8fded 100644
--- a/ayanova/src/views/cust-user.vue
+++ b/ayanova/src/views/cust-user.vue
@@ -369,7 +369,7 @@
 
                 <v-col cols="12" sm="6" lg="4" xl="3">
                   <!-- https://vuetifyjs.com/en/components/color-pickers -->
-                  <span class="v-label v-label--active theme--light">
+                  <span class="text-caption">
                     {{ $ay.t("UserColor") }}
                   </span>
                   <v-color-picker
diff --git a/ayanova/src/views/home-reminder.vue b/ayanova/src/views/home-reminder.vue
index eccdc5ad..bc86813b 100644
--- a/ayanova/src/views/home-reminder.vue
+++ b/ayanova/src/views/home-reminder.vue
@@ -64,7 +64,7 @@
             xl="3"
           >
             <!-- https://vuetifyjs.com/en/components/color-pickers -->
-            <span class="v-label v-label--active theme--light">
+            <span class="text-caption">
               {{ $ay.t("ReminderColor") }}
             </span>
             <v-color-picker
diff --git a/ayanova/src/views/home-user-settings.vue b/ayanova/src/views/home-user-settings.vue
index ec4554a3..0734fbe0 100644
--- a/ayanova/src/views/home-user-settings.vue
+++ b/ayanova/src/views/home-user-settings.vue
@@ -164,7 +164,7 @@
 
           <v-col cols="12" sm="6" lg="4" xl="3">
             <!-- https://vuetifyjs.com/en/components/color-pickers -->
-            <span class="v-label v-label--active theme--light">
+            <span class="text-caption">
               {{ $ay.t("UserColor") }}
             </span>
             <v-color-picker
diff --git a/ayanova/src/views/svc-work-order-status-edit.vue b/ayanova/src/views/svc-work-order-status-edit.vue
index 57b8059c..5c429244 100644
--- a/ayanova/src/views/svc-work-order-status-edit.vue
+++ b/ayanova/src/views/svc-work-order-status-edit.vue
@@ -68,7 +68,7 @@
             ></gz-role-picker>
           </v-col>
           <v-col cols="12" sm="6" lg="4" xl="3">
-            <span class="v-label v-label--active theme--light">
+            <span class="text-caption">
               {{ $ay.t("WorkOrderStatusColor") }}
             </span>
             <v-color-picker
diff --git a/ayanova/src/views/svc-workorder.vue b/ayanova/src/views/svc-workorder.vue
index e0eefc04..5f83a6c7 100644
--- a/ayanova/src/views/svc-workorder.vue
+++ b/ayanova/src/views/svc-workorder.vue
@@ -748,6 +748,7 @@ async function fetchTranslatedText(vm) {
     "WorkOrder",
     "WorkOrderSerialNumber",
     "WorkOrderSummary",
+    "WorkOrderStatus",
     "WorkOrderCustom1",
     "WorkOrderCustom2",
     "WorkOrderCustom3",