diff --git a/packages/manager/apps/pci-savings-plan/src/components/Commitment/Commitment.tsx b/packages/manager/apps/pci-savings-plan/src/components/Commitment/Commitment.tsx index 12e6b3e4661d..2b76feb64882 100644 --- a/packages/manager/apps/pci-savings-plan/src/components/Commitment/Commitment.tsx +++ b/packages/manager/apps/pci-savings-plan/src/components/Commitment/Commitment.tsx @@ -47,7 +47,11 @@ const Commitment = ({ rounded inline variant={ODS_TILE_VARIANT.stroked} - className="flex flex-row items-center mr-5 my-4 justify-between w-full cursor-pointer" + className={`flex flex-row items-center mr-5 my-4 justify-between w-full cursor-pointer ${ + isActive + ? 'bg-[--ods-color-blue-100] border-[--ods-color-blue-600]' + : '' + }`} color={ isActive ? ODS_THEME_COLOR_INTENT.primary @@ -59,7 +63,10 @@ const Commitment = ({ {t('commitment_month', { value: duration })} - + {diffInPercent ? `- ${diffInPercent} %` : ''} @@ -75,8 +82,7 @@ const Commitment = ({ )} {getTextPrice(priceNumber * CENTS_PRICE)}