From e92fa4b119e14ee1275a430fa07372173953535b Mon Sep 17 00:00:00 2001 From: Bryan Mauger Date: Tue, 21 Jan 2025 14:14:12 -0500 Subject: [PATCH 1/2] 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; + } + } + } + } + } + } +} From 9edfa4163a38da87eb3d6713c9c631db5fe36d95 Mon Sep 17 00:00:00 2001 From: Bryan Mauger Date: Tue, 21 Jan 2025 14:16:05 -0500 Subject: [PATCH 2/2] Formate code. --- src/router/index.js | 3 ++- .../list-button-horizontal.vue | 16 ++++++++-------- 2 files changed, 10 insertions(+), 9 deletions(-) diff --git a/src/router/index.js b/src/router/index.js index 118e39cd1..ed35f6808 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -96,7 +96,8 @@ const routes = [ // if entering the funnel from the content site, check and see if there is already a funnel cookie. // if so, send them to return-user page. const funnelCookieLastTouched = getFunnelCookie()?.LastTouched; - if (fromContentSite && + if ( + fromContentSite && funnelCookieLastTouched !== null && funnelCookieLastTouched !== undefined && !toReturnUserPage 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 85a7c679a..4b66023e0 100644 --- a/src/ux-components/list-button-horizontal/list-button-horizontal.vue +++ b/src/ux-components/list-button-horizontal/list-button-horizontal.vue @@ -231,8 +231,8 @@ export default { z-index: 2; &:hover { background-color: $white; - border-top-left-radius: .5rem; - border-bottom-left-radius: .5rem; + border-top-left-radius: 0.5rem; + border-bottom-left-radius: 0.5rem; border-top-right-radius: 0; border-bottom-right-radius: 0; } @@ -267,8 +267,8 @@ export default { z-index: 2; &:hover { background-color: $white; - border-top-right-radius: .5rem; - border-bottom-right-radius: .5rem; + border-top-right-radius: 0.5rem; + border-bottom-right-radius: 0.5rem; border-top-left-radius: 0; border-bottom-left-radius: 0; } @@ -289,8 +289,8 @@ fieldset { z-index: 6; &:hover { background-color: $white; - border-top-left-radius: .5rem; - border-bottom-left-radius: .5rem; + border-top-left-radius: 0.5rem; + border-bottom-left-radius: 0.5rem; border-top-right-radius: 0; border-bottom-right-radius: 0; } @@ -325,8 +325,8 @@ fieldset { z-index: 6; &:hover { background-color: $white; - border-top-right-radius: .5rem; - border-bottom-right-radius: .5rem; + border-top-right-radius: 0.5rem; + border-bottom-right-radius: 0.5rem; border-top-left-radius: 0; border-bottom-left-radius: 0; }