detail job

app/assets/stylesheets/application.scss

@@ -78,3 +78,45 @@ ul.class-name li {
   justify-content: flex-end;
   justify-content: flex-end;
 }
 }
 
 
+
+ul.breadcrumb {
+  padding: 10px 16px;
+  list-style: none;
+  background-color: #eee;
+}
+ul.breadcrumb li {
+  display: inline;
+  font-size: 18px;
+  color: #0275d8;
+}
+ul.breadcrumb li+li:before {
+  padding: 8px;
+  color: black;
+  content: "/\00a0";
+}
+ul.breadcrumb li a {
+  color: #0275d8;
+  text-decoration: none;
+}
+ul.breadcrumb li a:hover {
+
+  color: black;
+  text-decoration: underline;
+}
+
+.button {
+  background-color: #4CAF50; /* Green */
+  border: none;
+  color: white;
+  padding: 20px;
+  text-align: center;
+  text-decoration: none;
+  display: inline-block;
+  font-size: 16px;
+  margin: 4px 2px;
+  cursor: pointer;
+  align: center
+}
+
+.button1 {border-radius: 4px;}
+.button2 {border-radius: 4px;}

app/controllers/jobs_controller.rb

+class JobsController < ApplicationController
+  def detail
+    job_id = params[:id]
+    @job_detail = Job.find(job_id)
+  end
+end

app/models/job.rb

@@ -8,4 +8,5 @@ class Job < ApplicationRecord
   belongs_to :company
   belongs_to :company
   validates_presence_of :job_name
   validates_presence_of :job_name
   scope :latest_job, ->{order(:last_updated).first(5)}
   scope :latest_job, ->{order(:last_updated).first(5)}
+  #scope :detail_job, ->{joins(:company, :city).select('jobs.id,job_name,city_name,company_name,salary,description')}
 end
 end

app/views/jobs/detail.html.erb

+
+<div id="search" class="container p-5 my-2 bg-secondary text-white">
+  <!-- Search form -->
+<form class="form-inline md-form mr-auto mb-4">
+  <input class="form-control mr-sm-2" type="text" placeholder="Search" aria-label="Search">
+  <button class="btn btn-outline-warning btn-rounded btn-sm my-0" type="submit">Search</button>
+</form>
+
+</div>
+
+<div id="job_detail"class="container p-5 my-2 bg-secondary text-white">
+<ul class="breadcrumb">
+  <li><a href="#">Top</a></li>
+  <li><a href="#">City</a></li>
+  <li><a href="#">Industry</a></li>
+  <li><%= @job_detail.job_name  %></li>
+</ul>
+
+
+  <font color="red"><b><label > Job Detail:</label></b></font>
+  <ul>
+    <li><%= @job_detail.job_name  %></li>
+    <li><%= @job_detail.company.company_name  %></li>
+    <li><%= @job_detail.city.city_name  %></li>
+    <li><%= @job_detail.salary  %></li>
+    <li ><span class="text"><%= @job_detail.description  %></span>
+    </li>
+  </ul>
+
+  <button class="button button1">Apply</button>
+  <button class="button button2">Favorites</button>
+
+</div>
+
+
+

config/routes.rb

 Rails.application.routes.draw do
 Rails.application.routes.draw do
+  get '/detail/:id', to: 'jobs#detail'
   root 'top_page#index'
   root 'top_page#index'
   # For details on the DSL available within this file, see https://guides.rubyonrails.org/routing.html
   # For details on the DSL available within this file, see https://guides.rubyonrails.org/routing.html
   resources :top_page
   resources :top_page