From 1805631e4a03e7c97950d22090e06650ed9a62a7 Mon Sep 17 00:00:00 2001
From: Mrugesh Mohapatra <1884376+raisedadead@users.noreply.github.com>
Date: Sat, 8 May 2021 12:54:29 +0530
Subject: [PATCH] fix(client): add info circle to claim cert steps (#42060)

---
 .../Introduction/components/ClaimCertSteps.js         | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/client/src/templates/Introduction/components/ClaimCertSteps.js b/client/src/templates/Introduction/components/ClaimCertSteps.js
index c7f102b0d8..6112cee7ed 100644
--- a/client/src/templates/Introduction/components/ClaimCertSteps.js
+++ b/client/src/templates/Introduction/components/ClaimCertSteps.js
@@ -5,6 +5,7 @@ import { withTranslation, useTranslation } from 'react-i18next';
 import { connect } from 'react-redux';
 import { createSelector } from 'reselect';
 
+import IntroInformation from '../../../assets/icons/IntroInformation';
 import GreenPass from '../../../assets/icons/GreenPass';
 import GreenNotCompleted from '../../../assets/icons/GreenNotCompleted';
 import { userSelector } from '../../../redux';
@@ -84,10 +85,18 @@ const ClaimCertSteps = ({ certSlug, i18nCertText, superBlock, user }) => {
           {t('certification-card.complete-project', {
             i18nCertText
           })}
+          <span className='badge map-badge map-project-checkmark'>
+            <IntroInformation style={mapIconStyle} />
+          </span>
         </a>
       </li>
       <li className='map-challenge-title map-project-wrap'>
-        <Link to={certClaimLink}>{t('certification-card.set-claim')}</Link>
+        <Link to={certClaimLink}>
+          {t('certification-card.set-claim')}
+          <span className='badge map-badge map-project-checkmark'>
+            <IntroInformation style={mapIconStyle} />
+          </span>
+        </Link>
       </li>
     </ul>
   );