From 5f3969b8b85b2e777308ced0d5cca154361a6360 Mon Sep 17 00:00:00 2001
From: Daniel Naab <dan@crushingpennies.com>
Date: Tue, 17 Aug 2021 16:10:46 -0500
Subject: [PATCH] Tweak to work with background color change introduced in
 uswds/uswds#4199

---
 src/web/src/browser/views/components/ValidatorPage.tsx | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/src/web/src/browser/views/components/ValidatorPage.tsx b/src/web/src/browser/views/components/ValidatorPage.tsx
index 4f062dc2a..9e79c0349 100644
--- a/src/web/src/browser/views/components/ValidatorPage.tsx
+++ b/src/web/src/browser/views/components/ValidatorPage.tsx
@@ -122,7 +122,10 @@ export const ValidatorPage = () => {
               </div>
               <div className="usa-radio">
                 {schematron.filterOptions.roles.map((filterRole, index) => (
-                  <div key={index}>
+                  <div
+                    key={index}
+                    className={`bg-${colorTokenForRole(filterRole)}-lighter`}
+                  >
                     <input
                       className="usa-radio__input usa-radio__input--tile"
                       id={`role-${filterRole}`}
@@ -135,9 +138,7 @@ export const ValidatorPage = () => {
                       }
                     />
                     <label
-                      className={`usa-radio__label bg-${colorTokenForRole(
-                        filterRole,
-                      )}-lighter`}
+                      className="usa-radio__label"
                       htmlFor={`role-${filterRole}`}
                     >
                       <svg