add requirment icons to pdf and the view applicant list page

cmsWebApp/webroot/css/common.css

@@ -4110,6 +4110,19 @@ no-applicant.inactive a:hover,no-applicant.inactive a:hover span{
          background-size: 25%;
 
 }
+.appli-view-bar .requirements-correct-icon{
+        top:-7px;
+        left : -5px;
+	box-sizing: border-box;
+	height: 27px;
+	width: 27px;
+	border: 3px solid #FFFFFF;
+        position: absolute;
+        border-radius: 50%;
+         background: url('../images/correct.png') #67B413 no-repeat center center ;
+         background-size: 55%;
+
+}
 .appli-percent-no{
     font-size: 36px;
     font-weight: 300;    

cmsWebApp/webroot/extensions/adminportal/inc/applicants_list_report.jsp

@@ -106,6 +106,8 @@
                     long    criteriaVal =   jobApplication.getRequirementFitScore();
                     String  criteria    =   FormatUtils.stringify(criteriaVal, "PercentageWholeNumber", "0");
                     boolean missingReq  =   jobApplication.hasFailedEssentialRequirements();
+                    String  iconBg      =   "background-image : url('file://" + PDFUtils.FILE_BASE_PATH + "/images/correct.png'); background-color : #67B413; background-size:50%; ";
+                    if (missingReq)     iconBg      =   "background-image : url('file://" + PDFUtils.FILE_BASE_PATH + "/images/icon-requirements.png'); background-color : #F9623D  ; background-size:18%;" ;
                 %>
                     <div class="appli-jcs appli-l eq-second-height">
                         <span class="appli-view-bar">
@@ -115,12 +117,15 @@
                                     <span class="show-precentage"><%= criteria %></span>
                                 </div>
                             </div>
-                                <span class="missing-requirements-icon" style="<%= missingReq ? "display:inline-block" : "display:none" %>"></span>
+                              
+                                <span class="requirements-icon" style="<%= iconBg %>"></span>
                         </span>
                         <span class="<%= missingReq ? "red-requirements" : "" %>">
                             requirements
+                           
                         </span>
                     </div>
+                             
             <%
                 }
             %>           

cmsWebApp/webroot/extensions/adminportal/inc/applicants_list_report_header.jsp

@@ -87,7 +87,27 @@
             transition: width .6s ease;
             position: relative;
         }
+         .appli-view-bar .progress-bar.green {
+         background: #67B413;
+        }
+        
         .show-precentage {position: absolute;color:#fff;right: 1px;    top: -3px; font-size: 9px;font-weight: 500;}
+       .requirements-icon { 
+            top:-5px;
+            left : -5px;
+            box-sizing: border-box;
+            height: 18px;
+            width: 18px;
+            border: 3px solid #FFFFFF;
+            position: absolute;
+            border-radius: 50%;
+            background-repeat:  no-repeat;
+            background-position: 32% 25%;
+            padding: 0;
+            
+       }
+      .red-requirements {color: #F9623D;}
+      .green-requirements {color: #67B413;}  
 
 
         @page

cmsWebApp/webroot/extensions/adminportal/inc/view_applicants_list.jsp

@@ -108,7 +108,7 @@
                                             style="<%= "width: " + criteria %>">
                                     </div>
                                 </div>
-                                    <span class="missing-requirements-icon" style="<%= missingReq ? "display:inline-block" : "display:none" %>"></span>
+                                    <span  class="<%= missingReq ? "missing-requirements-icon" : "requirements-correct-icon" %>"></span>
                             </span>
                             <span class="<%= missingReq ? "red-requirements" : "" %>">
                                 requirements