some refactoring, fixed addEmployeeModal, played with scss

src/components/Schedule/Schedule.vue

@@ -24,7 +24,7 @@ AddEmployeeModal(
             tr(v-for="(employee, eIndex) in row.employees" :key="eIndex")
                 td()
                     .row.justify-content-between.align-items-center.employee-wrapper
-                        .col.text-start.ps-3 {{employee.handle}}
+                        .col.text-start.ps-3 {{employee.shorthand}}
                         .col.text-end
                             button.btn.btn-sm(
                                 @click="removeEmployee(mIndex, rIndex, employee)"
@@ -66,7 +66,7 @@ AddEmployeeModal(
 
 
 <script setup lang="ts">
-    import { watch, computed, ref, onMounted } from 'vue'
+    import { watch, computed, ref } from 'vue'
     import type { Ref, ComputedRef } from 'vue'
     import { storeToRefs } from 'pinia'
     import { useEmployees } from '@/stores/employees'
@@ -339,7 +339,7 @@ AddEmployeeModal(
 
 </script>
 
-<style scoped>
+<style lang="scss" scoped>
     table {
         table-layout: fixed;
         -ms-user-select: none;
@@ -348,9 +348,10 @@ AddEmployeeModal(
         -webkit-touch-callout: none;
         -khtml-user-select: none;
         user-select: none;
-    }
-    table td {
-        cursor: pointer;
+
+        td {
+            cursor: pointer;
+        }
     }
 
     .o-acp__item.list-group-item:hover {
@@ -368,9 +369,6 @@ AddEmployeeModal(
     }
 
     .selected {
-        /* border: 1px solid var(--bs-body-color) !important; */
-    
-        /* border: var(--bs-primary); */
         background-color: var(--bs-secondary);
         opacity: 0.1;
     }