Commit 1245c7f2 by Hoang Phuc

Show data home, jobs, cities, industries, job detail page

parent 6146f29f
Pipeline #547 failed with stages
in 0 seconds
......@@ -29,6 +29,9 @@ gem 'jbuilder', '~> 2.7'
# Reduces boot times through caching; required in config/boot.rb
gem 'bootsnap', '>= 1.4.2', require: false
# Pagination
gem 'kaminari'
group :development, :test do
# Call 'byebug' anywhere in the code to stop execution and get a debugger console
gem 'byebug', platforms: [:mri, :mingw, :x64_mingw]
......
......@@ -88,6 +88,18 @@ GEM
concurrent-ruby (~> 1.0)
jbuilder (2.10.0)
activesupport (>= 5.0.0)
kaminari (1.2.0)
activesupport (>= 4.1.0)
kaminari-actionview (= 1.2.0)
kaminari-activerecord (= 1.2.0)
kaminari-core (= 1.2.0)
kaminari-actionview (1.2.0)
actionview
kaminari-core (= 1.2.0)
kaminari-activerecord (1.2.0)
activerecord
kaminari-core (= 1.2.0)
kaminari-core (1.2.0)
listen (3.1.5)
rb-fsevent (~> 0.9, >= 0.9.4)
rb-inotify (~> 0.9, >= 0.9.7)
......@@ -124,6 +136,10 @@ GEM
pry (0.13.0)
coderay (~> 1.1)
method_source (~> 1.0)
pry (0.13.0-java)
coderay (~> 1.1)
method_source (~> 1.0)
spoon (~> 0.0)
public_suffix (4.0.3)
puma (4.3.3)
nio4r (~> 2.0)
......@@ -184,6 +200,8 @@ GEM
selenium-webdriver (3.142.7)
childprocess (>= 0.5, < 4.0)
rubyzip (>= 1.2.2)
spoon (0.0.6)
ffi
spring (2.1.0)
spring-watcher-listen (2.0.1)
listen (>= 2.7, < 4.0)
......@@ -240,6 +258,7 @@ DEPENDENCIES
byebug
capybara (>= 2.15)
jbuilder (~> 2.7)
kaminari
listen (>= 3.0.5, < 3.2)
mysql2
pry
......
......@@ -6041,10 +6041,10 @@ ul.resumes .listing-favorited h3:before {
}
.companies-overview .company-group {
padding: 0 10px;
padding: 5px 10px;
width: 25%;
float: left;
display: inline
display: inline;
}
.company-letter {
......
......@@ -353,6 +353,19 @@ body {
visibility: visible;
}
nav.pagination span a, nav.pagination span.current{
text-decoration: none;
font: 400 13px/normal Montserrat, sans-serif;
text-align: center;
padding: 8px 13px;
border: 1px solid #ccc;
border-radius: 4px;
margin: 20px 5px;
display: inline-block;
}
nav.pagination span.current{
color: #7dc246;
}
@media screen and (min-width: 1200px) {
.job_listing-about, .resume-about {
width: 90%;
......
class CityController < ApplicationController
def index
@cities = City.all
end
end
class IndustryController < ApplicationController
def index
@industries = Industry.all
end
end
class JobController < ApplicationController
def index
if params[:city]
@jobs = Job.includes(:cities).where("cities.id = #{params[:city]}").references(:cities).page(params[:page])
@amount_job = Job.includes(:cities).where("cities.id = #{params[:city]}").references(:cities).count
elsif params[:industry]
@jobs = Job.includes(:industries).where("industries.id = #{params[:industry]}").references(:industries).page(params[:page])
@amount_job = Job.includes(:industries).where("industries.id = #{params[:industry]}").references(:industries).count
else
@jobs = Job.order("id DESC").page(params[:page])
@amount_job = Job.count
end
end
def show
@title = "Job Detail Page"
@job = Job.find(params[:id])
@relate_jobs = Job.where("company_id = #{@job.company_id} and id != #{@job.id}").limit(3).order("id DESC")
end
end
......@@ -6,19 +6,11 @@
<article id="post-2064" class="post-2064 page type-page status-publish hentry">
<div class="entry-content">
<ul class="companies-overview">
<li class="company-group">
<a href="https://jobify-demos.astoundify.com/classic/company/AdRoll/">AdRoll (1)</a>
</li>
<li class="company-group">
<a href="https://jobify-demos.astoundify.com/classic/company/AdRoll/">AdRoll (1)</a>
</li>
<li class="company-group">
<a href="https://jobify-demos.astoundify.com/classic/company/AdRoll/">AdRoll (1)</a>
</li>
<li class="company-group">
<a href="https://jobify-demos.astoundify.com/classic/company/AdRoll/">AdRoll (1)</a>
</li>
<% @cities.each do |city| %>
<li class="company-group">
<a href="/jobs?city=<%= city.id %>"><%= city.title %> (<%= city.jobs.length %>)</a>
</li>
<% end %>
</ul>
</div>
</article>
......
......@@ -48,33 +48,38 @@
<ul class="job_listings">
<% @latest_10_jobs.each do |job| %>
<li class="job_listing job-type-part-time post-3354 type-job_listing status-publish has-post-thumbnail hentry job_listing_category-design job_listing_type-part-time">
<a href="/job/<%= job.id %>" class="job_listing-clickbox"></a>
<div class="job_listing-logo">
<img class="company_logo" src="<%= job.company.logo %>" alt="<%= job.company.title %>" />
<a href="/job/<%= job.id %>">
<img class="company_logo" src="<%= job.company.logo != "" ? job.company.logo : "https://via.placeholder.com/66x38?text=Logo" %>" alt="<%= job.company.title %>" />
</a>
</div>
<div class="job_listing-about">
<div class="job_listing-position job_listing__column">
<h3 class="job_listing-title"><%= job.title %></h3>
<h3 class="job_listing-title">
<a href="/job/<%= job.id %>">
<%= job.title %>
</a>
</h3>
<div class="job_listing-company">
<strong><%= job.company.title%></strong>
</div>
</div>
<div class="job_listing-location job_listing__column">
<a class="google_map_link" href="#" target="_blank">
<% job.cities.each do |city| %>
<%= city.title %>
<% end %>
</a>
<% job.cities.each_with_index do |city, index| %>
<a class="google_map_link" href="/jobs?city=<%= city.id %>">
<%= city.title %><%= ", " if index != job.cities.length - 1 %>
</a>
<% end %>
</div>
<ul class="job_listing-meta job_listing__column">
<li class="job_listing-type job-type part-time"><%= job.salary %></li>
<li class="job_listing-date"><%= job.updated_date_job %></li>
<li class="job_listing-date"><%= job.expiration_date %></li>
</ul>
</div>
</li>
<% end %>
</ul>
<a class="load_more_jobs" href="#"><strong>Load more listings</strong></a>
<a class="load_more_jobs" href="/jobs"><strong>Load more listings</strong></a>
</div>
</div>
</div>
......@@ -107,11 +112,11 @@
<% @latest_8_cities.each do |city| %>
<li class="job-stat col-md-3 col-sm-6 col-xs-12">
<strong><%= city.jobs.length %></strong>
<%= city.title %>
<a href="/jobs?city=<%= city.id %>"><%= city.title %></a>
</li>
<% end %>
</ul>
<a class="load_more_jobs" href="#"><strong>Load more listings</strong></a>
<a class="load_more_jobs" href="/cities"><strong>Load more listings</strong></a>
</div>
</section>
<section id="jobify_widget_feature_callout-3" class="widget widget--home widget--home--no-margin jobify_widget_feature_callout widget--home-feature-callout">
......@@ -138,11 +143,11 @@
<% @latest_8_industries.each do |industry| %>
<li class="job-stat col-md-3 col-sm-6 col-xs-12">
<strong><%= industry.jobs.length %></strong>
<%= industry.title %>
<a href="/jobs?industry=<%= industry.id %>"><%= industry.title %></a>
</li>
<% end %>
</ul>
<a class="load_more_jobs" href="#"><strong>Load more listings</strong></a>
<a class="load_more_jobs" href="/industries"><strong>Load more listings</strong></a>
</div>
</section>
</div>
\ No newline at end of file
......@@ -6,19 +6,11 @@
<article id="post-2064" class="post-2064 page type-page status-publish hentry">
<div class="entry-content">
<ul class="companies-overview">
<% @industries.each do |industry| %>
<li class="company-group">
<a href="https://jobify-demos.astoundify.com/classic/company/AdRoll/">AdRoll (1)</a>
<a href="/jobs?industry=<%= industry.id %>"><%= industry.title %> (<%= industry.jobs.length %>)</a>
</li>
<li class="company-group">
<a href="https://jobify-demos.astoundify.com/classic/company/AdRoll/">AdRoll (1)</a>
</li>
<li class="company-group">
<a href="https://jobify-demos.astoundify.com/classic/company/AdRoll/">AdRoll (1)</a>
</li>
<li class="company-group">
<a href="https://jobify-demos.astoundify.com/classic/company/AdRoll/">AdRoll (1)</a>
</li>
<% end %>
</ul>
</div>
</article>
......
......@@ -27,240 +27,44 @@
<input type="submit" name="submit" value="Search">
</div>
</div>
<div class="showing_jobs"></div>
<div class="showing_jobs">
<span>Search completed. Found <%= @amount_job %> matching records.</span>
</div>
</form>
<noscript>Your browser does not support JavaScript, or it is disabled. JavaScript must be enabled in order to view listings.</noscript>
<ul class="job_listings">
<li id="job_listing-3354" class="job_listing job-type-part-time post-3354 type-job_listing status-publish has-post-thumbnail hentry job_listing_category-design job_listing_type-part-time" data-longitude="-94.5785667" data-latitude="39.0997265" data-title="Art Director at Shopify" data-href="https://jobify-demos.astoundify.com/classic/job/art-director-2/" style="visibility: visible;">
<a href="https://jobify-demos.astoundify.com/classic/job/art-director-2/" class="job_listing-clickbox"></a>
<div class="job_listing-logo">
<img class="company_logo" src="https://jobify-demos.astoundify.com/classic/wp-content/uploads/sites/2/2014/03/company-logo-shopify-150x150.jpg" alt="Shopify">
</div>
<div class="job_listing-about">
<div class="job_listing-position job_listing__column">
<h3 class="job_listing-title">Art Director</h3>
<div class="job_listing-company">
<strong>Shopify</strong>
</div>
</div>
<div class="job_listing-location job_listing__column">
<a class="google_map_link" href="http://maps.google.com/maps?q=Kansas+City&amp;zoom=14&amp;size=512x512&amp;maptype=roadmap&amp;sensor=false" target="_blank">Kansas City, Missouri</a>
</div>
<ul class="job_listing-meta job_listing__column">
<li class="job_listing-type job-type part-time">Part Time</li>
<li class="job_listing-date">Posted 6 years ago</li>
</ul>
</div>
</li>
<li id="job_listing-3350" class="job_listing job-type-full-time post-3350 type-job_listing status-publish has-post-thumbnail hentry job_listing_category-design job_listing_type-full-time" data-longitude="-74.0059413" data-latitude="40.7127837" data-title="Web Designer at Squarespace" data-href="https://jobify-demos.astoundify.com/classic/job/squarespace-com/" style="visibility: visible;">
<a href="https://jobify-demos.astoundify.com/classic/job/squarespace-com/" class="job_listing-clickbox"></a>
<div class="job_listing-logo">
<img class="company_logo" src="https://jobify-demos.astoundify.com/classic/wp-content/uploads/sites/2/2014/03/company-logo-sspace-150x150.jpg" alt="Squarespace">
</div>
<div class="job_listing-about">
<div class="job_listing-position job_listing__column">
<h3 class="job_listing-title">Web Designer</h3>
<div class="job_listing-company">
<strong>Squarespace</strong>
</div>
</div>
<div class="job_listing-location job_listing__column">
<a class="google_map_link" href="http://maps.google.com/maps?q=New+York&amp;zoom=14&amp;size=512x512&amp;maptype=roadmap&amp;sensor=false" target="_blank">New York, New York</a>
</div>
<ul class="job_listing-meta job_listing__column">
<li class="job_listing-type job-type full-time">Full Time</li>
<li class="job_listing-date">Posted 6 years ago</li>
</ul>
</div>
</li>
<li id="job_listing-3348" class="job_listing job-type-part-time post-3348 type-job_listing status-publish has-post-thumbnail hentry job_listing_category-developement job_listing_type-part-time" data-longitude="-79.6441198" data-latitude="43.5890452" data-title="Web Developer at Optimizely" data-href="https://jobify-demos.astoundify.com/classic/job/web-developer/" style="visibility: visible;">
<a href="https://jobify-demos.astoundify.com/classic/job/web-developer/" class="job_listing-clickbox"></a>
<div class="job_listing-logo">
<img class="company_logo" src="https://jobify-demos.astoundify.com/classic/wp-content/uploads/sites/2/2014/03/company-logo-optimizely-150x150.jpg" alt="Optimizely">
</div>
<div class="job_listing-about">
<div class="job_listing-position job_listing__column">
<h3 class="job_listing-title">Web Developer</h3>
<div class="job_listing-company">
<strong>Optimizely</strong>
</div>
</div>
<div class="job_listing-location job_listing__column">
<a class="google_map_link" href="http://maps.google.com/maps?q=Mississauga&amp;zoom=14&amp;size=512x512&amp;maptype=roadmap&amp;sensor=false" target="_blank">Mississauga, Ontario</a>
</div>
<ul class="job_listing-meta job_listing__column">
<li class="job_listing-type job-type part-time">Part Time</li>
<li class="job_listing-date">Posted 6 years ago</li>
</ul>
</div>
</li>
<li id="job_listing-3346" class="job_listing job-type-full-time post-3346 type-job_listing status-publish has-post-thumbnail hentry job_listing_category-marketing job_listing_type-full-time" data-longitude="-79.0203732" data-latitude="43.8508553" data-title="Marketing Director at OkCupid" data-href="https://jobify-demos.astoundify.com/classic/job/marketing-director/" style="visibility: visible;">
<a href="https://jobify-demos.astoundify.com/classic/job/marketing-director/" class="job_listing-clickbox"></a>
<div class="job_listing-logo">
<img class="company_logo" src="https://jobify-demos.astoundify.com/classic/wp-content/uploads/sites/2/2014/03/company-logo-okcupid-150x150.jpg" alt="OkCupid">
</div>
<div class="job_listing-about">
<div class="job_listing-position job_listing__column">
<h3 class="job_listing-title">Marketing Director</h3>
<div class="job_listing-company">
<strong>OkCupid</strong> <span class="job_listing-company-tagline">Delivering bite-sized, mobile learning content for the modern student.</span>
</div>
</div>
<div class="job_listing-location job_listing__column">
<a class="google_map_link" href="http://maps.google.com/maps?q=Ajax&amp;zoom=14&amp;size=512x512&amp;maptype=roadmap&amp;sensor=false" target="_blank">Ajax, Ontario</a>
</div>
<ul class="job_listing-meta job_listing__column">
<li class="job_listing-type job-type full-time">Full Time</li>
<li class="job_listing-date">Posted 6 years ago</li>
</ul>
</div>
</li>
<li id="job_listing-3344" class="job_listing job-type-freelance post-3344 type-job_listing status-publish has-post-thumbnail hentry job_listing_category-design job_listing_type-freelance" data-longitude="-79.0867579" data-latitude="43.8384117" data-title="Website Designer at Pinterest" data-href="https://jobify-demos.astoundify.com/classic/job/website-designer/" style="visibility: visible;">
<a href="https://jobify-demos.astoundify.com/classic/job/website-designer/" class="job_listing-clickbox"></a>
<div class="job_listing-logo">
<img class="company_logo" src="https://jobify-demos.astoundify.com/classic/wp-content/uploads/sites/2/2014/03/company-logo-pinterest-150x150.jpg" alt="Pinterest">
</div>
<div class="job_listing-about">
<div class="job_listing-position job_listing__column">
<h3 class="job_listing-title">Website Designer</h3>
<div class="job_listing-company">
<strong>Pinterest</strong>
</div>
</div>
<div class="job_listing-location job_listing__column">
<a class="google_map_link" href="http://maps.google.com/maps?q=Pickering%2C+Canada&amp;zoom=14&amp;size=512x512&amp;maptype=roadmap&amp;sensor=false" target="_blank">Pickering, Ontario</a>
</div>
<ul class="job_listing-meta job_listing__column">
<li class="job_listing-type job-type freelance">Freelance</li>
<li class="job_listing-date">Posted 6 years ago</li>
</ul>
</div>
</li>
<li id="job_listing-3342" class="job_listing job-type-full-time post-3342 type-job_listing status-publish has-post-thumbnail hentry job_listing_category-developement job_listing_type-full-time" data-longitude="-79.3370188" data-latitude="43.8561002" data-title="Front End Developer - Digital Arts at CodePen" data-href="https://jobify-demos.astoundify.com/classic/job/front-end-developer-digital-arts/" style="visibility: visible;">
<a href="https://jobify-demos.astoundify.com/classic/job/front-end-developer-digital-arts/" class="job_listing-clickbox"></a>
<div class="job_listing-logo">
<img class="company_logo" src="https://jobify-demos.astoundify.com/classic/wp-content/uploads/sites/2/2014/03/company-logo-codepen-150x150.jpg" alt="CodePen">
</div>
<div class="job_listing-about">
<div class="job_listing-position job_listing__column">
<h3 class="job_listing-title">Front End Developer – Digital Arts</h3>
<div class="job_listing-company">
<strong>CodePen</strong>
<% @jobs.each do |job| %>
<li class="job_listing job-type-part-time post-3354 type-job_listing status-publish has-post-thumbnail hentry job_listing_category-design job_listing_type-part-time">
<div class="job_listing-logo">
<a href="/job/<%= job.id %>">
<img class="company_logo" src="<%= job.company.logo != "" ? job.company.logo : "https://via.placeholder.com/66x38?text=Logo" %>" alt="<%= job.company.title %>">
</a>
</div>
<div class="job_listing-about">
<div class="job_listing-position job_listing__column">
<h3 class="job_listing-title">
<a href="/job/<%= job.id %>"><%= job.title %></a>
</h3>
<div class="job_listing-company">
<strong><%= job.company.title %></strong>
</div>
</div>
</div>
<div class="job_listing-location job_listing__column">
<a class="google_map_link" href="http://maps.google.com/maps?q=Markham&amp;zoom=14&amp;size=512x512&amp;maptype=roadmap&amp;sensor=false" target="_blank">Markham, Ontario</a>
</div>
<ul class="job_listing-meta job_listing__column">
<li class="job_listing-type job-type full-time">Full Time</li>
<li class="job_listing-date">Posted 6 years ago</li>
</ul>
</div>
</li>
<li id="job_listing-3252" class="job_listing job-type-full-time post-3252 type-job_listing status-publish has-post-thumbnail hentry job_listing_category-design job_listing_category-developement job_listing_type-full-time" data-longitude="-122.4702079" data-latitude="37.6879241" data-title="API Engineer at Behance" data-href="https://jobify-demos.astoundify.com/classic/job/api-engineer/" style="visibility: visible;">
<a href="https://jobify-demos.astoundify.com/classic/job/api-engineer/" class="job_listing-clickbox"></a>
<div class="job_listing-logo">
<img class="company_logo" src="https://jobify-demos.astoundify.com/classic/wp-content/uploads/sites/2/2014/03/company-logo-behance-150x150.jpg" alt="Behance">
</div>
<div class="job_listing-about">
<div class="job_listing-position job_listing__column">
<h3 class="job_listing-title">API Engineer</h3>
<div class="job_listing-company">
<strong>Behance</strong> <span class="job_listing-company-tagline">Use the internet to get off the internet</span>
</div>
</div>
<div class="job_listing-location job_listing__column">
<a class="google_map_link" href="http://maps.google.com/maps?q=Daly+City&amp;zoom=14&amp;size=512x512&amp;maptype=roadmap&amp;sensor=false" target="_blank">Daly City, California</a>
</div>
<ul class="job_listing-meta job_listing__column">
<li class="job_listing-type job-type full-time">Full Time</li>
<li class="job_listing-date">Posted 6 years ago</li>
</ul>
</div>
</li>
<li id="job_listing-3249" class="job_listing job-type-freelance post-3249 type-job_listing status-publish has-post-thumbnail hentry job_listing_category-design job_listing_category-developement job_listing_type-freelance" data-longitude="-122.7140548" data-latitude="38.440429" data-title="UX Designer at Aol." data-href="https://jobify-demos.astoundify.com/classic/job/ux-designer/" style="visibility: visible;">
<a href="https://jobify-demos.astoundify.com/classic/job/ux-designer/" class="job_listing-clickbox"></a>
<div class="job_listing-logo">
<img class="company_logo" src="https://jobify-demos.astoundify.com/classic/wp-content/uploads/sites/2/2014/03/company-logo-aol-150x150.jpg" alt="Aol.">
</div>
<div class="job_listing-about">
<div class="job_listing-position job_listing__column">
<h3 class="job_listing-title">UX Designer</h3>
<div class="job_listing-company">
<strong>Aol.</strong> <span class="job_listing-company-tagline">Smile, you're designed to.</span>
</div>
</div>
<div class="job_listing-location job_listing__column">
<a class="google_map_link" href="http://maps.google.com/maps?q=Santa+Rosa&amp;zoom=14&amp;size=512x512&amp;maptype=roadmap&amp;sensor=false" target="_blank">Santa Rosa, California</a>
</div>
<ul class="job_listing-meta job_listing__column">
<li class="job_listing-type job-type freelance">Freelance</li>
<li class="job_listing-date">Posted 6 years ago</li>
</ul>
</div>
</li>
<li id="job_listing-3246" class="job_listing job-type-temporary post-3246 type-job_listing status-publish has-post-thumbnail hentry job_listing_category-design job_listing_category-developement job_listing_type-temporary" data-longitude="-121.4943996" data-latitude="38.5815719" data-title="Web Designer / Developer at AdRoll" data-href="https://jobify-demos.astoundify.com/classic/job/web-designer-developer/" style="visibility: visible;">
<a href="https://jobify-demos.astoundify.com/classic/job/web-designer-developer/" class="job_listing-clickbox"></a>
<div class="job_listing-logo">
<img class="company_logo" src="https://jobify-demos.astoundify.com/classic/wp-content/uploads/sites/2/2014/03/company-logo-adroll-150x150.jpg" alt="AdRoll">
</div>
<div class="job_listing-about">
<div class="job_listing-position job_listing__column">
<h3 class="job_listing-title">Web Designer / Developer</h3>
<div class="job_listing-company">
<strong>AdRoll</strong> <span class="job_listing-company-tagline">Full-service graphic design for print and web</span>
<div class="job_listing-location job_listing__column">
<% job.cities.each_with_index do |city, index| %>
<a class="google_map_link" href="/jobs?city=<%= city.id %>"><%= city.title %></a><%= ", " if index != job.cities.length - 1 %>
<% end %>
</div>
<ul class="job_listing-meta job_listing__column">
<li class="job_listing-type job-type part-time"><%= job.salary %></li>
<li class="job_listing-date"><%= job.expiration_date %></li>
</ul>
</div>
<div class="job_listing-location job_listing__column">
<a class="google_map_link" href="http://maps.google.com/maps?q=Sacramento&amp;zoom=14&amp;size=512x512&amp;maptype=roadmap&amp;sensor=false" target="_blank">Sacramento, California</a>
</div>
<ul class="job_listing-meta job_listing__column">
<li class="job_listing-type job-type temporary">Temporary</li>
<li class="job_listing-date">Posted 6 years ago</li>
</ul>
</div>
</li>
<li id="job_listing-1728" class="job_listing job-type-part-time post-1728 type-job_listing status-publish has-post-thumbnail hentry job_listing_category-design job_listing_type-part-time" data-longitude="-122.4147977" data-latitude="37.7598648" data-title="Graphic Designer at Disqus" data-href="https://jobify-demos.astoundify.com/classic/job/graphic-designer/" style="visibility: visible;">
<a href="https://jobify-demos.astoundify.com/classic/job/graphic-designer/" class="job_listing-clickbox"></a>
<div class="job_listing-logo">
<img class="company_logo" src="https://jobify-demos.astoundify.com/classic/wp-content/uploads/sites/2/2016/04/company-logo-disqus-150x150.jpg" alt="Disqus">
</div>
<div class="job_listing-about">
<div class="job_listing-position job_listing__column">
<h3 class="job_listing-title">Graphic Designer</h3>
<div class="job_listing-company">
<strong>Disqus</strong> <span class="job_listing-company-tagline">Unlock the city</span>
</div>
</div>
<div class="job_listing-location job_listing__column">
<a class="google_map_link" href="http://maps.google.com/maps?q=Mission+District&amp;zoom=14&amp;size=512x512&amp;maptype=roadmap&amp;sensor=false" target="_blank">San Francisco, California</a>
</div>
<ul class="job_listing-meta job_listing__column">
<li class="job_listing-type job-type part-time">Part Time</li>
<li class="job_listing-date">Posted 7 years ago</li>
</ul>
</div>
</li>
</li>
<% end %>
</ul>
<a class="load_more_jobs" href="#" style="display:none;"><strong>Load more listings</strong></a>
<div class="job-manager-pagination">
<ul>
<li>
<a href="" class="current page-numbers">1</a>
</li>
<li>
<a href="" class="page-numbers">2</a>
</li>
<li>
<a href="" class="page-numbers">3</a>
</li>
<li>
<a href="" class="page-numbers">4</a>
</li>
<li>
<a href="" class="page-numbers">5</a>
</li>
</ul>
<%= paginate @jobs %>
</div>
</div>
</div>
......
<% content_for :title, @title %>
<% content_for :title, @job.title %>
<div class="single_job_listing">
<div class="page-header">
<h1 class="page-title">
Art Director
<%= @job.title %>
</h1>
<h3 class="page-subtitle">
<ul class="job-listing-meta meta">
<li class="job-type part-time">Part Time</li>
<li class="location"><a class="google_map_link" href="http://maps.google.com/maps?q=Kansas+City&#038;zoom=14&#038;size=512x512&#038;maptype=roadmap&#038;sensor=false" target="_blank">Kansas City, Missouri</a></li>
<li class="date-posted">Posted 6 years ago</li>
<li class="job-type part-time"><%= "Salary: " + @job.salary %></li>
<li class="location">
<% @job.cities.each_with_index do |city, index| %>
<a class="google_map_link" href="/city/<%= city.id %>"><%= city.title %></a><%= "," if index != @job.cities.length - 1 %>
<% end %>
</li>
<li class="date-posted"><%= @job.expiration_date %></li>
<li class="job-company">
<a href="https://jobify-demos.astoundify.com/classic/company/Shopify/" target="_blank">Shopify</a>
<%= @job.company.title %>
</li>
</ul>
</h3>
</div>
<div id="content" class="container content-area" role="main">
<div class="job-overview-content row">
<div class="job_listing-description job-overview col-md-10 col-sm-12">
<h2 class="widget-title widget-title--job_listing-top job-overview-title">Overview</h2>
<h3><img class="alignnone size-full wp-image-99991317" src="https://jobify-demos.astoundify.com/classic/wp-content/uploads/sites/2/2014/03/hero-job-image.jpg" alt="hero-job-image" width="1110" height="342" /></h3>
<h4>Company Description</h4>
<p>Company is a 2016 Iowa City-born start-up that develops consectetuer adipiscing elit. Phasellus hendrerit. Pellentesque aliquet nibh nec urna. In nisi neque, aliquet vel, dapibus id, mattis vel, nisi. Sed pretium, ligula sollicitudin laoreet viverra, tortor libero sodales leo, eget blandit nunc tortor eu nibh. Nullam mollis. Ut justo. Suspendisse potenti.</p>
<p>Sed egestas, ante et vulputate volutpat, eros pede semper est, vitae luctus metus libero eu augue. Morbi purus libero, faucibus adipiscing, commodo quis, gravida id, est. Sed lectus. Praesent elementum hendrerit tortor. Sed semper lorem at felis. Vestibulum volutpat, lacus a ultrices sagittis, mi neque euismod dui, eu pulvinar nunc sapien ornare nisl. Phasellus pede arcu, dapibus eu, fermentum et, dapibus sed, urna.</p>
<p>Morbi interdum mollis sapien. Sed ac risus. Phasellus lacinia, magna a ullamcorper laoreet, lectus arcu pulvinar risus, vitae facilisis libero dolor a purus. Sed vel lacus. Mauris nibh felis, adipiscing varius, adipiscing in, lacinia vel, tellus. Suspendisse ac urna. Etiam pellentesque mauris ut lectus. Nunc tellus ante, mattis eget, gravida vitae, ultricies ac, leo. Integer leo pede, ornare a, lacinia eu, vulputate vel, nisl.</p>
<p>Suspendisse mauris. Fusce accumsan mollis eros. Pellentesque a diam sit amet mi ullamcorper vehicula. Integer adipiscing risus a sem. Nullam quis massa sit amet nibh viverra malesuada. Nunc sem lacus, accumsan quis, faucibus non, congue vel, arcu. Ut scelerisque hendrerit tellus. Integer sagittis. Vivamus a mauris eget arcu gravida tristique. Nunc iaculis mi in ante. Vivamus imperdiet nibh feugiat est.</p>
<h3>Job Description</h3>
<p>As Marketing Graphic Designer, your primary responsibility is to assist the Marketing and Social Media team with a variety of graphic design tasks ranging from email, ads, print, and website design. You will be responsible to take a set of instructions, or a stated problem, and produce clean, modern design assets that are within the brand requirements of our company and our products. As part of the process, this person will collaborate with members of the marketing, design and product teams to gain a clear understanding of the campaign expectations, target audience, and product positioning.</p>
<p>The right candidate will possess video production and editing skills. You will work with the marketing and social media team in the video production cycle from pre-production planning through post-production editing (video training available).</p>
<p>Design work will be completed in a timely fashion, largely unsupervised short of regular design feedback, and meet the stated requirements of the requestor/stakeholder.</p>
<p>For website design, a basic level of coding is required in order to turn designs into live websites.</p>
<h4>Key Objectives</h4>
<ul>
<li>Take a set of instructions or a stated problem and produce clean, modern design assets that are within the brand requirements of our company and our products.</li>
</ul>
<h4>Primary Areas of Accountability</h4>
<ul>
<li>Collaborate with the Marketing Manager to deliver effective, direct response e-mail designs for marketing campaigns</li>
<li>Work with stakeholders from sales and marketing to design print materials, including sales brochures and mailers</li>
<li>Work closely with the CMO and in-house design team, taking direction on our new website design for corporate and product sites, including writing HTML and CSS</li>
<li>Work closely with the CMO and in-house design team to compile the corporate and product family branding style guides (icons, color palettes, etc)</li>
<li>Develop design assets for new product launches, including screenshots and icons for app store listings</li>
<li>Design on request for various needs across the company, including graphics for e-books, online stores, social accounts, presentations, ads, collateral, etc.</li>
</ul>
<h4>Required Knowledge, Skills, and Abilities</h4>
<ul>
<li>Ability to write code &#8211; HTML &amp; CSS (SCSS flavor of SASS preferred when writing CSS)</li>
<li>Proficient in Photoshop, Illustrator, bonus points for familiarity with Sketch (Sketch is our preferred concepting tool)</li>
<li>Cross-browser and platform testing as standard practice</li>
<li>Experience using Invision a plus</li>
<li>Experience in video production a plus or, at a minimum, a willingness to learn</li>
</ul>
<h4>Education + Experience</h4>
<ul>
<li>Advanced degree or equivalent experience in graphic and web design</li>
<li>3 or more years of professional design experience</li>
<li>Direct response email experience</li>
<li>Ecommerce website design experience</li>
<li>Familiarity with mobile and web apps preferred</li>
<li>Excellent communication skills, most notably a demonstrated ability to solicit and address creative and design feedback</li>
<li>Must be able to work under pressure and meet deadlines while maintaining a positive attitude and providing exemplary customer service</li>
<li>Ability to work independently and to carry out assignments to completion within parameters of instructions given, prescribed routines, and standard accepted practices</li>
</ul>
<div class="job_listing-description job-overview col-md-9 col-sm-12">
<%= raw(@job.job_description) %>
</div>
<div class="job-meta col-md-2 col-sm-6 col-xs-12">
<aside class="widget widget--job_listing"><a href="https://jobify-demos.astoundify.com/classic/company/Shopify/" target="_blank"><img class="company_logo" src="https://jobify-demos.astoundify.com/classic/wp-content/uploads/sites/2/2014/03/company-logo-shopify.jpg" alt="Shopify" /></a></aside>
<div class="job-meta col-md-3 col-sm-6 col-xs-12">
<aside class="widget widget--job_listing">
<div class="job-type part-time term-3">Part Time</div>
<img class="company_logo" src="<%= @job.company.logo != "" ? @job.company.logo : "" %>" alt="<%= @job.company.title %>" />
</aside>
<aside class="widget widget--job_listing">
<div class="job_application application">
<input type="button" class="application_button button" value="Apply for job" />
<div class="application_details">
<div id="ninja_forms_form_1_cont" class="ninja-forms-cont">
<div id="ninja_forms_form_1_wrap" class="ninja-forms-form-wrap">
<div id="ninja_forms_form_1_response_msg" style="" class="ninja-forms-response-msg "></div>
<form id="ninja_forms_form_1" enctype="multipart/form-data" method="post" name="" action="https://jobify-demos.astoundify.com/classic/wp-admin/admin-ajax.php?action=ninja_forms_ajax_submit" class="ninja-forms-form">
<input type="hidden" id="_wpnonce" name="_wpnonce" value="11bf6c37f9" /><input type="hidden" name="_wp_http_referer" value="/classic/job/art-director-2/" /> <input type="hidden" name="_ninja_forms_display_submit" value="1">
<input type="hidden" name="_form_id" id="_form_id" value="1">
<div class="hp-wrap">
<label>If you are a human and are seeing this field, please leave it blank. <input type="text" value="" name="_x3e2K">
<input type="hidden" value="_x3e2K" name="_hp_name">
</label>
</div>
<div id="ninja_forms_form_1_all_fields_wrap" class="ninja-forms-all-fields-wrap">
<div class="ninja-forms-required-items">Fields marked with an <span class="ninja-forms-req-symbol">*</span> are required</div>
<div class="field-wrap text-wrap label-above" id="ninja_forms_field_1_div_wrap" data-visible="1">
<input type="hidden" id="ninja_forms_field_1_type" value="text">
<label for="ninja_forms_field_1" id="ninja_forms_field_1_label" class="">Name <span class='ninja-forms-req-symbol'><strong>*</strong></span> </label>
<input id="ninja_forms_field_1" data-mask="" data-input-limit="" data-input-limit-type="char" data-input-limit-msg="" name="ninja_forms_field_1" type="text" placeholder="" class="ninja-forms-field ninja-forms-req " value="" rel="1" />
<div id="ninja_forms_field_1_error" style="display:none;" class="ninja-forms-field-error">
</div>
</div>
<div class="field-wrap text-wrap label-above" id="ninja_forms_field_2_div_wrap" data-visible="1">
<input type="hidden" id="ninja_forms_field_2_type" value="text">
<label for="ninja_forms_field_2" id="ninja_forms_field_2_label" class="">Email <span class='ninja-forms-req-symbol'><strong>*</strong></span> </label>
<input id="ninja_forms_field_2" data-mask="" data-input-limit="" data-input-limit-type="char" data-input-limit-msg="" name="ninja_forms_field_2" type="text" placeholder="" class="ninja-forms-field ninja-forms-req email " value="" rel="2" />
<div id="ninja_forms_field_2_error" style="display:none;" class="ninja-forms-field-error">
</div>
</div>
<div class="field-wrap textarea-wrap label-above" id="ninja_forms_field_3_div_wrap" data-visible="1">
<input type="hidden" id="ninja_forms_field_3_type" value="textarea">
<label for="ninja_forms_field_3" id="ninja_forms_field_3_label" class="">Message <span class='ninja-forms-req-symbol'><strong>*</strong></span> <img class='ninja-forms-help-text' src="https://jobify-demos.astoundify.com/classic/wp-content/plugins/ninja-forms/deprecated/images/question-ico.gif" title="Your cover letter/message that will be sent to the employer." alt="Help Text">
</label>
<textarea name="ninja_forms_field_3" id="ninja_forms_field_3" class="ninja-forms-field ninja-forms-req" rel="3" data-input-limit="" data-input-limit-type="char" data-input-limit-msg=""></textarea>
<div id="ninja_forms_field_3_error" style="display:none;" class="ninja-forms-field-error">
</div>
</div>
<div class="field-wrap submit-wrap label-above" id="ninja_forms_field_4_div_wrap" data-visible="1">
<input type="hidden" id="ninja_forms_field_4_type" value="submit">
<div id="nf_submit_1">
<input type="submit" name="_ninja_forms_field_4" class="ninja-forms-field " id="ninja_forms_field_4" value="Submit Application" rel="4" >
</div>
<div id="nf_processing_1" style="display:none;">
<input type="submit" name="_ninja_forms_field_4" class="ninja-forms-field " id="ninja_forms_field_4" value="Processing" rel="4" disabled>
</div>
<div id="ninja_forms_field_4_error" style="display:none;" class="ninja-forms-field-error">
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
<div class="job-manager-form wp-job-manager-bookmarks-form">
<div><a class="bookmark-notice" href="https://jobify-demos.astoundify.com/classic/account/">Login to bookmark this Job</a></div>
<a class="bookmark-notice" href="https://jobify-demos.astoundify.com/classic/account/">Favorite</a>
</div>
</aside>
<aside class="widget widget--job_listing">
<h3 class="widget-title widget-title--job_listing">Company Social</h3>
<ul class="job_listing-company-social company-social">
<li><a href="https://www.shopify.com/" target="_blank" class="job_listing-website">
Website </a>
</li>
<li><a href="http://Shopify" target="_blank" class="job_listing-twitter">
Twitter </a>
</li>
<li><a href="https://www.facebook.com/Shopify" target="_blank" class="job_listing-facebook">
Facebook </a>
</li>
<h3 class="widget-title widget-title--job_listing">Company Information</h3>
<ul>
<li>Name: <%= @job.company.title %></li>
<li>Address: <%= @job.company.address %></li>
<li>Description: <%= @job.company.description %></li>
</ul>
</aside>
<aside class="widget widget--job_listing">
<div class="job_listing-categories"><a href="https://jobify-demos.astoundify.com/classic/job-category/design/" class="job-category">Design</a></div>
<h3 class="widget-title widget-title--job_listing">Industry</h3>
<div class="job_listing-categories">
<% @job.industries.each_with_index do |industry, index| %>
<a href="industry/<%= industry.id %>" class="job-category"><%= industry.title %></a>
<% end %>
</div>
</aside>
</div>
</div>
......@@ -151,69 +58,34 @@
<div class="related-jobs container">
<h3 class="widget-title widget--title-job_listing-top">Related Jobs</h3>
<ul class="job_listings related">
<li id="job_listing-3356" class="job_listing job-type-internship post-3356 type-job_listing status-publish has-post-thumbnail hentry job_listing_category-design job_listing_type-internship" data-longitude="-95.2352501" data-latitude="38.9716689" data-title="Graphic Designer at PayPal" data-href="https://jobify-demos.astoundify.com/classic/job/graphic-designer-3/">
<a href="https://jobify-demos.astoundify.com/classic/job/graphic-designer-3/" class="job_listing-clickbox"></a>
<div class="job_listing-logo">
<img class="company_logo" src="https://jobify-demos.astoundify.com/classic/wp-content/uploads/sites/2/2013/03/company-logo-paypal-150x150.jpg" alt="PayPal" />
</div>
<div class="job_listing-about">
<div class="job_listing-position job_listing__column">
<h3 class="job_listing-title">Graphic Designer</h3>
<div class="job_listing-company">
<strong>PayPal</strong>
</div>
</div>
<div class="job_listing-location job_listing__column">
<a class="google_map_link" href="http://maps.google.com/maps?q=Lawrence%2C+Kansas&#038;zoom=14&#038;size=512x512&#038;maptype=roadmap&#038;sensor=false" target="_blank">Lawrence, Kansas</a>
<% @relate_jobs.each do |job| %>
<li class="job_listing job-type-part-time post-3354 type-job_listing status-publish has-post-thumbnail hentry job_listing_category-design job_listing_type-part-time">
<div class="job_listing-logo">
<a href="/job/<%= job.id %>">
<img class="company_logo" src="<%= job.company.logo != "" ? job.company.logo : "https://via.placeholder.com/66x38?text=Logo" %>" alt="<%= job.company.title %>">
</a>
</div>
<ul class="job_listing-meta job_listing__column">
<li class="job_listing-type job-type internship">Internship</li>
<li class="job_listing-date">Posted 7 years ago</li>
</ul>
</div>
</li>
<li id="job_listing-3344" class="job_listing job-type-freelance post-3344 type-job_listing status-publish has-post-thumbnail hentry job_listing_category-design job_listing_type-freelance" data-longitude="-79.0867579" data-latitude="43.8384117" data-title="Website Designer at Pinterest" data-href="https://jobify-demos.astoundify.com/classic/job/website-designer/">
<a href="https://jobify-demos.astoundify.com/classic/job/website-designer/" class="job_listing-clickbox"></a>
<div class="job_listing-logo">
<img class="company_logo" src="https://jobify-demos.astoundify.com/classic/wp-content/uploads/sites/2/2014/03/company-logo-pinterest-150x150.jpg" alt="Pinterest" />
</div>
<div class="job_listing-about">
<div class="job_listing-position job_listing__column">
<h3 class="job_listing-title">Website Designer</h3>
<div class="job_listing-company">
<strong>Pinterest</strong>
<div class="job_listing-about">
<div class="job_listing-position job_listing__column">
<h3 class="job_listing-title">
<a href="/job/<%= job.id %>"><%= job.title %></a>
</h3>
<div class="job_listing-company">
<strong><%= job.company.title %></strong>
</div>
</div>
</div>
<div class="job_listing-location job_listing__column">
<a class="google_map_link" href="http://maps.google.com/maps?q=Pickering%2C+Canada&#038;zoom=14&#038;size=512x512&#038;maptype=roadmap&#038;sensor=false" target="_blank">Pickering, Ontario</a>
</div>
<ul class="job_listing-meta job_listing__column">
<li class="job_listing-type job-type freelance">Freelance</li>
<li class="job_listing-date">Posted 6 years ago</li>
</ul>
</div>
</li>
<li id="job_listing-3358" class="job_listing job-type-full-time post-3358 type-job_listing status-publish has-post-thumbnail hentry job_listing_category-design job_listing_type-full-time" data-longitude="-94.9224637" data-latitude="39.3111112" data-title="Interactive Designer at Instagram" data-href="https://jobify-demos.astoundify.com/classic/job/interactive-designer-2/">
<a href="https://jobify-demos.astoundify.com/classic/job/interactive-designer-2/" class="job_listing-clickbox"></a>
<div class="job_listing-logo">
<img class="company_logo" src="https://jobify-demos.astoundify.com/classic/wp-content/uploads/sites/2/2013/03/company-logo-instagram-150x150.jpg" alt="Instagram" />
</div>
<div class="job_listing-about">
<div class="job_listing-position job_listing__column">
<h3 class="job_listing-title">Interactive Designer</h3>
<div class="job_listing-company">
<strong>Instagram</strong>
<div class="job_listing-location job_listing__column">
<% job.cities.each_with_index do |city, index| %>
<a class="google_map_link" href="/city/<%= city.id %>"><%= city.title %></a><%= ", " if index != job.cities.length - 1 %>
<% end %>
</div>
<ul class="job_listing-meta job_listing__column">
<li class="job_listing-type job-type part-time"><%= job.salary %></li>
<li class="job_listing-date"><%= job.expiration_date %></li>
</ul>
</div>
<div class="job_listing-location job_listing__column">
<a class="google_map_link" href="http://maps.google.com/maps?q=Leavenworth%2C+Kansas&#038;zoom=14&#038;size=512x512&#038;maptype=roadmap&#038;sensor=false" target="_blank">Leavenworth, Kansas</a>
</div>
<ul class="job_listing-meta job_listing__column">
<li class="job_listing-type job-type full-time">Full Time</li>
<li class="job_listing-date">Posted 7 years ago</li>
</ul>
</div>
</li>
</li>
<% end %>
</ul>
</div>
</div>
\ No newline at end of file
<%# Link to the "First" page
- available local variables
url: url to the first page
current_page: a page object for the currently displayed page
total_pages: total number of pages
per_page: number of items to fetch per page
remote: data-remote
-%>
<span class="first">
<%= link_to_unless current_page.first?, t('views.pagination.first').html_safe, url, remote: remote %>
</span>
<%# Non-link tag that stands for skipped pages...
- available local variables
current_page: a page object for the currently displayed page
total_pages: total number of pages
per_page: number of items to fetch per page
remote: data-remote
-%>
<span class="page gap"><%= t('views.pagination.truncate').html_safe %></span>
<%# Link to the "Last" page
- available local variables
url: url to the last page
current_page: a page object for the currently displayed page
total_pages: total number of pages
per_page: number of items to fetch per page
remote: data-remote
-%>
<span class="last">
<%= link_to_unless current_page.last?, t('views.pagination.last').html_safe, url, remote: remote %>
</span>
<%# Link to the "Next" page
- available local variables
url: url to the next page
current_page: a page object for the currently displayed page
total_pages: total number of pages
per_page: number of items to fetch per page
remote: data-remote
-%>
<span class="next">
<%= link_to_unless current_page.last?, t('views.pagination.next').html_safe, url, rel: 'next', remote: remote %>
</span>
<%# Link showing page number
- available local variables
page: a page object for "this" page
url: url to this page
current_page: a page object for the currently displayed page
total_pages: total number of pages
per_page: number of items to fetch per page
remote: data-remote
-%>
<span class="page<%= ' current' if page.current? %>">
<%= link_to_unless page.current?, page, url, {remote: remote, rel: page.rel} %>
</span>
<%# The container tag
- available local variables
current_page: a page object for the currently displayed page
total_pages: total number of pages
per_page: number of items to fetch per page
remote: data-remote
paginator: the paginator that renders the pagination tags inside
-%>
<%= paginator.render do -%>
<nav class="pagination" role="navigation" aria-label="pager">
<%= first_page_tag unless current_page.first? %>
<%= prev_page_tag unless current_page.first? %>
<% each_page do |page| -%>
<% if page.display_tag? -%>
<%= page_tag page %>
<% elsif !page.was_truncated? -%>
<%= gap_tag %>
<% end -%>
<% end -%>
<% unless current_page.out_of_range? %>
<%= next_page_tag unless current_page.last? %>
<%= last_page_tag unless current_page.last? %>
<% end %>
</nav>
<% end -%>
<%# Link to the "Previous" page
- available local variables
url: url to the previous page
current_page: a page object for the currently displayed page
total_pages: total number of pages
per_page: number of items to fetch per page
remote: data-remote
-%>
<span class="prev">
<%= link_to_unless current_page.first?, t('views.pagination.previous').html_safe, url, rel: 'prev', remote: remote %>
</span>
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