S12523511 # Client - Incoming Issues (raised by Client) #Review percentage for Requirements

cmsWebApp/webroot/css/common.css

@@ -3472,6 +3472,21 @@ span.export-candidate,span.appli-status-short{
 .pro-bar {
     padding: 28px 38px 22px 62px; height: 80px;
 }
+
+.pro-bar.autohight {
+    height: auto;
+}
+
+.withreq-text .req-text {
+    display: block;
+    box-sizing: border-box;
+    margin-bottom: 15px;
+}
+
+.left-temp {
+    float: left;
+        width: 25%;
+}
 .express-bar {
     padding: 10px 38px 35px 62px;
 }
@@ -3494,7 +3509,7 @@ span.appli-percen {
     top: -2px;
     font-family: "Usual-Bold";
     width: 80px;
-    text-align: right;
+    text-align: left;
 }
 .expand-box {
     display: inline-block;
@@ -3553,9 +3568,11 @@ span.appli-progress-bar {
 }
 .main-score-bar.ESSENTIAL.red .score-bar {
     border-left: 10px solid #f96230;
+        padding-left: 52px;
 }
 .main-score-bar.ESSENTIAL.green .score-bar {
     border-left: 10px solid #67B413;
+        padding-left: 52px;
 }
 .applicant-right {
     float: right;

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

@@ -451,17 +451,22 @@
                                             Long    rating  =   requirementFitData.get(importance);
                                     %>
                                             <div class="main-score-bar main-pro-bar <%= importance %> <%= missingReq ? "red" : hasAllReq ? "green"  : ""%>">
-                                                <div class="score-bar pro-bar">
+                                                <div class="score-bar pro-bar <%=importance == Importance.ESSENTIAL && (missingReq || hasAllReq ) ? "autohight withreq-text" : ""%>">
                                                         <span class="appli-label"><oneit:toString   value="<%= importance %>"   mode="EscapeHTML"/></span>
                                                     <%
                                                         if(importance == Importance.ESSENTIAL)
                                                         {
                                                     %>
-                                                            <span class="<%= missingReq ? "red-requirements" : hasAllReq ? "green-requirements" : "" %>">
+                                                            <span class="req-text <%= missingReq ? "red-requirements" : hasAllReq ? "green-requirements" : "" %>">
                                                                 <%= missingReq ? "Candidate does not meet essential requirements" : hasAllReq ? "Candidate does meet essential requirements" : "" %>
                                                             </span>
                                                     <%
                                                         }
+                                                       if (importance == Importance.ESSENTIAL && (missingReq || hasAllReq )){
+                                                           %>
+                                                           <span class="left-temp">&nbsp;</span>
+                                                           <%
+                                                        }
                                                     %>
                                                         <span class="appli-percen gray"><oneit:toString  value="<%= rating %>"   mode="PercentageWholeNumber" /></span>
                                                         <span class="appli-progress-bar">