From e92fa4b119e14ee1275a430fa07372173953535b Mon Sep 17 00:00:00 2001
From: Bryan Mauger <bryan.mauger@safelite.com>
Date: Tue, 21 Jan 2025 14:14:12 -0500
Subject: [PATCH] CASH-54 update hover state for list-button-horizontal buttons

---
 .../list-button-horizontal.vue                | 122 +++++++++++++++++-
 1 file changed, 119 insertions(+), 3 deletions(-)

diff --git a/src/ux-components/list-button-horizontal/list-button-horizontal.vue b/src/ux-components/list-button-horizontal/list-button-horizontal.vue
index 8bcd7bd3a..85a7c679a 100644
--- a/src/ux-components/list-button-horizontal/list-button-horizontal.vue
+++ b/src/ux-components/list-button-horizontal/list-button-horizontal.vue
@@ -83,7 +83,6 @@ export default {
     .list-button-horizontal-content {
         outline: none;
         position: relative;
-        background: $white;
         transition: all 150ms linear;
         border: 1px solid $gray-500;
         border-radius: 0;
@@ -110,8 +109,8 @@ export default {
         }
 
         .list-button-horizontal-content:hover {
-            background-color: $blue-700;
-            color: $white;
+            background-color: transparent;
+            color: $blue;
             box-shadow: none;
         }
 
@@ -220,4 +219,121 @@ export default {
         }
     }
 }
+// Special styles when there are multiple list-button-horizontal buttons
+// (number of chips, pay w/cash/insurance)
+.windshield-chip-count-question {
+    fieldset {
+        .d-flex {
+            .col {
+                &:first-child {
+                    label {
+                        &.list-group.list-button-horizontal {
+                            z-index: 2;
+                            &:hover {
+                                background-color: $white;
+                                border-top-left-radius: .5rem;
+                                border-bottom-left-radius: .5rem;
+                                border-top-right-radius: 0;
+                                border-bottom-right-radius: 0;
+                            }
+                        }
+                    }
+                }
+            }
+        }
+    }
+
+    fieldset {
+        .d-flex {
+            .col {
+                label {
+                    &.list-group.list-button-horizontal {
+                        &:hover {
+                            background-color: $white;
+                            border-radius: 0;
+                        }
+                    }
+                }
+            }
+        }
+    }
+
+    fieldset {
+        .d-flex {
+            .col {
+                &:last-child {
+                    label {
+                        &.list-group.list-button-horizontal {
+                            z-index: 2;
+                            &:hover {
+                                background-color: $white;
+                                border-top-right-radius: .5rem;
+                                border-bottom-right-radius: .5rem;
+                                border-top-left-radius: 0;
+                                border-bottom-left-radius: 0;
+                            }
+                        }
+                    }
+                }
+            }
+        }
+    }
+}
+//NOT Windshiled Chip Count
+fieldset {
+    .d-flex {
+        .col {
+            &:first-child {
+                label {
+                    &.list-group.list-button-horizontal {
+                        z-index: 6;
+                        &:hover {
+                            background-color: $white;
+                            border-top-left-radius: .5rem;
+                            border-bottom-left-radius: .5rem;
+                            border-top-right-radius: 0;
+                            border-bottom-right-radius: 0;
+                        }
+                    }
+                }
+            }
+        }
+    }
+}
+
+fieldset {
+    .d-flex {
+        .col {
+            label {
+                &.list-group.list-button-horizontal {
+                    &:hover {
+                        background-color: $white;
+                        border-radius: 0;
+                    }
+                }
+            }
+        }
+    }
+}
+
+fieldset {
+    .d-flex {
+        .col {
+            &:last-child {
+                label {
+                    &.list-group.list-button-horizontal {
+                        z-index: 6;
+                        &:hover {
+                            background-color: $white;
+                            border-top-right-radius: .5rem;
+                            border-bottom-right-radius: .5rem;
+                            border-top-left-radius: 0;
+                            border-bottom-left-radius: 0;
+                        }
+                    }
+                }
+            }
+        }
+    }
+}
 </style>