diff --git a/app/styles/employers.sass b/app/styles/employers.sass index 78437d593..48ff80e10 100644 --- a/app/styles/employers.sass +++ b/app/styles/employers.sass @@ -1,4 +1,13 @@ #employers-view + .artisanal-claim + font-variant: small-caps + text-align: center + font-size: 20px + font-weight: bold + font-family: Copperplate, "Copperplate Gothic Light", fantasy + border-top: 1px solid #DBDBDB + border-bottom: 1px solid #DBDBDB + margin-bottom: 5px .employer-button background: #fce232 /* Old browsers */ @@ -14,13 +23,17 @@ //filter panels #filter + border: 2px solid #CBCBCB margin-bottom: 10px .panel-heading - background-color: darkgrey + background-color: #D9D9D9 cursor: pointer + border-top-left-radius: 0px + border-top-right-radius: 0px + #folder-icon + margin-right: 5px .panel-body - background-color: darkgrey - border-radius: 4px + background-color: #D9D9D9 border-top-left-radius: 0px border-top-right-radius: 0px .panel @@ -28,13 +41,24 @@ border-radius: 0px #filters + margin-bottom: 10px .filter_section - width: 25% + min-width: 25% + margin-right: 10px display: inline-block vertical-align: top - margin-bottom: 10px - label input - margin-right: 10px + + h4 + margin-bottom: 5px + + label + display: block + font-weight: normal + margin-bottom: 0 + cursor: pointer + input + margin-right: 5px + .get-started-button vertical-align: text-bottom margin-left: 10px @@ -82,7 +106,6 @@ height: 150px padding-right: 15px - .reason width: 33% padding-left: 3% @@ -108,9 +131,6 @@ #bottom_row height: auto #candidate-table - width: 96% - margin-left: 2% - margin-right: 2% background-color: #E7E7E7 table cursor: pointer @@ -118,49 +138,48 @@ margin-left: 2% margin-right: 2% margin-bottom: 30px - .tag_column - width: 25% + .tag_column, .location_column, .education_column, .work_column + width: 33% display: inline-block - .location_column - display: inline-block - width: 25% - .education_column - display: inline-block - width: 25% - .work_column - display: inline-block - width: 25% + img + margin-right: 5px + vertical-align: top tr .candidate-picture - width: 50px - height: 50px + width: 100px + height: 100px border-radius: 5px overflow: hidden margin-right: 10px + img + border-radius: 5px .candidate-description width: 100% vertical-align: bottom - td - margin-bottom: 10px - margin-top: 10px + td.candidate-description padding-bottom: 5px - padding-top: 10px - .candidate-name-cell - position: relative - top: 10px - //refactor later, bad practice - - + td.candidate-name-cell + padding-top: 15px + padding-bottom: 5px + font-size: 18px + .border_row border-bottom: 1px solid #d3d3d3 vertical-align: bottom td - padding-top: 0px - padding-bottom: 5px - .description_row td - padding-bottom: 0px + padding-top: 5px + padding-bottom: 15px + + .teaser-profiles #candidate-table table + .tag_column, .location_column, .education_column, .work_column + width: 25% + tr + .candidate-description padding-top: 15px + .candidate-picture + width: 50px + height: 50px #results display: inline-block diff --git a/app/templates/employers.jade b/app/templates/employers.jade index 00c925657..6c7010d29 100644 --- a/app/templates/employers.jade +++ b/app/templates/employers.jade @@ -1,6 +1,8 @@ extends /templates/recruitment_base block content + .artisanal-claim + | Always 100% Pre-Screened if me.get('anonymous') a#login-link Login br @@ -12,114 +14,117 @@ block content if !me.get('anonymous') a#logout-link(data-i18n="login.log_out") Logout br - #filter - .panel-group#filter_panel - a#filter-link(data-toggle="collapse" data-target="#collapseOne") - .panel.panel-default - .panel-heading - h4.panel-title - - span.glyphicon.glyphicon-folder-open#folder-icon - | Filter - .panel-collapse.collapse.in#collapseOne - .panel-body - form#filters - .filter_section#visa_filter - h4 Visa - label - input(type="checkbox" name="visa" value="Authorized to work in the US") - | US Authorized (#{candidatesInFilter("visa","Authorized to work in the US")}) - br - label - input(type="checkbox" name="visa" value="Need visa sponsorship") - | Not Authorized (#{candidatesInFilter("visa","Need visa sponsorship")}) - .filter_section#school_filter - h4 Education - label - input(type="checkbox" name="schoolFilter" value="Top School") - | Top School (#{candidatesInFilter("schoolFilter","Top School")}) - br - label - input(type="checkbox" name="schoolFilter" value="Other") - | Other (#{candidatesInFilter("schoolFilter","Other")}) - .filter_section#role_filter - h4 Role - label - input(type="checkbox" name="roleFilter" value="Web Developer") - | Web Developer (#{candidatesInFilter("roleFilter","Web Developer")}) - br - label - input(type="checkbox" name="roleFilter" value="Software Developer") - | Software Developer (#{candidatesInFilter("roleFilter","Software Developer")}) - br - label - input(type="checkbox" name="roleFilter" value="Mobile Developer") - | Mobile Developer (#{candidatesInFilter("roleFilter","Mobile Developer")}) - .filter_section#seniority_filter - h4 Seniority - label - input(type="checkbox" name="seniorityFilter" value="Senior") - | Senior (#{candidatesInFilter("seniorityFilter","Senior")}) - br - label - input(type="checkbox" name="seniorityFilter" value="Junior") - | Junior (#{candidatesInFilter("seniorityFilter","Junior")}) - br - label - input(type="checkbox" name="seniorityFilter" value="Recent Grad") - | Recent Grad (#{candidatesInFilter("seniorityFilter","Recent Grad")}) - br - label - input(type="checkbox" name="seniorityFilter" value="College Student") - | College Student (#{candidatesInFilter("seniorityFilter","College Student")}) - - //input#select_all_checkbox(type="checkbox" name="select_all" checked) - //| Select all - p#results #{numberOfCandidates} results - //button.btn#create-alert-button Create Alert - if candidates.length - #candidate-table - table - tbody - for candidate, index in featuredCandidates - - var profile = candidate.get('jobProfile'); - - var authorized = candidate.id; // If we have the id, then we are authorized. - - var profileAge = (new Date() - new Date(profile.updated)) / 86400 / 1000; - - var expired = profileAge > 2 * 30.4; - - var curated = profile.curated; - - tr.candidate-row(data-candidate-id=candidate.id, id=candidate.id, class=expired ? "expired" : "") - td(rowspan=3) - .candidate-picture - img(src=candidate.getPhotoURL(50,false,true), alt=profile.name, title=profile.name, width=50) - if !isntEmployer - td.candidate-name-cell - strong - | #{profile.name} - tr.description_row(data-candidate-id=candidate.id) - if curated && curated.shortDescription - td.candidate-description #{curated.shortDescription} - else - td.candidate-description #{profile.shortDescription} - tr.border_row(data-candidate-id=candidate.id) - if curated - - var workHistory = curated.workHistory.join(","); - td.tag_column - img(src="/images/pages/employer/tag.png") - | #{profile.jobTitle} - td.location_column - img(src="/images/pages/employer/location.png") - | #{curated.location} - td.education_column - img(src="/images/pages/employer/education.png") - | #{curated.education} - td.work_column - if workHistory - img(src="/images/pages/employer/briefcase.png") - | #{workHistory} + .row + - var fullProfiles = isEmployer || me.isAdmin(); + #candidates-column(class=fullProfiles ? "full-profiles col-md-9" : "teaser-profiles col-md-12") + if candidates.length + #candidate-table + table + tbody + for candidate, index in featuredCandidates + - var profile = candidate.get('jobProfile'); + - var authorized = candidate.id; // If we have the id, then we are authorized. + - var profileAge = (new Date() - new Date(profile.updated)) / 86400 / 1000; + - var expired = profileAge > 2 * 30.4; + - var curated = profile.curated; + - var photoSize = fullProfiles ? 100 : 50; + + tr.candidate-row(data-candidate-id=candidate.id, id=candidate.id, class=expired ? "expired" : "") + td(rowspan=3) + .candidate-picture + img(src=candidate.getPhotoURL(photoSize, false, true), alt=profile.name, title=profile.name, width=photoSize) + if fullProfiles + td.candidate-name-cell + strong= profile.name + | - + span= profile.jobTitle + tr.description_row(data-candidate-id=candidate.id) + if curated && curated.shortDescription + td.candidate-description #{curated.shortDescription} + else + td.candidate-description #{profile.shortDescription} + tr.border_row(data-candidate-id=candidate.id) + if curated + - var workHistory = curated.workHistory.join(","); + if !fullProfiles + td.tag_column + img(src="/images/pages/employer/tag.png") + | #{profile.jobTitle} + td.location_column + img(src="/images/pages/employer/location.png") + | #{curated.location} + td.education_column + img(src="/images/pages/employer/education.png") + | #{curated.education} + td.work_column + if workHistory + img(src="/images/pages/employer/briefcase.png") + | #{workHistory} + if fullProfiles + .col-md-3 + #filter + .panel-group#filter_panel + a#filter-link(data-toggle="collapse" data-target="#collapseOne") + .panel.panel-default + .panel-heading + h4.panel-title + span.glyphicon.glyphicon-folder-open#folder-icon + | Filter + .panel-collapse.collapse.in#collapseOne + .panel-body + p + strong We've already technically screened all our candidates + | , but you can also filter further: + form#filters + .filter_section#visa_filter + h4 Visa + label + input(type="checkbox" name="visa" value="Authorized to work in the US") + | US Authorized (#{candidatesInFilter("visa","Authorized to work in the US")}) + label + input(type="checkbox" name="visa" value="Need visa sponsorship") + | Not Authorized (#{candidatesInFilter("visa","Need visa sponsorship")}) + .filter_section#school_filter + h4 Education + label + input(type="checkbox" name="schoolFilter" value="Top School") + | Top School (#{candidatesInFilter("schoolFilter","Top School")}) + label + input(type="checkbox" name="schoolFilter" value="Other") + | Other (#{candidatesInFilter("schoolFilter","Other")}) + .filter_section#role_filter + h4 Role + label + input(type="checkbox" name="roleFilter" value="Web Developer") + | Web Developer (#{candidatesInFilter("roleFilter","Web Developer")}) + label + input(type="checkbox" name="roleFilter" value="Software Developer") + | Software Developer (#{candidatesInFilter("roleFilter","Software Developer")}) + label + input(type="checkbox" name="roleFilter" value="Mobile Developer") + | Mobile Developer (#{candidatesInFilter("roleFilter","Mobile Developer")}) + .filter_section#seniority_filter + h4 Experience + label + input(type="checkbox" name="seniorityFilter" value="Senior") + | Senior (#{candidatesInFilter("seniorityFilter","Senior")}) + label + input(type="checkbox" name="seniorityFilter" value="Junior") + | Junior (#{candidatesInFilter("seniorityFilter","Junior")}) + label + input(type="checkbox" name="seniorityFilter" value="Recent Grad") + | Recent Grad (#{candidatesInFilter("seniorityFilter","Recent Grad")}) + label + input(type="checkbox" name="seniorityFilter" value="College Student") + | College Student (#{candidatesInFilter("seniorityFilter","College Student")}) + + //input#select_all_checkbox(type="checkbox" name="select_all" checked) + //| Select all + p#results #{numberOfCandidates} results + //button.btn#create-alert-button Create Alert - if !isEmployer && !me.isAdmin() + if !fullProfiles div#info_wrapper span.hiring-call-to-action h2#start-hiring(data-i18n="employers.start_hiring") Start hiring. diff --git a/app/views/employers_view.coffee b/app/views/employers_view.coffee index 13713a7a2..03ba35c85 100644 --- a/app/views/employers_view.coffee +++ b/app/views/employers_view.coffee @@ -128,11 +128,11 @@ module.exports = class EmployersView extends View return (_.filter candidates, (c) -> c.get('jobProfile').curated?[filterName] is filterValue).length else return Math.floor(Math.random() * 500) - + getActiveAndApprovedCandidates: => candidates = _.filter @candidates.models, (c) -> c.get('jobProfile').active return _.filter candidates, (c) -> c.get('jobProfileApproved') - + getRenderData: -> ctx = super() ctx.isEmployer = @isEmployer() @@ -143,7 +143,7 @@ module.exports = class EmployersView extends View ctx.activeCandidates = _.filter ctx.candidates, (c) -> c.get('jobProfile').active ctx.inactiveCandidates = _.reject ctx.candidates, (c) -> c.get('jobProfile').active ctx.featuredCandidates = _.filter ctx.activeCandidates, (c) -> c.get('jobProfileApproved') - + unless @isEmployer() or me.isAdmin() ctx.featuredCandidates = _.filter ctx.featuredCandidates, (c) -> c.get('jobProfile').curated ctx.featuredCandidates = ctx.featuredCandidates.slice(0,7) @@ -156,7 +156,6 @@ module.exports = class EmployersView extends View ctx.moment = moment ctx._ = _ ctx.numberOfCandidates = ctx.featuredCandidates.length - ctx.isntEmployer = not (@isEmployer() or me.isAdmin()) ctx isEmployer: ->