Commit b96f4080 by Saliya Randunu

common ui changes to pdf reports.. to prevent issues with the text lengths

parent 3a6e39a9
......@@ -4956,7 +4956,7 @@ span.right-img {
img.alert-icon {float: left;}
.close-alert {float: right;margin-top: 3px;cursor: pointer;}
.appli-status-short{width: 170px;}
.select-img-wrap select{width:100%;}
.appli-status-short select{width:100%;}
.complete-page-footer {margin-bottom: 109px;}
.userPic {margin-right: 16px;position: relative;top: -1px;}
.mobile-hide {display: inline-block;}
......
......@@ -19,17 +19,17 @@
<oneit:dynIncluded>
<div class="wrap">
<div class="header">
<div class="chief-officer">
<span class="chief-officer">
<oneit:toString value="<%= job.getJobTitle() %>" mode="EscapeHTML" />
<%
if(job.getReferenceNumber() != null)
{
%>
&nbsp;(<oneit:toString value="<%= job.getReferenceNumber() %>" mode="EscapeHTML" />)
&nbsp;<span class="ref-no">(<oneit:toString value="<%= job.getReferenceNumber() %>" mode="EscapeHTML" />)</span>
<%
}
%>
</div>
</span>
<div class="by-name">
<span>
<%
......@@ -40,12 +40,14 @@
<%
}
%>
</span> by <oneit:toString value="<%= job.getCreatedBy() %>" mode="EscapeHTML" nullValue=""/>
</span> SUPERLAW by <oneit:toString value="<%= job.getCreatedBy() %>" mode="EscapeHTML" nullValue=""/> &nbsp;&nbsp;.&nbsp;&nbsp;
<oneit:toString value="<%= job.getLevel() %>" mode="EscapeHTML" />
</div>
</div>
<div class="white-header">
<div style="clear:both"></div>
<div class="applicant-details">
<div class="main-appli-name">
<div class="appli-name"><oneit:toString value="<%= candidate.getToString() %>" mode="EscapeHTML"/></div>
......@@ -77,7 +79,7 @@
</div>
</div>
<div class="">
<div class="view-appli-list">
<!--Requirements-->
<%
if(job.getIncludeAssessmentCriteria() == Boolean.TRUE)
......@@ -92,7 +94,7 @@
</div>
<div class="row four-label">
<%
if(detailed)
if(!missingReq)
{
for(CriteriaType ct: CriteriaType.getCriteriaTypeArray())
{
......@@ -114,7 +116,7 @@
{
%>
<span class="common-dot yellow-dot"></span>
<span class="r-y-label pre-dot" onclick="focusReqDiv('.<%= Importance.HIGHLY_DESIRABLE %>')">(<%=hDesirableNo%>)</span>
<span class="r-y-label pre-dot">(<%=hDesirableNo%>)</span>
<%
}
......@@ -122,7 +124,7 @@
{
%>
<span class="common-dot red-dot"></span>
<span class="r-y-label pre-dot" onclick="focusReqDiv('.<%= Importance.ESSENTIAL %>')">(<%=essentialNo%>)</span>
<span class="r-y-label pre-dot">(<%=essentialNo%>)</span>
<%
}
%>
......@@ -145,12 +147,23 @@
%>
<div class="appli-row">
<span class="appli-label"><oneit:toString value="<%= importance %>" mode="EscapeHTML"/></span>
<%if (importance == Importance.ESSENTIAL) { %>
<span class="appli-percen gray"> <span class="req-icon"></span></span>
<span class="appli-progress-bar candidate-does-not">
Candidate does not meet essential requirments
</span>
<%}
else {
%>
<span class="appli-percen gray"><oneit:toString value="<%= rating %>" mode="PercentageWholeNumber" /></span>
<span class="appli-progress-bar">
<div class="progress">
<div class="progress-bar" style="width:<%= rating %>%;" role="progressbar" aria-valuenow="<%= rating %>" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</span>
<%}
%>
</div>
<%
if(detailed && reqAnswersByImportance.getValuesForKey(importance)!=null)
......
......@@ -4,26 +4,34 @@
<%@ page import="performa.orm.*, performa.orm.types.*, performa.chart.*, performa.utils.*"%>
<oneit:dynIncluded>
<style type="text/css" media="print,screen" >
div.header{background-color: #1a2531; height: 80px; line-height: 80px; padding: 0 30px ;}
body { margin: 0; background-color: #e9ecef; font-family: "Usual-Light";}
div.header{background-color: #1a2531; height: 80px; padding: 0 30px;}
div.header:after{display:inline-block; line-height:80px; width:0; content:"\00A0"; overflow:hidden; vertical-align:middle}
div.white-header {background-color: #fff; height:170px;box-shadow: 0 3px 5px 0 rgba(0,0,0,0.02); padding: 0 30px ;}
.applicant-details {border-bottom:1px solid #ECECEE;height: 80px;}
.chief-officer {color: #ffffff; text-align: left; font-size: 26px; font-weight: 300; margin-bottom: 15px; float:left; width:60%}
.chief-officer {color: #ffffff; text-align: left; font-size: 22px; line-height: normal;
font-weight: 300; width:50%;display: inline-block; vertical-align: middle;
}
.chief-officer .ref-no {color: #8E97A0;}
.by-name {color: #ffffff; float: right; width:30%;text-align: right;}
.main-appli-name {display: inline-block; width: 40%; float: left; }
.by-name {color: #ffffff; display: inline-block; width:48%;text-align: right;}
.applicant-details {height: 80px;}
.applicant-details:after{display:inline-block; line-height:80px; width:0; content:"\00A0"; overflow:hidden; vertical-align:middle}
.main-appli-name {display: inline-block; width: 40%; vertical-align: middle;}
.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;}
.rank-info {display: inline-block; width: 55%; float: right;}
.shortlised {background:left center no-repeat ; text-align: center ;float: right;display: inline-block; color: #03AC66;font-size: 15px;height: 50px; line-height: 50px; border-right:1px solid #ECECEE;width: 120px;padding: 0 20px;}
.rank-info {display: inline-block; width: 55%;vertical-align: middle; }
.shortlised {background:left center no-repeat ; text-align: center ;float: right;display: inline-block; color: #03AC66;font-size: 15px;height: 50px; line-height: 50px; border-right:1px solid #ECECEE;width: 100px;padding: 0 20px; white-space: nowrap;}
.shortlised img {width: 18px;}
.overall-suit {text-align: center ;float: right;display: inline-block; color: #4A4A4A;font-size: 12px;height: 50px; line-height: 50px; width: 120px;padding:0 20px;}
.overall-suit {text-align: center ;float: right;display: inline-block; color: #4A4A4A;font-size: 12px;height: 50px; line-height: 50px; width: 120px;padding:0 20px; white-space: nowrap;}
.overall-suit span { vertical-align:middle;}
.overall-suit span:last-child {padding-left:3px;font-size: 40px;color: #667281; vertical-align:middle;}
.contact-row {padding-top: 20px; }
.view-appli-list {padding: 5mm; }
.contact-row {padding-top: 20px;border-top:1px solid #ECECEE; }
.contact-label img {width: 10px;}
.contact-row > span , .contact-row > a {margin-right:20px; font-size: 12px; display: inline-block;vertical-align: top;}
......@@ -38,17 +46,17 @@
.chart-info-cell .appli-row {height: 60px; border-bottom: 1px solid #ECECEE; padding-left:25px;line-height: 60px;}
.chart-info-cell .appli-row:last-child {border-bottom: none;}
.cell-title {text-transform: uppercase;color: #4A4A4A;font-size: 16px;letter-spacing: 1.45px;}
.appli-label{font-size: 12px;text-align: left; color: #4E5258; display: inline-block; vertical-align: middle;width:20%; }
.appli-percen{font-size: 24px; color: #667281; display: inline-block; vertical-align: middle;width: 12%}
.appli-label{font-size: 12px;text-align: left; color: #4E5258; display: inline-block; vertical-align: middle;width:26%;white-space: nowrap; }
.appli-percen{font-size: 24px; color: #667281; display: inline-block; vertical-align: middle;width: 10%}
span.appli-progress-bar {display: inline-block; width:65%;vertical-align: middle; }
span.appli-progress-bar {display: inline-block; width:60%;vertical-align: middle; }
.progress {margin-bottom: 0; border-radius: 0;height: 24px;background: #e9ecef;box-shadow: none;}
.progress-bar{background: #667281;height: 24px; }
.tab-row{ width: 100%; border-bottom: solid 1px #e3e3e3; background-color: #F7F7F8;height:auto; min-height: 45px; line-height: 45px;}
.tab-row.fixed-height {height: 45px;}
.detail-tab-row-title {font-size: 10px;letter-spacing: 0.91px;color: #4E5258;display: inline-block; vertical-align: middle;width:32%; padding-left:25px; text-transform: uppercase;}
.detail-tab-row-title {font-size: 10px;letter-spacing: 0.91px;color: #4E5258;display: inline-block; vertical-align: middle;width:34%; padding-left:25px; text-transform: uppercase;}
.detail-tab-row-text {color: #7D7F82;display: inline-block; vertical-align: middle;width:45%; font-size: 12px;}
.line-height-fixed { line-height: 1.4;}
.red-requirements {color: #F9623D; position: relative}
......@@ -85,6 +93,8 @@
background-image : url('file://<%= PDFUtils.FILE_BASE_PATH %>/images/icon-requirements.png'); background-color : #F9623D; background-size:20%;
}
.tab-view-side {
display: inline-block; vertical-align: middle;width:61%;
}
......@@ -157,6 +167,29 @@
z-index: 10;
}
.candidate-does-not {
color: #F9623D;
font-size: 12px;
font-weight: 500;
}
.req-icon {
display: inline-block;
height: 21px;
width: 21px;
border: 1px solid #F9623D;
border-radius: 50%;
background-repeat: no-repeat;
background-position: 35% 25%;
padding: 0;
display: block;
background-image : url('file://<%= PDFUtils.FILE_BASE_PATH %>/images/icon-requirements.png'); background-color : #F9623D; background-size:20%;
}
@page
{
size: A4 portrait;
......@@ -165,6 +198,6 @@
}
body { margin: 5mm; background-color: #e9ecef; }
</style>
</oneit:dynIncluded>
\ No newline at end of file
......@@ -5,12 +5,15 @@
<oneit:dynIncluded>
<style type="text/css" media="print,screen" >
body { margin: 0; background-color: #e9ecef; font-family: "Usual-Light";}
div.header{background-color: #1a2531; height: 80px; padding: 0 30px ;}
.chief-officer {font-family: "Usual-Light";color: #ffffff; text-align: left; line-height: 80px; font-size: 22px;; font-weight: 300; margin-bottom: 15px; float:left; width:60%}
div.header:after{display:inline-block; line-height:80px; width:0; content:"\00A0"; overflow:hidden; vertical-align:middle}
.chief-officer {font-family: "Usual-Light";color: #ffffff; text-align: left; line-height: normal;
font-size: 22px;; font-weight: 300; display: inline-block; width:58%;vertical-align:middle}
.chief-officer .ref-no {color: #8E97A0;}
.by-name {font-family: "Usual-Light";color: #ffffff; float: right; font-size: 12px; width:40%;text-align: right; }
.header-right-status {font-family: "Usual-Light";margin: 25px 0 10px; font-size: 11px;}
.by-name {font-family: "Usual-Light";color: #ffffff; float: right; font-size: 12px; width:40%; display: inline-block; text-align: right;}
.header-right-status {font-family: "Usual-Light";margin: 25px 0 10px; font-size: 11px;text-align: right; }
.light-calendar {
background-image: url('file://<%= PDFUtils.FILE_BASE_PATH %>/images/calendar-icon-light.png');
background-repeat: no-repeat;
......@@ -20,6 +23,7 @@
font-size: 11px;
font-family: "Usual-Medium";
}
.job-status-appli {
background-image: url('file://<%= PDFUtils.FILE_BASE_PATH %>/images/open.png');
......@@ -32,14 +36,16 @@
font-size: 11px;
font-family: "Usual-Medium";
padding: 3px 0 3px 24px;
}
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; margin:0 }
.main-appli-name {display: inline-block; width: 38%; }
div.white-header:after{display:inline-block; line-height:80px; width:0; content:"\00A0"; overflow:hidden; vertical-align:middle}
.main-appli-name {display: inline-block; width:48%; vertical-align:middle }
.appli-name{color: #1A2531; text-align: left; font-size: 26px; font-weight: 300; font-family: "Usual-Regular";}
.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; }
.appli-count {display: inline-block; width: 50%;text-align: right;color: #8E97A0;font-size: 15px; vertical-align:middle;}
.view-appli-list {padding: 5mm; }
.appl-c-box{display: inline-block;width:30%;text-align: left;background: #ffffff none repeat scroll 0 0;margin: 1.5% 1.5%;}
......
......@@ -59,7 +59,6 @@
</div>
<div class="white-header">
<div style="clear:both"></div>
<div class="main-appli-name">
<div class="appli-name"><%= workFlow == null || workFlow.getApplicationStatus() == ApplicationStatus.SUBMITTED ? "All" : workFlow.getName() %> Applicants </div>
</div>
......
......@@ -7,10 +7,12 @@
body { margin: 0; background-color: #e9ecef; font-family: "Usual-Light";}
div.header{background-color: #1a2531; height: 80px; padding: 0 30px ;}
.chief-officer {font-family: "Usual-Light";color: #ffffff; text-align: left; line-height: 80px; font-size: 22px;; font-weight: 300; margin-bottom: 15px; float:left; width:60%}
div.header:after{display:inline-block; line-height:80px; width:0; content:"\00A0"; overflow:hidden; vertical-align:middle}
.chief-officer {font-family: "Usual-Light";color: #ffffff; text-align: left; line-height: normal;
font-size: 22px;; font-weight: 300; display: inline-block; width:58%;vertical-align:middle}
.chief-officer .ref-no {color: #8E97A0;}
.by-name {font-family: "Usual-Light";color: #ffffff; float: right; font-size: 12px; width:40%;text-align: right; }
.header-right-status {font-family: "Usual-Light";margin: 25px 0 10px; font-size: 11px;}
.by-name {font-family: "Usual-Light";color: #ffffff; float: right; font-size: 12px; width:40%; display: inline-block; text-align: right;}
.header-right-status {font-family: "Usual-Light";margin: 25px 0 10px; font-size: 11px;text-align: right; }
.light-calendar {
background-image: url('file://<%= PDFUtils.FILE_BASE_PATH %>/images/calendar-icon-light.png');
background-repeat: no-repeat;
......@@ -20,6 +22,7 @@
font-size: 11px;
font-family: "Usual-Medium";
}
.job-status-appli {
background-image: url('file://<%= PDFUtils.FILE_BASE_PATH %>/images/open.png');
......@@ -32,14 +35,16 @@
font-size: 11px;
font-family: "Usual-Medium";
padding: 3px 0 3px 24px;
}
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%; margin-top: 10px; }
div.white-header:after{display:inline-block; line-height:80px; width:0; content:"\00A0"; overflow:hidden; vertical-align:middle}
.main-appli-name {display: inline-block; width:48%; vertical-align:middle }
.appli-name{color: #1A2531; text-align: left; font-size: 26px; font-weight: 300; font-family: "Usual-Regular";}
.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; }
.appli-count {display: inline-block; width: 50%;text-align: right;color: #8E97A0;font-size: 15px; vertical-align:middle;}
.view-appli-list {padding: 5mm; }
.appli-row{ width: 100%; background-color: #ffffff; box-shadow: 0 3px 5px 0 rgba(0, 0, 0, 0.02); margin-bottom: 16px;}
......
......@@ -109,7 +109,7 @@
<option>Excel</option>
</select>
</span>
<span class="appli-status-short select-img-wrap">
<span class="appli-status-short">
<tagfile:ormsingleasso_select obj="<%= jobApplication %>" assocName="WorkFlow" cssClass="form-control app-process"
options="<%= sortedWorkFlows.toArray(new WorkFlow[0]) %>"/>
......
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