ui fixes in incomplete applicatn list page

cmsWebApp/webroot/css/common.css

@@ -3219,10 +3219,22 @@ span.appli-progress-bar {
     height: 24px;
     background: #e9ecef;
     box-shadow: none;
+   
 }
+ .progress-bar{  position: relative;    height: 13px;}
+ .progress-bar .show-precentage {position: absolute;color:#fff;right: 1px;    top: -2px; font-size: 9px;font-weight: 500;}
 .appli-progress-bar .progress-bar{
     background: #667281;
 }
+.green-bar {
+    background-color: #67B413 !important;
+}
+.red-bar {
+    background-color: #F9623D !important;
+}
+.orange-bar {
+    background-color: #F5A623 !important;
+}
 .expand-box span{
     border: solid 1px #edeff0;
     width: 28px;
@@ -3549,6 +3561,17 @@ input.add-note-btn:hover{
   text-transform: uppercase;
   margin-top: 10px;
 }
+.appli-int-status a {
+    color : #4A90E2;
+    text-transform: none;
+    text-decoration: underline;
+    display: inline-block;
+  
+}
+.appli-int-status span {
+    display: inline-block;
+    margin-right: 10px
+}
 .prev-btn,.next-btn{
   width: 28px;
   height: 28px;
@@ -3581,7 +3604,7 @@ input.add-note-btn:hover{
 .int-timeline li{
     display: inline-block;
     background-color: #768595;
-    margin-right: -3px;
+    margin-right: -2px;
     border-radius: 3px 3px 0 0px;
     position: relative;
     border-bottom: none;
@@ -4022,6 +4045,9 @@ no-applicant.inactive a:hover,no-applicant.inactive a:hover span{
     padding: 14px 0 17px 21px;
     width: 22%;
 }
+.appli-list-name.wider-box {
+     width: 37%;
+}
 .appli-jcs {
     color: #4a4a4a;
     font-size: 11px;
@@ -4103,6 +4129,7 @@ no-applicant.inactive a:hover,no-applicant.inactive a:hover span{
 .appli-list-drop{
     float: left;
     width: 100%;
+    text-align: center;
 }
 .person-status {
     float: left;

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

@@ -49,17 +49,23 @@
                         <label for="<%= appID %>"></label>
                     </div>
                 </div>
-                <div class="appli-list-name appli-l eq-second-height">
+                <div class="appli-list-name appli-l eq-second-height wider-box">
                     <oneit:button   value=" "    name="gotoPage" cssClass="<%= jobApplication.getID() + ""%>" skin="link"
                                     requestAttribs="<%= CollectionUtils.mapEntry("nextPage", applicationPage)
                                                                     .mapEntry("procParams", CollectionUtils.mapEntry("JobApplication", jobApplication).mapEntry("Applications", applications).toMap())
                                                                     .toMap() %>">
                         <oneit:toString value="<%= jobApplication.getCandidate() %>"    mode="EscapeHTML" />
+                             </oneit:button>
                         <div class="appli-int-status">
+                            <span>
                                 <a href="<%= "mailto:" + jobApplication.getCandidate().getUser().getUserName() %>">Email</a>
+                            </span>
                             <oneit:toString value="<%= jobApplication.getCandidate().getPhone() %>"   mode="EscapeHTML" />
+                            <span><img src="images/clip_icon.png"></span>
+                            <span><a href="#">CV</a></span>
+                            <span><a href="#">Cover Leter</a></span>
                         </div>
-                    </oneit:button>
+               
                 </div>
                 <%
                     String widthClass   =   "appli-jcs2";
@@ -77,7 +83,9 @@
                                 <div class="progress">
                                     <div class="progress-bar <%= (criteriaVal == 100 && !missingReq ? " green" : "")%>" role="progressbar" aria-valuenow="<%= criteria %>" aria-valuemin="0" aria-valuemax="100" 
                                             style="<%= "width: " + criteria %>">
+                                         <span class="show-precentage"><%= criteria %></span>
                                     </div>
+                                           
                                 </div>
                                     <span class="missing-requirements-icon" style="<%= missingReq ? "display:inline-block" : "display:none" %>"></span>
                             </span>
@@ -91,9 +99,11 @@
                 <div class="<%= widthClass %> appli-l eq-second-height">
                     <span class="appli-view-bar">
                         <div class="progress">
-                            <div class="progress-bar" role="progressbar" aria-valuenow="<%= culture %>" aria-valuemin="0" aria-valuemax="100" 
+                            <div class="progress-bar orange-bar" role="progressbar" aria-valuenow="<%= culture %>" aria-valuemin="0" aria-valuemax="100" 
                                     style="<%= "width: " + culture %>">
+                                <span class="show-precentage"><%= culture %></span>
                             </div> 
+                            
                         </div>
                     </span>
                     culture fit
@@ -101,9 +111,11 @@
                 <div class="<%= widthClass %> appli-l eq-second-height">
                     <span class="appli-view-bar">
                         <div class="progress">
-                            <div class="progress-bar" role="progressbar" aria-valuenow="<%= roleFit %>" aria-valuemin="0" aria-valuemax="100" 
+                            <div class="progress-bar green-bar" role="progressbar" aria-valuenow="<%= roleFit %>" aria-valuemin="0" aria-valuemax="100" 
                                     style="<%= "width: " + roleFit %>">
+                                <span class="show-precentage"><%= roleFit %></span>
                             </div>
+                            
                         </div>
                     </span>
                     role fit