From 7a836041037a40e2de543e58e3e2bdc7ad63eb61 Mon Sep 17 00:00:00 2001
From: bmauger <mauger.bryan@gmail.com>
Date: Thu, 24 Feb 2022 09:12:18 -0500
Subject: [PATCH] CSR-341 fix colors and font sizes per qa.

---
 .../list-button-horizontal.vue                   |  3 +++
 src/ux-components/list-button/list-button.vue    | 16 ++++++++++++++--
 src/ux-components/list-card/list-card.vue        | 12 ++++++++++++
 3 files changed, 29 insertions(+), 2 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 f58522662..5c328bc4c 100644
--- a/src/ux-components/list-button-horizontal/list-button-horizontal.vue
+++ b/src/ux-components/list-button-horizontal/list-button-horizontal.vue
@@ -164,6 +164,9 @@ export default {
     + p {
       display: none;
     }
+    span {
+      font-size: .875rem;
+    }
   }
   &:first-of-type {
     label {
diff --git a/src/ux-components/list-button/list-button.vue b/src/ux-components/list-button/list-button.vue
index 4727f9743..d523ee06f 100644
--- a/src/ux-components/list-button/list-button.vue
+++ b/src/ux-components/list-button/list-button.vue
@@ -126,7 +126,7 @@ export default {
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 .list-group {
   &.list-button {
     input[type="radio"],
@@ -147,9 +147,14 @@ export default {
         background: $blue-100;
         box-shadow: 0 0 0 1px $blue;
       }
-      &:checked + label p:first-child {
+      &:checked + label p,
+      &:checked + label span {
         font-weight: 500;
       }
+      &:checked + label span:nth-child(2) {
+        font-weight: 400;
+        color: $gray-600;
+      }
     }
   }
   label {
@@ -161,6 +166,13 @@ export default {
     border: 1px solid $gray-500;
     width: 100%;
 
+    span {
+      &.small {
+        font-size: .75rem;
+        color: $gray-550;
+      }
+    }
+
     &:hover {
       @include media-breakpoint-up(sm) {
         box-shadow: 0 0 0 4px $blue-300;
diff --git a/src/ux-components/list-card/list-card.vue b/src/ux-components/list-card/list-card.vue
index 791a37039..869099dfd 100644
--- a/src/ux-components/list-card/list-card.vue
+++ b/src/ux-components/list-card/list-card.vue
@@ -177,6 +177,7 @@ export default {
       }
       .sub-copy {
         color: $gray-600;
+        font-weight: 400;
       }
     }
     + label::before {
@@ -247,6 +248,16 @@ export default {
         margin: -0.25rem 0 0 0;
         left: 0.875rem;
       }
+      &:checked + label {
+        p {
+          color: $black;
+          font-weight: 500;
+        }
+        .sub-copy {
+          color: $gray-600;
+          font-weight: 400;
+        }
+      }
       + label {
         min-height: 48px;
         color: $gray-600;
@@ -254,6 +265,7 @@ export default {
           margin-bottom: 0;
         }
         p {
+          color: $gray-600;
           text-align: left;
           &.sub-copy {
             color: $gray-550;