Skip to content

P
PERFORMA_REPLICA
Commit c1997782 by Saliya Randunu
Options

ui fixes in view application page and inside tabs

parent 4b63c08a
Showing with 76 additions and 13 deletions
cmsWebApp/webroot/css/common.css
......@@ -14,6 +14,7 @@
body{
color: #4e5258;
-webkit-font-smoothing: antialiased;
}
:focus{
outline: none;
......@@ -3055,7 +3056,7 @@ span.export-candidate,span.appli-status-short{
vertical-align: bottom;
}
.four-label{
margin-top: 25px;
margin: 25px 0;
}
.applicant-tab {
background: #fff none repeat scroll 0 0;
......@@ -3102,7 +3103,7 @@ span.export-candidate,span.appli-status-short{
cursor: pointer;
}
.pro-bar {
padding: 28px 38px 22px 62px;
padding: 28px 38px 22px 62px; height: 80px;
}
.express-bar {
padding: 10px 38px 35px 62px;
......@@ -3169,6 +3170,13 @@ span.appli-progress-bar {
border-bottom: solid 1px #e3e3e3;
display: inline-block;
width: 100%;
font-size: 12px;
}
.main-score-bar.ESSENTIAL.red .score-bar {
border-left: 10px solid #f96230;
}
.main-score-bar.ESSENTIAL.green .score-bar {
border-left: 10px solid #67B413;
}
.applicant-right {
float: right;
......@@ -3307,6 +3315,31 @@ input.add-note-btn:hover{
height: 145px;
margin: 0 auto;
}
.progress-circle {position: relative}
.progress-circle .missing-requirements-icon{
top:-7px;
left : 52px;
box-sizing: border-box;
height: 33px;
width: 33px;
border: 3px solid #FFFFFF;
position: absolute;
border-radius: 50%;
background: url('../images/icon-requirements.png') #F9623D no-repeat center center ;
background-size: 25%;
}
.progress-circle .green-requirements-icon{
top:-7px;
left : 52px;
box-sizing: border-box;
height: 33px;
width: 33px;
border: 3px solid #FFFFFF;
position: absolute;
border-radius: 50%;
background: url('../images/correct.png') #67B413 no-repeat center center ;
background-size:55%;
}
.progress-label{
color: #4a4a4a;
font-size: 12px;
......@@ -3950,6 +3983,8 @@ no-applicant.inactive a:hover,no-applicant.inactive a:hover span{
.appli-view-bar .progress-bar.green{
background: #67B413;
}
.appli-view-bar .missing-requirements-icon{
top:-7px;
left : -5px;
......@@ -5907,25 +5942,47 @@ input{
width: 40%;
height: 12px;
font-family: "Usual-Regular";
font-size: 10px;
font-size: 12px;
letter-spacing: 0.9px;
text-align: left;
color: #4e5258;
padding: 16px 30px;
padding: 16px 30px 16px 52px;;
float: left;
text-transform: uppercase;
height: 45px;
}
.detail-tab-row-text {
width: 60%;
height: 12px;
font-family: "Usual-Regular";
font-size: 10px;
font-size: 12px;
line-height: 1.17;
text-align: left;
color: #7d7f82;
padding: 16px;
float: left;
height: 45px;
}
.detail-tab-row-title .dot-icon{
top:14px;
left : 34px;
box-sizing: border-box;
height: 20px;
width: 20px;
position: absolute;
border-radius: 50%;
}
.detail-tab-row-title.red-requirements .dot-icon{
background: url('../images/icon-requirements.png') #F9623D no-repeat center center ;
background-size: 25%;
}
.detail-tab-row-title.green-requirements .dot-icon{
background: url('../images/correct.png') #67B413 no-repeat center center ;
background-size:55%;
}
.skip-btn{
......@@ -6491,6 +6548,6 @@ input{
.job-edit-pop .jBox-content {padding: 0}
.job-edit-pop .jBox-container{border-radius: 2px !important; width: 240px;box-shadow: 0 3px 9px 0 rgba(0,0,0,0.35);background-color: #FFFFFF;}
.job-edit-menu .job-edit-menu-item {display: block; font-weight: 500; height:45px; padding: 24px;border-bottom: 1px solid #DBDBDF;font-size:11px;line-height:1px;letter-spacing: 1px; color: #03A0E7;}
.essential-requirements-note {font-family: 'Usual-Bold' !important ;height: 34px;box-shadow: 0 -1px 0 0 #DDDDDD;width:100%;position: absolute;font-size: 11px;font-weight: 500;left:0;bottom: 0;line-height: 34px;}
.red-requirements {color: #F9623D;}
.green-requirements {color: #67B413;}
cmsWebApp/webroot/extensions/adminportal/inc/view_application_tab_applicant.jsp
......@@ -222,7 +222,12 @@
%>
<div class="col-sm-4 col-xs-12 text-center thr-block requirement-fit" href="#3a" data-toggle="tab" id="progress3" onClick="tabToggle('#tab3','.requirement-fit')">
<label class="progress-label">requirements</label>
<div class="<%= "percent-" + jobApplication.getRequirementFitColor() + " fixed-width" %>">
<div class="<%= "percent-" + jobApplication.getRequirementFitColor() + " fixed-width progress-circle" %>">
<% if (missingReq) { %>
<span class="missing-requirements-icon" style="display:inline-block"></span>
<%} else{ %>
<span class="green-requirements-icon" style="display:inline-block"></span>
<%}%>
<p style="display:none;"><oneit:toString value="<%= jobApplication.getRequirementFitScore() %>" mode="TwoDPDouble" /></p>
</div>
<div class="row four-label">
......@@ -266,7 +271,7 @@
}
%>
</div>
<div class="<%= missingReq ? "red-requirements" : "green-requirements" %>">
<div class="<%="essential-requirements-note " + (missingReq ? "red-requirements" : "green-requirements") %>">
<span><%= missingReq ? "Does not meet essential requirements" : "Does meet essential requirements" %></span>
</div>
</div>
......@@ -430,7 +435,7 @@
{
Long rating = requirementFitData.get(importance);
%>
<div class="main-score-bar main-pro-bar <%= importance %>">
<div class="main-score-bar main-pro-bar <%= importance %> <%= missingReq ? "red" : "green" %>">
<div class="score-bar pro-bar">
<span class="appli-label"><oneit:toString value="<%= importance %>" mode="EscapeHTML"/></span>
<%
......@@ -476,13 +481,13 @@
%>
<div class="tab-row">
<div class="detail-tab-row-title col-md-4 col-sm-4 col-xs-4 <%= (importance == Importance.ESSENTIAL ? (missingReq ? "red-requirements" : "green-requirements") : "") %>" style="width: 30%">
<span class="common-dot <%= dotClass %>"></span> &nbsp;
<span class="dot-icon"></span> &nbsp;
<oneit:toString value="<%= answer.getAssessmentCriteria().getCriteriaType() %>" mode="EscapeHTML"/>
</div>
<div class="detail-tab-row-text col-md-7 col-sm-7 col-xs-7" style="width: 55%">
<oneit:toString value="<%= answer.getAssessmentCriteria() %>" mode="EscapeHTML"/>
</div>
<div class="detail-tab-row-text col-md-1 col-sm-1 col-xs-1" style="width: 15%; line-height: 0.1;">
<div class="detail-tab-row-text col-md-1 col-sm-1 col-xs-1" style="width: 15%;">
<oneit:toString value="<%= answer.getAnswer() ? "Yes" : "No" %>" mode="EscapeHTML"/>
<%
......
cmsWebApp/webroot/extensions/adminportal/view_application.jsp
......@@ -76,11 +76,12 @@
valElement: 'p',
strokeWidth: 15,
bgColor: '#e5e8eb',
ringColor: '#41bdb4',
textColor: '#4a4a4a',
ringColor: '#67B413',
textColor: '#67B413',
fontSize: '30px',
fontWeight: 'normal',
showPercent: true
});
$('.percent-yellow').percentageLoader({
valElement: 'p',
......
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