Merge pull request #412 from Safelite/csr/414-v3

ui defects

src/layouts/estimate/estimate.vue

@@ -11,7 +11,7 @@
       <funnelSubHeader cmsWidgetName="FunnelSubHeaderWidget" />
       <div class="fade-on-route-transition sub-container make-tall">
         <alert
-        class=""
+        class="vinLookupMethodHeading"
         v-model="customAlertData"
         alertClass=""
         cmsWidgetName="AlertVinLookupQuestion"
@@ -138,12 +138,12 @@ export default {
 </script>
 
 <style lang="scss">
-  .alert p{
+  .vinLookupMethodHeading p {
     font-size: 1rem;
     font-weight: 500; 
     color: $black; 
   }
-  div .current_car_info-text{
+  div .current_car_info-text {
     padding-bottom: 16px; 
   }
 </style>

src/styles/common-error-styles.scss

@@ -1,7 +1,8 @@
 html {
   .has-error {
     &.list-button,
-    &.list-card {
+    &.list-card, 
+    &.list-card.list-button {
       border: 1px solid $red;
       color: $red;
       input[type=checkbox]:focus + label,
@@ -15,6 +16,14 @@ html {
         box-shadow: 0px 0px 0px 4px $red-200;
         border-radius: 10px;
       }
+      label {
+        border: 1px solid transparent; 
+      }
+      label:hover {
+        box-shadow: 0px 0px 0px 4px $red-200;
+        border-radius: 10px;
+        border: 1px solid $red; 
+      }
     }
     &.list-button-horizontal {
       color: $red;

src/ux-components/list-button/list-button.vue

@@ -1,6 +1,6 @@
 <template>
   <div
-    class="list-group list-button d-flex flex-column w-100 mb-2"
+    class="list-group list-button rounded-3 d-flex flex-column w-100 mb-2"
     :class="[(errors.length > 0 || hasError) ? 'has-error' : '']"
     @keyup.space="triggerButton()"
     @keyup.up="handleKeyupArrow()"