add fav button

app/assets/stylesheets/custom.scss

@@ -123,3 +123,37 @@ html {
 .top_cities {
   margin: 20px;
 }
+
+/* job */
+
+.box {
+  border: solid 1px black;
+  margin: 10px;
+  padding: 5px;
+  .job_data {
+    width: 100%;
+    .job_data_row {
+      display: table;
+      width: 100%;
+      padding: 1px 0 0 0;
+      dt {
+        display: table-cell;
+        margin: 1px 0 0 0;
+        width: 100px;
+        padding: 0 0 0 8px;
+        font-weight: bold;
+        line-height: 32px;
+        vertical-align: top;
+      }
+      dd {
+        display: table-cell;
+        padding: 8px 3px 8px 8px;
+      }
+    }
+  }
+}
+
+dl, dt, dd {
+  list-style-type: none;
+  line-height: normal;
+}

app/views/jobs/_job.html.erb

-<div>
-  <%= job.title %>
-  <%= job.short_des %>
-  <%= job.salary %>
+<div class="box">
+  <div class="job_data">
+    <dl class="job_data_row">
+      <dt>Title</dt>
+      <dd><%= job.title %></dd>
+    </dl>
+    <dl class="job_data_row">
+      <dt>Short description</dt>
+      <dd><%= job.short_des %></dd>
+    </dl>
+    <dl class="job_data_row">
+      <dt>Salary</dt>
+      <dd><%= job.salary %></dd>
+    </dl>
+    <dl class="job_data_row">
+      <dt>Location</dt>
+      <dd><%= job.cities.first.name %></dd>
+    </dl>
+  </div>
+  <button type="button" class="btn btn-light">Favorite</button>
 </div>

app/views/jobs/index.html.erb

-<div class="container">
-  <h2>Total: </h2>
-  <h2>Result for: </h2>
-  <br>
+  <h3>Total: <%= Job.count %></h3>
+  <h3>Result for: </h3>
+
   <%= paginate @jobs %>
-  <table class="table">
-    <tbody>
-      <ul class="table">
-        <%= render partial: "jobs/job", collection: @jobs %>
-      </ul>
-    </tbody>
-  </table>
+
+  <%= render partial: "jobs/job", collection: @jobs %>
+
   <%= paginate @jobs %>
-</div>

config/settings.yml

 job:
-  per_page: 5
+  per_page: 20
 
 csv:
   file_path: "jobss.csv"