Commit 7d8987ca by Saliya Randunu

pdf ui designs in application list report list view

parent 8f1f8f62
......@@ -45,10 +45,20 @@
</div>
<div class="white-header">
All Applicants
<span><%= applications.size() %> Applicants</span>
<div style="clear:both"></div>
<div class="main-appli-name">
<div class="appli-name"> All Applicants </div>
</div>
<div class="appli-count">
<%= applications.size() %> Applicants
</div>
</div>
<div class="view-appli-list">
<%
for (JobApplication jobApplication : applications)
{
......@@ -56,18 +66,18 @@
String culture = FormatUtils.stringify(jobApplication.getCultureFitScore(), "PercentageWholeNumber", "0");
%>
<div class="appli-row">
<div class="appli-list-name">
<div class="appli-list-name appli-l">
<oneit:toString value="<%= jobApplication.getCandidate() %>" mode="EscapeHTML" />
<div class="appli-status">
<oneit:toString value="<%= jobApplication.getApplicantStatusStr() %>" mode="EscapeHTML" />
</div>
</div>
<div class="appli-overall">
<div class="appli-overall appli-l">
Overall rank
<oneit:toString value="<%= jobApplication.getOverallRank() %>" mode="Integer" />
</div>
<div class="appli-l eq-second-height">
<div class="appli-jcs 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"
......@@ -79,7 +89,7 @@
role fit
</div>
<div class="appli-l eq-second-height">
<div class="appli-jcs 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"
......@@ -97,7 +107,7 @@
String criteria = FormatUtils.stringify(criteriaVal, "PercentageWholeNumber", "0");
boolean missingReq = jobApplication.hasFailedEssentialRequirements();
%>
<div class="appli-l eq-second-height">
<div class="appli-jcs appli-l eq-second-height">
<span class="appli-view-bar">
<div class="progress">
<div class="progress-bar <%= (criteriaVal == 100 && !missingReq ? " green" : "")%>" role="progressbar" aria-valuenow="<%= criteria %>" aria-valuemin="0" aria-valuemax="100"
......@@ -114,10 +124,11 @@
<%
}
%>
<div style="clear:both"></div>
</div>
<%
}
%>
</div>
</div>
</oneit:dynIncluded>
\ No newline at end of file
......@@ -14,22 +14,90 @@
@font-face {font-family: 'Usual-Regular';src: url('../../../fonts/343A83_3_0.eot');src: url('../../../fonts/343A83_3_0.eot?#iefix') format('embedded-opentype'),url('../../../fonts/343A83_3_0.woff2') format('woff2'),url('../../../fonts/343A83_3_0.woff') format('woff'),url('../../../fonts/343A83_3_0.ttf') format('truetype');}
body { margin: 5mm; background-color: #e9ecef; }
div.header{background-color: #1a2531; height: 80px; line-height: 80px; padding: 0 30px ;}
div.white-header {background-color: #fff; height:170px;box-shadow: 0 3px 5px 0 rgba(0,0,0,0.02); padding: 0 30px ;}
.chief-officer {color: #ffffff; text-align: left; font-size: 26px; font-weight: 300; margin-bottom: 15px; float:left; width:60%}
.chief-officer .ref-no {color: #8E97A0;}
.by-name {color: #ffffff; float: right; width:30%;text-align: right;}
.appli-row{ width: 100%; background-color: #ffffff; }
.appli-list-name {color: #4a4a4a;font-size: 20px;padding: 14px 0 17px 21px;width: 22%;}
.appli-status { color: #767577; font-size: 11px;}
div.white-header {background-color: #fff; height:80px;box-shadow: 0 3px 5px 0 rgba(0,0,0,0.02); padding: 0 30px ;}
.applicant-details {height: 80px; line-height: 80px; border:1px solid red; margin:0 }
.main-appli-name {display: inline-block; width: 38%; }
.appli-name{color: #1A2531; text-align: left; font-size: 26px; font-weight: 300; font-family: "Usual-Light";}
.appli-applied{color: #7d7f82; text-align: left; font-size: 12px; margin-top: 6px;}
.appli-count {display: inline-block; width: 60%;text-align: right;color: #8E97A0;font-size: 15px; }
.view-appli-list {padding: 20px 0; }
.appli-row{ width: 100%; background-color: #ffffff; box-shadow: 0 3px 5px 0 rgba(0, 0, 0, 0.02); margin-bottom: 16px;}
.appli-l {float: left; border-left: solid 1px #eee; height:30px;}
.appli-list-name {color: #4a4a4a;font-size: 20px;width:27%; padding:20px 2%; height:30px; border-left: none;}
.appli-status { font-size: 11px; letter-spacing: 0.9px; text-align: left; color: #767577; text-transform: uppercase; margin-top:5px;}
.appli-overall {
color: #4a4a4a;
font-size: 11px;
letter-spacing: 1px;
padding:20px 1%;
text-transform: uppercase;
width: 15%;
height:30px;
line-height: 30px;
}
.appli-overall span {
color: #03a0e7;
font-size: 36px;
font-weight: 300;
float: right;
}
.appli-jcs {
color: #4a4a4a;
font-size: 11px;
letter-spacing: 1px;
padding:20px 1%;
text-transform: uppercase;
width: 15%;
}
.appli-view-bar {
display: inline-block;
width: 100%;
margin-bottom: 5px;
position: relative;
}
.appli-view-bar .progress {
margin-bottom: 0;
border-radius: 0;
height: 13px;
background: #e9ecef;
box-shadow: none;
}
.progress-bar {
float: left;
width: 0;
height: 100%;
font-size: 12px;
line-height: 20px;
color: #fff;
text-align: center;
background-color: #667281;
-webkit-box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
-webkit-transition: width .6s ease;
-o-transition: width .6s ease;
transition: width .6s ease;
position: relative;
}
.show-precentage {position: absolute;color:#fff;right: 1px; top: -3px; font-size: 9px;font-weight: 500;}
@page
{
size: A4 portrait;
margin : 0;
background: #e9ecef;
@top-left { content: element(header);}
}
</style>
</oneit:dynIncluded>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment