19332 - EFT Payments UI Tweaks (bcgov#2737)

* UI Tweaks

Updating action button style to match existing ones.
Removing padding from selected account in modal.
Other minor tweaks

* Update package, remove comment out line

auth-web/package.json

@@ -1,6 +1,6 @@
 {
   "name": "auth-web",
-  "version": "2.5.9",
+  "version": "2.5.10",
   "appName": "Auth Web",
   "sbcName": "SBC Common Components",
   "private": true,

auth-web/src/components/pay/ShortNameLookup.vue

@@ -11,7 +11,7 @@
       :clear-icon="state === LookupStates.SUMMARY ? 'mdi-undo': 'mdi-close'"
       :append-icon="state === LookupStates.INITIAL ? 'mdi-magnify':''"
       autocomplete="chrome-off"
-      :class="`mt-5 mb-n2 ${state === LookupStates.SUMMARY ? 'summary' : ''}`"
+      :class="`mt-5 mb-n2 ${state}`"
       filled
       hint=""
       :item-text="'accountName'"
@@ -226,9 +226,14 @@ export default defineComponent({
 <style lang="scss" scoped>
 @import '@/assets/styles/theme.scss';
 
+::v-deep .v-input__slot {
+  background: red;
+}
+
 ::v-deep .summary {
   .v-input__control {
     .v-input__slot {
+      padding: 0 !important;
       background: transparent !important;
       &:before, &:after {
         opacity: 0;

auth-web/src/components/pay/UnlinkedShortNameTable.vue

@@ -11,7 +11,7 @@
     >
       <template #text>
         <p
-          v-if="state.selectedAccount.id"
+          v-if="state.selectedAccount.accountId"
           class="py-4 px-6 important"
         >
           <span class="font-weight-bold">Important:</span> Once an account is linked, all payment received
@@ -166,6 +166,8 @@
             <v-menu
               v-model="state.actionDropdown[index]"
               :attach="`#action-menu-${index}`"
+              offset-y
+              nudge-left="74"
             >
               <template #activator="{ on }">
                 <v-btn
@@ -180,8 +182,8 @@
               </template>
               <v-list>
                 <v-list-item
-                  class="actions-dropdown_item my-1"
-                  data-test="remove-linkage-button"
+                  class="actions-dropdown_item"
+                  data-test="link-account-button"
                 >
                   <v-list-item-subtitle
                     @click="viewDetails(index)"
@@ -437,6 +439,15 @@ export default defineComponent({
 @import '@/assets/scss/actions.scss';
 @import '@/assets/scss/ShortnameTables.scss';
 
+.actions-dropdown_item {
+  cursor: pointer;
+  padding: 0.5rem 1rem;
+  &:hover {
+    background-color: $gray1;
+    color: $app-blue !important;
+  }
+}
+
 h4 {
   color: black;
 }